There are a lot of platforms out there that offer music streaming as well as podcast streaming. Great for people on the go to keep them entertained through those horrible commutes through London. But there is a slight problem. Not very many platforms are utilising the ability to have both music and podcasts within one app. These companies are either solely focusing on podcasts or music. Classic examples are Google Podcasts, Apple podcasts, Acast, Overcast, Podcast Addict and a few others. There are some companies who have noticed this gap and have made attempts to bridge this in order to provide broader content to their users — Spotify, Deezer and Mixcloud.
Now, our project was based on SoundCloud. A competitor of Spotify, Deezer and Mixcloud, all of who provide the ability to stream music content. In order to bring SoundCloud into the same pool of companies who offer a wide variety of content, my team was tasked with implementing podcasts within the SoundCloud mobile app along with some customisation abilities for greater user engagement.
Understanding Our Users
To better understand how users currently feel using the podcast apps that are available to them we had to gather data and start asking questions. We broke this down into 4 stages:
- Interview Schedule Development
- Screening Surveys
What this allowed us to do was structure our interviews so we were asking the right questions to the relevant user group identified through the screening survey. From this we recruited 12 users for interviewing. Below is an example of some interesting data we discovered from the screening process:
Once recruitment users and conducting interviews we were able to start seeing common trends in thought processes, attitudes and behaviours. In order to group them effectively to see the over picture were created affinity maps to get a better visual representation:
What we noticed was that users found visuals on their current podcast apps to be bland and unexciting, there was no pop and everything appeared plain. Additionally, navigation through the app was overall a bit of a chore, nothing felt smooth and logical as a flow. Discovery was also an issue as users. They couldn’t find content that was relevant to them without being mislead by descriptions and exciting imagery with little or no description. Large image icons with titles that provided no indication as to what the podcast was actually about.
Positive or neutral feelings we found were that users normally use podcasts to enhance what otherwise a mundane activity, e.g. house chores. They also were too familiar with the app to expend effort discovering and learning a new app that may have a better experience waiting for them.
We used this data to visualise and empathise with the users emotional journey they might experience on a typical day commuting and kept that in mind during the design stages moving forward.
We used all this data to personify our user group into one representation — Michaela. an individual from London who enjoyed learning new things, aged 25–35. We kept this persona at the forefront all our designing going forward, always referring back to this and the brief provided to stay on track.
We further empathised with our user by examining what the user might see, hear, think/feel and finally say and do throughout a commute and how we can try and alleviate some of the negatives by identifying ideal feature prioritisation within the app in order to maximise engagement and keep the user relaxed and have a more pleasant journey. Below are examples of the users mind and how we then thought feature prioritisation based on the user.
- Thinks about what she wants to listen to —needs to discover new podcasts.
- Sees confusing and overwhelming app —needs a clear design.
- Finds a funny part of the podcast —needs ability to share it or comment.
- Surrounded by irritating noises— needs a way to engage more with the podcast.
Time To Start Building!
Now that have data, we can start building and testing with the user in mind. This started with developing the skeleton structure of the podcast section within the SoundCloud app — Sitemapping. We wanted the flow between key screens to be as simple and uncomplicated as possible.
Through testing we actually discovered that “Stream”, “Collections” and “Search” placed in the navigation bar actually confused many users. Especially search as there was already a search bar a the top of the screen they didn’t understand where there was a whole icon within the navigation bar dedicated to it. Understanding this, we stripped those 3 icons from the navigation and replaced them with more suitable icons.
We used the above as a guide to create some paper prototypes and test them with users in order to understand what features work and what do not as well as understand any further insights as to what will beneficial to the user based on expectations moving between screens.
We continually tested and refined our app, from basic design studio to paper prototype to mid-fidelity, taking user feedback as the basis of the changes incorporated. Below are examples of the stages of design:
SoundCloud And Their Branding
As we were creating a section within the app, we had to understand SoundCloud and what kind of presence they were trying to provide within the music streaming community. What represented them and why did it appeal to their demographic and in extension, our persona Michaela. We conducted research through browsing their desktop site and getting a feel for what the core brand values of SoundCloud could be.
I was able to identify the following:
Originality — Contributors are independent and have the ability to upload their own original content
Diversity — In both audience and conten
Energy — Encouraging people to have an exhilarating journey through discovering new people, content and ideas.
This allowed me to create a moodboard to help ideate and reflect on the brand image going into the hi-fidelity prototype. Considering SoundCloud already has a huge online user base, their branding appears to be working and what we wanted to do was help users feel comfortable and thus retain familiarity when opening the app. So we didn’t actually change the colour scheme and opted to stay with the vibrant oranges and smokey blacks and greys that SoundCloud currently use. Instead, we simply just tried to incorporate little pops of orange colour where there wasn’t before.
The Final Product
Leading up to the final product, we actually realised a few key things that needed to be changed going all the way back to initial ideation and design studio. This was a huge challenge as it impacted our whole narrative and flow and we were coming up to towards the end of our 2 week sprint on this project.
The example podcast we had used actually didn’t exist and we had to restructure our whole journey using a new podcast. We originally started with Horrible histories and that fed in to our 2 key scenarios to help guide this project:
Michaela wants to learn more about history on her commute.
Michaela wants to share something funny she heard on a podcast on her way home from work.
This also directly affected one of the tasks we used within our prototyping testing as users found it confusing how to navigate through our app as the task was so broad and it led them to believe they could tap anywhere on the screen making testing less efficient initially.
We fortunately were able to correct this in time for hi-fidelity testing and final refinement so that there were no loose ends and the feedback we got was more specific and relevant.
To the left is a snippet of what our final product looks like. It incorporates sharing custom clips, the ability to see similar podcasts and preview 30 second clips before investing too much time into a podcast only to realise what you may be listening to is not what you expected or boring which actually left users feeling misled, frustrated and disappointed. This all ties back to the user research we conducted as well acknowledging requirements within the brief provided to us.
I think the main payoff to take away from this is that what we had created stuck to the SoundCloud theme and style as close as possible but still exploring a new take on what the app could look like. Additionally, it keeps the user in mind throughout the whole flow and process attempting to alleviate the frustrations that were discussed during research. A simple, clean and non complicated flow that is familiar and yet supplements the users desire to easily find podcasts without misguiding them with imagery and a lack of information.
Given more time on the project, we would have wanted to start investigating and developing flows for creating custom playlists — a highly common, expected and desired feature by users. We had an idea early on within the design phase of how to supplement the users learning when they aren’t looking at the “now playing” screen. You can see an example of the screen below:
Due to time constraints and confusion during initial testing during paper prototypes, when originally pitched to users they found it confusing and it actually brought up more problems than it solved so we had to axe the idea. However, with more time, it could be refined and if given a short onboarding on the new feature, it would have been worth testing as it was different and engaging.
Finally it would have been worth developing a way to organise comments and report spam. Researching on the desktop website, I noticed how many comments were inappropriate, served little to no purpose and can be obviously classed as spam which I imagine is not what SoundCloud would want to encourage. The content uploader should as well as other users who feel similar should have the ability to report spam comments or offensive or pointless comments so that they can be investigated and resolved by SoundCloud moderators.
I hope you enjoyed reading this as much as me and my team enjoyed making it! Thank you for time. Please feel free to get in touch with me to discuss the case study or anything else via the email address below:
Alternatively, you can find me on LinkedIn: