Jabbo

Project Overview

Jabbo is a voice focused chat room based mobile application for digital design students, design professionals, and those who are just curious about digital design. The goal of the application is to allow for quick design feedback sessions and engagement of live conversations. With remote work and learning trending in popularity, audio voice chat becomes a key feature for the project as it helps to create a sense of connectivity and reduces information overload.

The Challenge

In education and in work, feedback is one of the most crucial components in making progression and improvements. Most digital design students and designers tend to ask for design feedback in only specific settings, such as classroom time and workplaces.

Social platforms such as Behance, Dribbble, Pinterest, and Instagram are excellent choices for large engagement with a focus on inspiration and portfolio purposes, but fail to provide the feedback that’s needed. On the other hand, Youtube and Skillshare are a few other platforms that offer proper tutorials with valid information, yet lack the interaction that often helps to facilitate and improve learning.

With this in mind,
how can we create a solution that focuses on offering learning opportunities and design feedback, yet allows for interaction between the users?

My Role

Project Duration

I took on the role of the Lead UX/UI Designer and Communications Designer.

User Research, Visual Design, Prototyping, User Testing

April - July, 2021

(4 Months)

Tools Used

The Process

Mind Map & High Level Market Research

I started off with some brainstorming and creating a mind map of potential items and topics that I can explore.


To get a sense of what solutions are currently out there in the market and to see how they are being used, I searched and performed some competitive analysis.

Contextual Research

With a general sense of direction, I proposed two hypotheses to steer the direction of my research:

We believe digital design students are frustrated by the lack of useful feedback because the person giving feedback doesn’t know how due to a difference in their backgrounds.

We believe digital design students are
frustrated by the inability to get feedback at the right time because they have trouble finding a person available to go to.

With this, I decided to conduct contextual interviews to get a better understanding of my users.

My primary focus is on digital design students with design professionals as second and non designers with an interest to learn design as third.
I decided to branch into two additional groups because of increased knowledge availability and that learning is the most efficient in numbers.

Digital Design Students

Design Professionals

Non Designers Learning Design

I interviewed three motion designers, one interactive designer, two design professionals (Branding and UX Design), and an elementary school teacher.

I created a list of qualitative interview questions that aim to understand my users’ design process and their daily routine behaviours.

For digital design students, I wanted to see what are their current tools and methods for obtaining design feedback, and why and when do they use them as well.

For
design professionals, I was looking into their work process and also their after work routine. Since I’m designing mainly for students, professionals may not have a desire to incorporate such a tool into their work routine. I needed to know if there is another factor that can push them into using such a tool.

For
non designers, I was looking into how they search and learn about designing in general. I wanted to see how often they need to use design and for what reason.

Insights and Analysis

The key insights from my affinity diagram are that:

There is a preference for convenience and accessibility when deciding the specific tools/methods to use for obtaining design feedback.

 


Tailor learning is most effective due to different skill levels and pacing.

 


Verbal conversations are the preferred way of communication when explanations are needed.

 


Have a creative social circle where they find trustworthy individuals with the right experience for feedback.

It’s about getting things done in the most reliable and fastest way possible.

From here I created an archetype and looked into a customer journey map and mental model.

Archetype & journey map & Mental Model.png

Researching Conclusion

Digital Design Students need to be able to quickly find an available designer with similar background for feedback, keep track of their discussion notes and files, and an easy way to reignite the same conversation if necessary.

Ideation

Features List, Site Map, User Flow

From the data that I’ve gathered, mobile application was my approach since it would tackle the accessibility needs of my users.

 

First I listed out all the potential features for my application.

 

Next I created a site map and user flow chart to understand the journey that my users will be taking and the screens that I will be creating.

FeaturesList-SiteMap-FlowChart.png

Low Fidelity Screens

I created a few screens of potential solutions to see how it could look and work.

Low Fidelity Sketches.png

Wireframes

With a few concepts going, I decided to focus design on three main flows: 

Joining a chat room and interacting inside

Joining A Room Wireframe.png

Creating a chat room

Chatroom Creation-Wireframes.png

Accessing design files and past self-hosted conversations

Validation/User Testing

Before moving onto high fidelity mockup, I wanted to conduct user testing to ensure that my application was functional and that the basic features covered the needs of my users.

4 Different Participants

3 User Flows & Other Features

Feedback included: three user flows made sense and easy to understand, library screens had sections that occupied too much space, profile screen needed more negative space, and needed better UX writting.

Visuals

Style Guide

I also made a style guide using atomic design to create an effective interface design system.

Visual Style Guide_Sorted.png

Branding

“We are a community driven platform that enables individuals to cultivate knowledge through meaningful conversations.”

Jabbo is a fun, bold, and dynamic brand and as such it is reflected in its lively name, its playful logo, and colour choices.

Logo Design_Portfolio Site.png

Final Design

High Fidelity Mockups

Prototype

Try it out:

Let's design the next great idea together!

Shine Bootcamp

Shine Bootcamp