Bubbles

An UI project I did with a focus on discovering and bursting our filter bubble, which author Eli Praiser described as the state of intellectual isolation caused by digital personalization.

Case Study

Step 1: User research & sketches

Since the 2016 election, I started hearing people complain about how social media algorithms are preventing them from seeing opinions outside of their ‘preferences’. I started researching about the filter bubble and the effects it has on our brain, and it got me interested in creating an app that could potentially break that bubble.

I then dig into UX/UI research and started mapping out user personas, sketching out ideas and user flow diagram to visualize user journey and how that would work with the features I wanted to incorporate.

These are all the notes I have from start to finish, including notes from class critiques (click to enlarge).

Notes after initial feedback of the project idea presentation.

Notes about user flow diagram and features to include.

Step 2: User flow diagram

After receiving feedback from colleagues, I then use Sketch to draw up this user flow diagram, linking each screen together and putting down detailed notes about what its function is.

Step 3: Wireframe

I wanted the interface to look simple and clean, and for bubbles to take up most of the space. So I chose to utilize the simple + menu for users to easily access the main navigation, while keeping the interface clean and focused.

From my initial feedback, a received a lot of confusion as to what this app is about, what’s it for, and why would they use it? So I decided to do a walk through interface to demonstrate how to use it, and why they should use it.

Bubble (topic) of the day. Playing with the idea of bubbles stacking up on each other.

Step 4: Prototype & user test

After the wireframe, I designed the UI of the individual interface in Photoshop, then imported them to inVision in order to send out to colleagues and have them test the product. I observed them using the product while taking down notes, and interviewed them afterwards to get a sense of the usability of the app.

Walk through

Users will first land on their “bubble page“, calculated by the algorithm based on their social media activities. They can click onto any of the bubbles to discover what actions they made to generate this result, what other friends are in this bubble, and view more posts on this topic too.

Users will then get prompted to explore topics that are not within their current bubbles by clicking, or bursting!, the topic in the discover page. They can also browse through or search for their friend’s bubble, and further explore them.

Users will be able to look at their friend’s bubble page, and view their feed if they allow it in their privacy settings.

A bursted! page will display all the bubbles users have bursted in the past. There will also be a monthly contest between users and their friends to see who bursted the most bubbles.