SoundCloud Livestream Design Concept

Timeline: 4-5 weeks

Role: Product Designer/Manager, UX Researcher

Objective: Design a functioning livestream feature for SoundCloud

Tools: Figma, Maze

Overview:

SoundCloud has quietly been a dark horse in the music streaming platform arena, providing users with a service that is often overlooked. Its vast and niche selection of music creates a service that brings together artists and users in a closer way than its competitors. SoundCloud boasts a very devoted user base with a large focus on smaller artists and artist-listener engagement, making it an ideal candidate to introduce an interactive live feature on a music streaming platform. With SoundCloud Live, artists and content creators can help build their platform and connect with user and fans.

SoundCloud has quietly been a dark horse in the music streaming platform arena, providing users with a service that is often overlooked. Its vast and niche selection of music creates a service that brings together artists and users in a closer way than its competitors. With the rise in livestreaming platforms, we can explore the potential of the first-ever music streaming service that implements interactive livestreaming capabilities for its users and artists.

With SoundCloud Live, artists and content creators can utilize this feature to help build their platform and connect with their fans. SoundCloud boasts a very devoted user base with a large focus on smaller artists and artist-listener engagement, making it an ideal candidate to introduce an interactive live feature on a music streaming platform.

SoundCloud has quietly been a dark horse in the music streaming platform arena, providing users with a service that is often overlooked. Its vast and niche selection of music creates a service that brings together artists and users in a closer way than its competitors. With the rise in livestreaming platforms, we can explore the potential of the first-ever music streaming service that implements interactive livestreaming capabilities for its users and artists.

Problem:

To improve artists-listener engagement as well as bring attention to up-and-coming artists, SoundCloud needs a live streaming functionality that allows artists to go live for song releases, albums, or extended mixes.

Solution:

Implementation of an interactive live feature that will increase its community engagement and artist-listener interaction, and help with smaller artist discoverability.

My Design Process

DISCOVER

User Research, Research Findings, Competitive Analysis

DISCOVER

User Research, Research Findings, Competitive Analysis

DISCOVER

User Research, Research Findings, Competitive Analysis

Understanding the User:

Before any design steps could be made, I needed to gain a better understanding of the problem and the users. My approach to this was knowing who use SoundCloud and highlighting any pain points they currently face using the app and addressing any needs the may have.

A total of 13 participants responded to the initial survey on the feedback on the use of music streaming services. This initial survey serves to show the variety of streaming service usage.

From the participants from the survey, we moved forward with 5 user interviews of the 9 that said they use SoundCloud to further gauge user interest.

User Interviews

Within the interviews, a series of general questions were asked along with 4-5 questions depending on if the participants were mainly listeners or artists that use SoundCloud. These questions were split to see how users gain benefit from this feature from both perspective of the listener and artists. In this case, the participants were all listeners.

Competitive Analysis

With all the needs and pain points of the users considered, I took a look at the current market competitors to evaluate each of their strengths and any opportunities they presented that be used to create a better feature design. I chose these competitors as they were the top most used listening platforms to compare to SoundCloud.

Research Findings

All participants used SoundCloud - some every day/week, others once every month or two.

Participants ranged from the avid to casual listener
40% of users use the music discovery feature, and only 20% strongly interact with artists work
All participants showed interest and positive feedback for the feature

All participants used SoundCloud - some every day/week, others once every month or two.

Participants ranged from the avid to casual listener
40% of users use the music discovery feature, and only 20% strongly interact with artists work
All participants showed interest and positive feedback for the feature

All participants used SoundCloud - some every day/week, others once every month or two.

Participants ranged from the avid to casual listener
40% of users use the music discovery feature, and only 20% strongly interact with artists work
All participants showed interest and positive feedback for the feature

IDEATION

User Personas, User Goals, Information Architecture

IDEATION

User Personas, User Goals, Information Architecture

IDEATION

User Personas, User Goals, Information Architecture

Ideation

Early stage ideation began with our knowing what we wanted to include based on our personas. I started by laying out business and user goals, a list of features, and sitemaps. Differentiating the product and user goals helped me better understand the design goals and how to proceed through the ideation process.

User Personas

I had the opportunity to speak with a SoundCloud user who occasionally posts top get a better understanding of what would be needed from the artist’s perspective on this feature. The personas provided a clear picture of our users' needs, goals, and pain points to help me better understand the user and help guide my design direction.

Key Features

Join Live
Start live (with SoundCloud Next Pro)
Following and Discovery sections
Sign up for upcoming lives
Artist and user event schedules

User Flows

Sitemapping was shown to outline the informational architecture of the app along with the expected task flow for the live feature.

DESIGN

Sketches, Low to Hi-Fi Wireframes, Prototyping

DESIGN

Sketches, Low to Hi-Fi Wireframes, Prototyping

DESIGN

Sketches, Low to Hi-Fi Wireframes, Prototyping

Sketches & Digital Wireframes

The initial set of low fidelity sketches were translated to mid fidelity digital wireframes using Figma. The Mid-Fi wireframes were brought to life with carefully crafted design system and brand design. Through the brand design, we retained SoundCloud's mobile brand identity and further added onto it with new icons to match what was already present.

Usability Testing Results

A set of 4 tasks were asked of participants to perform through Maze.co in which the time to complete, level of difficulty, and overall usability of the feature were measured.

Of 9 testers, 100% of testers completed the tasks with relatively low difficulty
Testers shown positive interest in the feature's overall general usage

A set of 4 tasks were asked of participants to perform through Maze.co in which the time to complete, level of difficulty, and overall usability of the feature were measured.

Of 9 testers, 100% of testers completed the tasks with relatively low difficulty
Testers shown positive interest in the feature's overall general usage

A set of 4 tasks were asked of participants to perform through Maze.co in which the time to complete, level of difficulty, and overall usability of the feature were measured.

Of 9 testers, 100% of testers completed the tasks with relatively low difficulty
Testers shown positive interest in the feature's overall general usage

Feedback & Iterations

Within the user testing, there were some commonly-voiced issues in regards to:

First time user navigation
Some parts of the feature were hard to find or did not stand out

Within the user testing, there were some commonly-voiced issues in regards to:

First time user navigation
Some parts of the feature were hard to find or did not stand out

Within the user testing, there were some commonly-voiced issues in regards to:

First time user navigation
Some parts of the feature were hard to find or did not stand out

With these issues in mind and some suggestions from the participants, the necessary iterations were made:

First time users may have trouble navigating scheduling
Suggestion of adding a tutorial for the addition of the features
Labels for feature icons
Fixed some formatting and iconography placement
Better means of having the feature and icons stand out more
Add a page within the user’s side to show a list of upcoming events.

With these issues in mind and some suggestions from the participants, the necessary iterations were made:

First time users may have trouble navigating scheduling
Suggestion of adding a tutorial for the addition of the features
Labels for feature icons
Fixed some formatting and iconography placement
Better means of having the feature and icons stand out more
Add a page within the user’s side to show a list of upcoming events.

With these issues in mind and some suggestions from the participants, the necessary iterations were made:

First time users may have trouble navigating scheduling
Suggestion of adding a tutorial for the addition of the features
Labels for feature icons
Fixed some formatting and iconography placement
Better means of having the feature and icons stand out more
Add a page within the user’s side to show a list of upcoming events.

As well as a user tutorial to help new and returning users understand the feature:

Final Mockups

Following the most recent round of iterations, we can look at the current high-fidelity wireframes for the app as well as the final prototype:

Introducing the feature concept, SoundCloud Live:

Next Steps

Continue user testing
Outreach to artists and users more strongly connected with the community to gain insight and interest
Some minor tweaks for a smoother UI experience
Continue research with users who more strongly use live stream features within other apps
Additional Nice-to-have features
Live demo testing

What I Learned:

Intent

To design with intent is an aspect I feel doesn’t get talked about enough. When it came to making difficult design decisions, the goal remained to keep the feature appear seamless within the design parameters of the SoundCloud app.

Simplicity

To many this may seem obvious, however based on user experience and my own experience, simplicity is key. While navigating this project, keeping everything within the SoundCloud identity and keeping the feature simple and straightforward made for a more enjoyable design experience and better feeling feature.

Thoroughness

As I continue this journey, I can always find it fascinating to see that there is much to learn. Every user has their own interpretation of what makes a product succeed. The end product is as important ensuring as the details are planned well and executed, along with making the necessary changes to guarantee the users are satisfied.

Conclusion

This was a fun learning experience in seeing the potential of improving upon what SoundCloud can become while trying to keep the current app’s style and aesthetic. Through the interviews and Usability testing, I was able to learn about how users interact with SoundCloud as a whole and the positive interest in this live feature. I believe that with more research, implementation and testing, this feature will become more polished and refined.

Linkedin.com/khalin-nguyen

khalinnguyen@gmail.com

SoundCloud Livestream Design Concept

Timeline: 4-5 weeks

Role: Product Designer/Manager, UX Researcher

Objective: Design a functioning livestream feature for SoundCloud

Tools: Figma, Maze

SoundCloud Livestream Design Concept

Timeline: 4-5 weeks

Role: Product Designer/Manager, UX Researcher

Objective: Design a functioning livestream feature for SoundCloud

Tools: Figma, Maze

SoundCloud Livestream Design Concept

Timeline: 4-5 weeks

Role: Product Designer/Manager, UX Researcher

Objective: Design a functioning livestream feature for SoundCloud

Tools: Figma, Maze

SoundCloud Livestream Design Concept

Timeline: 4-5 weeks

Role: Product Designer/Manager, UX Researcher

Objective: Design a functioning livestream feature for SoundCloud

Tools: Figma, Maze