Sitemap
Nikol Safronova

Nikol Safronova

www.nikolsaf.com

KPCB Design Challenge

6 min readFeb 1, 2019

--

Simplifying SoundCloud’s features for Users & Artists

Press enter or click to view image in full size

SoundCloud, the music and streaming platform that allows users to upload their own songs and listen to millions from local and worldwide artists, has been around for almost a decade. Although its branding and interface has gone through multiple iterations, SoundCloud’s features haven’t always been user-friendly. I decided to redesign and simplify the app’s features because my musically talented friends use it extensively and are frustrated by SoundCloud’s usability for users and artists. I targeted the app’s features specifically, instead of focusing on a complete redesign of the brand, because I think the brand itself has a unique identity compared to its competitors: Spotify and Apple Music.

Research:

I began my process of redesigning SoundCloud’s features by using the app daily and conducting 11 interviews of users and artists to figure out which problems they are frustrated with the most. Here is the feedback I received:

Press enter or click to view image in full size

Using these responses, I came up with my overarching question for this design challenge:

“How might we simplify SoundCloud’s features to make it more accessible for users and artists?”

I then sketched out possible wireframes of the Home, Stream, Collection and Play pages based on my favorite apps and the principles of hierarchy and simplicity.

Press enter or click to view image in full size

User Profiles:

To explain the features I’ve designed, I will be telling the story of two users:

Press enter or click to view image in full size

Stella’s Home Page Problem:

As an avid user, Stella loves to interact with the artists she follows and check out their original songs, reposts and likes. However, with the current interface, it’s difficult for her to differentiate between them due to their small font size.

Stella also has a hard time going back and forth between the current Stream and Home page, since she is used to the Home page on her applications being the page where she can see her followers, like on Instagram and LinkedIn.

Solution:

To solve Stella’s problem with mixing up the current Home and Stream page, I decided to switch the two and focus the Home page on just having posts from followers and the Stream page on SoundCloud playlists and the Search function (mimicking Instagram’s Discover page). I did this because I received a lot of feedback from my friends about always confusing the Stream and Home page and having too many functions in the bottom navigation bar (I also took out the Search page so the navigation bar only includes Home, Stream and Collection pages).

Press enter or click to view image in full size

To solve Stella’s problem regarding making distinctions between original songs, reposts and likes, I decided to create a filter feature and add tabs for each type of post. I did this because I wanted to establish a hierarchy of information for the user to be able to control what they want to see.

Press enter or click to view image in full size

Stella’s Stream Page Problem:

When looking at the various types of playlists and artists SoundCloud recommends on their Stream Page, Stella doesn’t understand what she should focus on the most, given that the current Stream Page doesn’t have a hierarchy of content. Stella is also used to the search function being on the page where she can discover new artists and songs.

Solution:

To solve Stella’s problem, I decided to make SoundCloud’s Featured playlist the biggest size and the rest of the playlists and recommended artists a slightly smaller size. I did this because I wanted to establish a hierarchy of which playlists the user should listen to, based on feedback during research.

Get Nikol Safronova’s stories in your inbox

Join Medium for free to get updates from this writer.

As I referenced before, I also decided to take out the Search page out of the bottom nav-bar and put the search function in the Stream page because I wanted the user to be able to look up any artists, song or playlist right from the page. This will allow the user to use the Stream page playlists and artists as a reference for what they want to look up.

Press enter or click to view image in full size

Stella’s Collection Page Problem:

While looking at her Collection page, which displays functions related to the user’s profile, Stella cannot see which notifications she receives from her followers. She also cannot differentiate between the Recently Played and Listening History functions.

Solution:

I decided to include a Notifications function like the one SoundCloud has on their desktop view. I did this because I wanted to make it easier for the user to see their updates and to unite SoundCloud’s desktop view with its mobile application. I also took out the Recently Played function and replaced it with the Listening History that would display all songs and artists the user listened to.

Press enter or click to view image in full size

Ivy’s Collection Page Problem:

As an artist, Ivy wants to be able to see her original songs on her Collection page, which the current interface does not display. Ivy also wants to see how many times her song has been played, liked and reposted.

Solution:

While I kept the same functions of the user’s Collection page (Liked tracks, Playlists & albums, Following, Stations, Notifications and Listening History), I decided to create a separate display for artists’ original songs and include the SoundCloud plays, likes and repost statistics below the songs, which are both seen on their Collection page. So as soon as a user decides to post their own songs and transition into an artist, they will be able to see them at the top of their Collection page.

Press enter or click to view image in full size

Stella’s and Ivy’s Play Screen Problem:

Both Stella and Ivy are frustrated that whenever they play a song, they cannot see the full album cover or how many times a song has been reposted. They are also confused as to why the share function is listed twice on the Play screen (once separately on the bottom of the Play screen and another in the ellipses).

Solution:

To solve Stella’s and Ivy’s Play screen problem, I decided to minimize the album cover and display it largely in the center of the Play screen. I did this because I wanted the user to be able to look at the whole album cover, instead of partial bits like the current interface has. I also decided to put only the likes, reposts and comments statistics as their own separate entities on the bottom and move the share function and the replay function into the ellipses. I did this to simplify the number of functions located on the bottom of the Play screen. I kept the original SoundCloud waves because it allows users and artists to see the transients in the song so they can skip to any drop (which corresponds with larger waves).

Press enter or click to view image in full size
Press enter or click to view image in full size

Final Thoughts:

I set out to improve the usability of SoundCloud’s features for users and artists. With a new filter feature and Play screen, a clear hierarchy of playlists, a simplified nav-bar and the ability for artists to see their original songs on their Collection page (and more!), I hope I’ve achieved a meaningful solution for users like Stella and Ivy. I definitely learned a lot during this process, such as the importance of finding a purpose behind every design change that I make. While I challenged myself to improve my Adobe Xd skills, I had a lot of fun coming up with different iterations of features and I hope you had as much fun reading through this.

--

--