Podcast App
Experience Design

Created an engaging podcast app for Mozilla

The Problem

Mozilla approached ZURB to create the "Netflix of Podcasts". They wanted the best podcast app, something unique, something to pull users in, and they wanted understanding of directions to monitize from the app.

The Solution

My team and I created a podcast app with the focus on the listening experience. We made it quick for the user to jump right back in where they left off. We personalized the content to the user's preferences, highlight the episode details, and we make it simple for users to scan through an episode and find what they are looking for.

Product Designer
6 Weeks
User Research
Ideation Sketching
User Journeys
UX Patterns
Visual Design
User Stories


User Research

Define Our Audiences

My team member and User Researcher identified 5 key personas that we consider as we move forward in our exploration of a podcast experience. Through surveying and polling listeners, I was able to hone in on unique perspectives that I curated the experience towards. Throughout the project, I constantly collaborated with the User Researcher on what concepts and designs I wanted to test with users.


The Beginner Listener

This listener has just recently tried podcasts and found they like the few they've listened to. They look for moments to continue listening to them in their free time and other moments it's convenience, however it isn't top of mind for them.


The Active Listener

This listener might also be considered a "power user" when it comes to podcasts. They are listening to absorb the information as best they can and they've been listening long enough to be great at integrating podcasts into their day to day routines.


The Apathetic Listener

The isolated listener is not about podcasts for the sake of podcasts. They are using them for entertainment and may be either a beginner or veteran podcast listener. Podcasts are also not the only form of audio media they will consume.


The Un-initiated Listener

The un-initiated listener is one who has not listened to a podcast. They don't have a specific reason not to, they just haven't had the opportunity or interest yet.


The Anti-podcast Listener

This persona is not interested in podcasts out of principal or some other specific reason. Their viewpoint is based on a past listens or simply what they've heard about podcasts.

Opening up the Problem

Explore Opportunities

I dove into Opportunity sketches to frame the problem space and open up the project to potential solutions. I presented about 50 sketches to understand our client's perspective of the problem and grasp the client's reaction to potential solutions.

Voice Control
Indication of Speakers
Onboarding Quiz

User Journeys

I created 12 User Journeys that focus on when and how users are entering into the app experience and what actions they're performing. I included the different personas to show how paths could change based on the user's varying behaviors.

Ben Finds Keyword Through Episode Search
Lexi Enjoys Listening Experience

User Interface Design through Lo-Fi Wireframes

I converted the Ideation Sketches into Lo-Fi Wireframes to concentrate on complete layouts and flows.

Our Solution

Visual Designs

I then applied a layer of Visuals to the Hi-Fi Wireframes to draw more attention to key areas and make the concepts more life-like for internal presentation.


User Stories and Animations

I created three specific User Stories that depict the powerful and valuable differentiators of the Mozilla Podcast App.

For these Users Stories, I started by writing out narratives, then created clickable prototypes in Marvel, and lastly applied visuals and created animation flows for 3 concepts. These concepts were then used internally at Mozilla for pitching for funding.

Episode-Based Discovery

Beginner Listener Ben is currently at home, about to take his dog, Roco for an evening walk. Ben opens the app and views the discovery page to find something to listen to, views a podcast, then selects that podcast’s starter pack, follows along with the transcript and finds the detailed show notes.

On-the-Go Listening Experience

Active Listener Adam gets into his car for his morning commute. Podcasts are his escape and his “me”time, and help him start the day. He enters into Hands Free Mode. Adam can see the recommended voice control options and is able to skip ahead and play the next episode while in the hands free mode.

Effortless Interactions

Active Listener Adam is currently at the airport waiting to board his plane to visit a client in St. Louis. He receives a text message from his friend, Jessica about the latest Joe Rogan Episode. He’s able to listen to the episode from the bookmarked spot as well as bookmark a moment later on and access his library to share the bookmark with Jessica.



Through this project, I accomplished these following goals:

  • Build on existing listening and audio studies/surveys to explore and validate the bigger vision of podcast app and ecosystem.

  • Started with the matrix of the online listening hierarchy of needs and where there are gaps in offering —areas could include apps, discovery, delivery or ecosystem. Explored content creation and the needs of the producer as well.

  • The visuals and user panel feedback will (1) help strategize the bigger vision and allow Mozilla to present internally with its exec team that vision, and will (2) enable the internal team to go out and start sanity checking some of the assumption from the supply side.

  • Output of the work and the accompanying business analysis from BD team could be used if we were to pitch the developer portal/hub concept internal funding.

More of My Work