BRIEF

Project

Mobilize is a social media platform where users can engage in social and civil topics. This product aims to provide political visibility on politicians and propositions at the local, state and federal level while also providing a platform for personalized news. 

Task

Conduct usability testing to baseline the app’s effectiveness, efficiency, and satisfaction, then apply insights to drive iterative design improvements.

Role

Product Design

Year

2023

Toolkit

Adobe XD
Adobe Photoshop
Adobe Illustrator
Adobe Indesign
Miro

DISCOVERY

User Reseach

I began my research by developing a usability testing script, followed by recruiting participants for a moderated usability test. The goal was to establish a baseline understanding of user expectations and gather qualitative insights to inform a user-centered design approach.

Sampling Group: I interviewed 10 participants from diverse backgrounds, ages, and genders to ensure inclusive feedback. The group included professors, political science students, blue-collar workers, community organizers, and others, offering a well-rounded perspective.

SYNTHESIZE

Mapping the Research

I transcribed my video recordings and created a variant of an affinity map to help me synthesize my data. Participants are listed on the vertical axis and the user flow each participants goes through is placed on the horizontal axis. The wires helped me find common themes and gave me insight on new user pain points.

Made in Miro

SYNTHESIZE

Common Themes + Findings

I created a usability report that breaks down each phase of the mobile app that I tested. Starting with the onboarding and ending with overall feedback from the participants. The full report is over 14 pages long. Furthermore I captured each participants NPS score so stakeholders can baseline the apps overall value.

DISCOVERY

Redesign Opportunities

01

Feed

Make page more digestible and less busy.

02

Information Architecture

Synthesize  “People” and “Headlines”. Emphasize “Ballot”.

03

User Interface

Create a stronger brand identity.

BENCHMARKING

Competitive Analysis

I reviewed various news outlets and social media mobile platforms to benchmark the Mobilize's redesign. I reviewed apps like NPR, Axios, Google News, Nat Geo, Politico, Medium and more.

Key Takeaways

01. Navigation bar is placed on the bottom on the majority of mobile apps.

02. Content blocks that take more 50% of the viewport height appear to less cluttered, which improves readability,
‍
03. Search bar is optimized on the top navigation bar.

INSPIRATION

Moodboard

Low Fidelity Ideation

Wireframes

FINAL

Design Solution

Based on user feedback I began my redesign starting with synthesizing the information architecture. The second major change was recreating the “feed” to allow for greater readability. The last major change was introducing new UI elements, such creating  a new onboarding experience, refreshing existing UI elements, introducing new typography and style guide. 

REDESIGN 01

Onboarding Page

The homepage has been updated with a new sans-serif typeface, a black background, and a gradient from red to blue that maintains a consistent visual language with the previous design.

To increase contrast, the call to action for this page, which is to help users login or onboard to the app, has been emphasized. These updates provide a sleek and modern look while still maintaining usability and ease of navigation for the user.

REDESIGN 02

Feed Page

After receiving user feedback that the feed page was too condensed, I made several design changes to improve its usability. First, I moved the navigation bar to the bottom of the screen to make it easier for users to access the pages with their thumbs.

Next, I increased the width of the images to fit the viewport and also enlarged the heading and paragraph text for better legibility. To help users find relevant content more easily, I added a filter option at the top of the page. Overall, these changes made the feed page more user-friendly and improved the overall user experience.

REDESIGN 03

Ballots Page

I revamped the ballots page to ensure it matched the visual style of the rest of the app. I updated the typeface and added more padding between content blocks to improve the page's readability.

Additionally, I implemented a filter feature for politicians and propositions, which appears above the navigation bar to reduce clutter at the top of the page.

Thanks for viewing!

Special thanks to the Mobilize team