Creating a home for BBC audio

Company
BBC

Platforms
iOS & Android

Date
2018

Challenge: define the Information Architecture (IA) and visual design of the library area of the BBC Sounds app - including the user journey & ecosystem for saving audio content. 

Outcome: 'My Sounds' - a reliable home within the app for user's saved content, that provides quick and easy playback.

How did I have impact?

01

Undertook guerilla research to quickly validate design decisions

02

Delivered a cohesive IA and wireframes to a tight deadline

03

Contributed to the brand development of BBC Sounds

Understanding the space

I began the project with a competitor analysis to learn about saving content and 'library' spaces within leading audio services. I was also able to draw upon a mental model map created from extensive research by the team's researcher. This helped me to gain an insight into what user's mindsets might be when they are saving content. 

Categorizing the content

After gaining an initial understanding of the space, myself and another designer then mapped out all the different types of audio content within the app (programmes, podcasts, music and radio). This helped us to understand the breadth of content within the app.

Categorizing the different content and mapping it out using post-it's

Creating a system

Mapping out all the content allowed us to develop a system. We decided user’s should ‘Subscribe’ to a series or radio programme (e.g. 'The Radio 1 Drum n' Bass Show'), or ‘Add’ an individual episode (later changed to ‘bookmark’ after user feedback!). These items would then appear in the dedicated sections of ‘My Sounds’.

Defining the UI pattern

After defining how a user should be able to save content, we then tackled the IA of 'My Sounds'. We began sketching out ideas and eventually whittled our ideas down to three different interaction models (pictured below). 

Initial rough sketches of interaction models

01

The first option was to use a carousel. Ultimately, I decided against this pattern as it felt like more of a discovery mechanism (and would take a lot of swiping!).

02

The second option was to have content organised under tabs. However I felt like this hid the content, and that the user may not tap to the other tabs.

03

The final option was a simple list. This was the pattern I chose as it felt like it was easy to access the different content types, and left space for a 'latest' section underneath.

Final UI pattern

The final IA and interaction model for 'My Sounds' consists of the three different categories of content organised into a list. User's can tap on each category to quickly find the relevant content. ‘Recent’ items (a combination of subscribed and added content) are displayed below the list for easy access and quick playback. 

Guerilla testing

We unfortunately didn’t have the budget to run lab-based testing on the My Sounds proposal. Instead myself and one other designer conducted guerilla user testing with seven participants. We found no major usability issues with the user journey of adding content and then accessing it later via My Sounds. Participants also understood the difference between adding (bookmarking was the preferred term so we changed to this) and subscribing. 

Visual design exploration

The user journey and information architecture for 'My Sounds' was now complete. I then began to explore final UI solutions based on the wireframes. At this point I also took part in a design sprint to explore how best to incorporate the new BBC Sounds brand into the UI.

'My Sounds' experience

The final experience offers an easily-accessible way for users to save content and then easily find it later.*

*NB: I did not create the final specs and visual design handoff, these were created once I had left the team.

See what we shipped*

*Available on Android too!