courtneygaylord

Product Designer; Inspired by people: their habits, their experiences, their goals, their…

Podcasts; How to Personalize the Fastest Growing Audio Segment on Mobile

--

BACKGROUND

Audiobooks and podcasting are the fastest growing audio segments on mobile. Users who listen to audiobooks don’t have the benefits of dog-earing pages, highlighting excerpts or leaving notes on their favorite pages. They also lose the nostalgic aspects of owning a book and watching it age. This leaves a lot to be desired from the audio experience on mobile.

My wonderful partners and I were challenged to design a Podcasting mobile app that is highly personal, highly interactive and with the ability to bring even more utility to the user than a book ever could. Over the course of the article, I will outline our approach to solving the challenge, and the things we learned, tested, and iterated on to come up with our final product.

MY DESIGN PROCESS

We decided to use Human-Centered design as the foundation for building out our product, while supporting and iterating on the design by doing user research and gaining feedback.

STEP 1: EMPATHIZE

  1. Assumptions: Time to start thinking! I came up with a list of assumptions and also with a list of things that we already know. Once I did that, I started to think of the things that we don’t know and wanted to find out.

After brainstorming around these thoughts and ideas we came up with a plan to conduct research via interviews. We decided to target young professionals between the ages of 26–31.

2. Interviews: I always find interviews to be one of the best ways to empathize with your users, it allows you to better understand where they are coming from and relate the problems and struggles that they face on a daily basis. With the thoughts around our assumptions, what we know, and what we don’t know, we created an interview schedule and got to work! I, personally, interviewed 10 individuals (some in person and some over the phone). Here are some examples of the questions that we asked.

I learned a lot of insightful information while conducting these interviews. Some of the trends and takeaways that I found include:

  • Most people listened to either podcasts or audiobooks, but not both.
  • People listening to audiobooks often wanted to start listening to podcasts but didn’t know how to get started.
  • People mostly listen to audio while commuting.
  • People listen to audio both for educational and entertainment purposes.
  • Most of the podcasts people listened to were recommendations from friends, family, or colleagues.

Keeping these key findings in mind, I moved on to creating our persona and creative brief.

STEP 2: DEFINE

  1. Persona and Creative Brief: I wanted to develop a persona that we could use as guidance and reference through the entire design process. So I created a persona based off of the finding from our research as well as the knowledge I already had about podcasts and podcast users.

After creating the persona, I focused my attention on using her to drive our creative brief. And in turn, using both the persona and the creative brief as the backbone of our design.

STEP 3: IDEATE

  1. User Story Board: I loved this part! It was fun to start to see where all of our research was going to take us. While continuing to refer back to our persona, we created a user story board that included all of the features that would help solve the frustrations our persona was facing, helping her reach her goals. We got all of our ideas out on the board and then started focusing on prioritizing them, and ultimately narrowed it down to the minimal viable product (MVP) for the first release of our app.

Our MVP had a strong emphasis on three things:

  • A social way of experiencing podcasts.
  • Organizing, sharing, and archiving the content you want to listen to.
  • Highly personal podcast suggestions.

2. Sketching and Lo-Fi mockups

Watching your design ideas come to life is always a truly magical experience. I used the 10x10 sketching method to come up with a variety of different options for 3 main screens: The homepage, car mode, and the now listening page. This helped vet out many different options and ideas so we could focus in on what would be best for our persona and users.

Once we had come up with the ideas through sketching, we split up the screens and started working on Lo-Fidelity mockups so that we could start testing and gaining feed back. The screens I worked on were: home screen, browse, playlists, listen, and profile.

Time to gain feedback! We loaded up the Lo-Fi mockups into Invision and got to work. We each tested our designs with 3 different people. I told my testers to talk out loud as they were moving through the process and reassured them that they are not being tested, that this is about them and how the perceive the design… NO WRONG ANSWERS HERE! Below are the following tasks we asked them to accomplish:

  1. Onboarding: How does it make you feel?
  2. How would you go about listening to a podcast?
  3. How would you go about creating a playlist?
  4. How would you add a show or episode to a playlist?
  5. How do you save audio clips?
  6. Where would you go to find the audio clips that you saved?
  7. If you are trying to find a category of podcasts to choose from, where would you go?
  8. How would you share a podcast with your friends?
  9. What is your understanding of subscribed vs. favorites?
  10. How would you get to car mode, so you can safely listen to podcasts while you drive?

We gained a lot of key insights by having people test the tasks above. Some of the tasks worked just as expected but there were also changes we wanted to make when moving into our Hi-Fidelity mockups. Here is what we wanted to improve and iterate on:

  • Have a spot to add a playlist (oops, we forgot this!)
  • How to create an audio clip wasn’t clear
  • Change Audioclip Icon
  • Simplify the Episode List Screen (there were too many icons that were too close together and cluttering the screen)
  • Tell the user why we were asking for Facebook permissions
  • Add pages in the “favorites and subscribed” sections that showed what it looked like if nothing had been favored or subscribed to yet

Once we had identified these changes, we got to work creating the Hi-Fidelity mockups!

DESIGN

  1. Logo, Colors, and Topography: We decided to call our app “Castaway” because it played off of the word “Podcast” as well as referred to the idea that if you were a castaway, you would be lost in your thoughts, the same way you get lost in your thoughts when you listen to podcasts. After deciding the name, we decided to play off of this theme, and chose colors and a logo for our app that gave a tropical feel. For our font we used an apple standard, since we were designing an app for the iPhone, and went with SF Pro Display.

2. Hi-Fidelity Mockups: Once we had the feedback that we needed and the color palette and topography in place, we got to work turning our Lo-Fidelity mockups into Hi-Fidelity designs. We reference Apple’s Human Interface Guidelines constantly while making our app and it helped guide us in creating a better user experience. This was a whole lot of fun and I am really proud of the app that we created! See for yourself…

3. Prototype: After we designed all of the screens we loaded them up into Invision so that we could see how the flow of the screens worked together and do some more usability testing.

Click below to see the prototype:

Once we tested this, we made a few minor changes. I added a search bar to the “share” pop-up, changed some of the layout/colors on the profile page, switched out some inconsistent artwork, and made a few adjustments to some of the icons to make them more consistent across the app. All of these things will help in providing a better experience for the user.

CONCLUSION

I absolutely loved this project! As a big podcast listener myself, I was in tune to the short comings of current podcast app options and was extremely passionate about making the experience better, more personal, and more interactive for other podcast listeners. It was fun to do research and learn why people listen to podcasts and audiobooks and find out where they are getting their content suggestions from. It allowed me to empathize with them and want to create an app that makes their busy lives easier.

It was great to get to work on another project that allowed me to gain more experience in empathizing (assumptions and interviews), creating a persona and creative brief to help guide the project, developing a user story board, defining an MVP, sketching, Lo-Fidelity mockups, testing and more testing, design, Hi-Fidelity mockups, prototyping, more testing and iterating, and creating perspective screens. I am excited to see where these more refined skills will take my UX career!

TOOLS USED

Sketch, Invision, Trello, Balsamiq, RealTimeBoard, Paper and Pen, Sticky Notes, Adobe Color Wheel, Adobe Illustrator, Keynote, Material Design, Microsoft Word

THANK YOU

I couldn’t leave this project without giving thanks to my two incredible colleagues that were not only great to work with but are incredible visionaries, and designers. Thank you, Eric Lund and Nicholas Orchard, it was a pleasure working with you… I think we made something pretty incredible!

--

--

courtneygaylord
courtneygaylord

Published in courtneygaylord

Product Designer; Inspired by people: their habits, their experiences, their goals, their successes, and their challenges.

Courtney Gaylord
Courtney Gaylord

Written by Courtney Gaylord

Product designer and strategist; Inspired by people: their habits, their experiences, their goals, their successes, and their challenges.

No responses yet