Redesigned SoundCloud
UX/UI Design | Problem-Solving

SoundCloud

SoundCloud is a music streaming platform, a digital paradise for music enthusiasts. With redesigned SoundCloud, the platform provides a community for artists and listeners to communicate and connect with others, having new features of comments on minutes and friend's activity.

My role
Discovery, Ideation, Wireframing, Prototyping & Testing, Visual Design
Timeline
September - December 2019
Platform
Mobile

Background

What is SoundCloud?

Launched in 2008, SoundCloud is one of the largest music streaming services in the world. SoundCloud first entered the music streaming industry as a new way(releasing music without a record label or distributor) for artists to share and promote their music.SoundCloud is driven by both listeners and artists, using the platform together, to create a community-focused space.However, even with its unique positioning, it has been dropped from the list of top music platforms.

Redesigned app

SoundCloud is a music streaming platform, a digital paradise for music enthusiasts. The app helps discover emerging artists, live sets, and mixes. With redesigned SoundCloud, listeners will never miss any of their favorite artists’ activities.The platform provides a community for artists and listeners to communicate and connect with others, having new features of comments on minutes and friend's activity.

SoundCloud

Research

Heuristic evaluation

Heuristic evaluation

Lack of Social Media Vibe

Even though SoundCloud emphasizes itself as the music community hub, there is a huge lack of social media vibe.

Unorganized pages

The layout of the profile page is not clear enough to navigate. Any of the contents draw attention. Need to improve the visual presentation.

Non-intuitive Comments

Comments on minute service is one of the most unique features of SoundCloud, but it’s not intuitive to write a comment

Demographics

More male users than female users, mostly around 18-34 years old, whose interests are mostly video games consoles and music

Demographic research 1Demographic research 2

User reviews

“Not a user-friendly platform. Messy and unorganized.”

User reviews

Design goals

01

Increase social interaction by adding Friend Activity

Add Friend Activity to heighten social interaction that helps users to communicate and connect with others

02

Organize the Profile page for better discovery

Improve the Profile page and reconfigure the layout for better discovering and delivering artists’ information

03

Improve Now Playing screen UI

Enhance the controller and the Comments on Minute feature to make them more intuitive and accessible to users

Define

Persona + Task flow

James Miller

James Miller

Goals

- Find obscure music and artists which hasn’t been discovered
- Catalog music into curated collections and ability to collaborate on those collections
- Have an accessible way to listen to tracks

Frustrations

- Unsatisfied with the app-suggested music that doesn’t fit his taste
- Feeling frustrations browsing among playlists, albums, streams, and stations
- Forgot to check out tracks that friends send him via text or email

Task flow 1

Find what April's currently listening to from the Friend Activity and save the song on the new playlist

Taskflow 1
Alicia Wood

Alicia Wood

Frustrations

- Too many options for discovering music from SoundCloud lists
- Not able to communicate effectively via app
- Finding information or certain music on the profile page is not easy

Goals

- Discover and listen to the newest releases of her favorite artists
- Find a more natural way to communicate with other users
- Intuitive way of searching artist music on the profile page

Task flow 2

Go to Shallou’s profile page and find the new track, “Losing Focus”

Taskflow 2
Task flow 3

“Losing Focus” from his profile page, play the song, and make a comment

Taskflow 3

Design

Wireframing and testing

Friend Activity

Simplified Friend Activity to communicate clearly. Removed album cover and emphasized a user’s info since this section stresses social interaction between users.

Testing result 1

Profile page

- Display the notification info on the profile page
- Rearranged buttons area. Place the following button first to promote the social aspect of the app
- Removed release dates over each album cover

Testing result 2

Playing music transition flow

Update the transition user flow from Playing Bar to Now Playing screen. After starting the music, the screen ended up on the Now Playing screen since the primary use of SoundCloud is to listen to music. It also gives a more immersive experience.

Testing result 3

Make a comment

- Display avatars to give more attention to comments
- To highlight the Comments on Minute feature, add the input field to the Now Playing screen

Testing result 4

Final design

SoundCloud Final design 1

Increase social interaction by adding Friend Activity

1. Add Friend Activity at home to heighten social interaction that helps users communicate and connect with others
2. Friend Activity displays who’s actively using the app and also what music they are listening to at the moment

SoundCloud Final design 2

Organize Profile page for better discovering

1. Add notification on top of the profile page for better discovering and delivering artists’ information
2. Organize the layout off the page for faster access to each music list
3. Improve button design for accessibility and also highlight the social interaction of the application

SoundCloud Final design 3

Improve Now Playing screen UI

1. Add Comments on Minute on Now Playing Screen for better access
2. Display my comment in real-time
3. Enhance the controller to make it easier for users to notice

Thinking back & looking ahead

Reflections

01. Challenge of redesigning

Redesigning the current application is quite different from starting something from scratch. There’s already a pretty solid app that is run by the company, and I was trying to find problems or inconveniences from there. So, I needed to be sharp and rational on problems that I find to address why it’s not working and why it needs to be improved.

02. Interview real users

I would like to interview more people who are actually heavy SoundCloud users. Current primary research is based on music application users rather than SoundCloud only. I found enough secondary research, but if I can interview more of daily basis SoundCloud users, it would help me to have a better understanding of the problems and build solutions.

03. Every detail matters

While I was working on the prototype, I realized small details that did not fit into the page or design caught my eye. Even sometimes, it distracts from focusing on the main flow. Learned building high-fidelity mockups and prototypes needs a lot of attention to detail, and sometimes, a fresh eye from the third person helps to see the design objectively.

Other projects