A mockup of an iPad and several iPhones with the bubble screens on a blue gradient background with a dark overlay.
Bubble - 2020

Designing a platform to connect like-minded people.

SEE DETAILS
Go Up
Overview

Connecting through topic based chats.

Bubble is a messaging app that uses topic based chat rooms to connect like-minded people. I sought to create an app with the purpose of encouraging lonely people to openly talk about things they like or dislike and interact with those who share the same.

Deliverables
Research, UI/UX, Visual Design
Learnings

Designing for human emotion

This project was a valuable experience in designing products for human emotion and value with the potential of adding new features for future growth.

The Approach

Focusing on value.

I wanted to focus on what personal value the app could provide to people. To help define the role of the app, I wanted to give people a deeper sense of community and encouragement that other messenger apps don’t.

When defining the audience, it was important that I took into consideration everyone who might use the app. I broke down three variables that would help categorize the audience, such as Frequency of Use, Participation Confidence, and Reason for Using.

A collection of the user experience process for bubble.
Design Testing

Design, test, and adjust.

Keeping the goal in mind, I wanted users to easily access new chat rooms that would interest them and friend people like them. The user flow map illustrates the app's functionality to help achieve and manage that goal.

A hi-fidelity prototype was made to generate a realistic reaction to the functionality of the app. A group of five people from the target audience assisted in the testing.

A mockup of various mobile screen designs for the bubble app.
Feedback

Insights for future iterations.

  • Majority of people thought that having a Recommended Section in Explore would be an efficient way to personalize their experience.

  • Some people were confused as to which page they were on from the navigation. One user commented that the “Messages” and “People” pages seemed too similar.

  • Some people thought that icons would help easily communicate functionality.

Changes were made to the design upon feedback. The mockups below are the final version made from feedback.

A screenshot of the various components of the bubble design system.A close up mockup of the sign in and log in pages for the bubble app.A hand holding an iPhone with the Bubble screen mocked up on the phone. Multiple screens lined up both on the left and right of the hand.