Spotify redesign

Social Feature for Spotify

ROLE

UI/UX Designer

EXPERTISE

UX/UI Design

YEAR

2023

Introduction

Music is one of my biggest passions in life and sharing music with others is my favorite way to connect with others. Spotify is my most used music app on my phone, which is why I wanted to focus on it for my UI/UX case study. I personally love to use Spotify due to their attractive and easy-to-use UI, as well as their features such as yearly recaps and song recommendations. However, there are always ways to improve. Through this case study, I conducted user research to identify what users wanted out of the mobile app, and used Figma to develop mockups for a new feature.

Timeline

From explorations to final designs in 2 weeks while working with other projects at the same time.

Background

Spotify is a popular digital music service that gives you access to millions of songs.

User Research

Through a UX survey sent out to online forums and friends, this is what the responses looked like:

100% of responses said that they use Spotify to listen to music. Most also use it to discover new music.

"Making new playlists, expanding my music taste, connect with others who enjoy music”

Most users said that they chose Spotify over other music apps because everyone was using it so it is convenient. They like how they are able to see what their friends are listening to.

"Most of my friends have Spotify, so I like to follow them and see their listening activity”

20% of responses mentioned that they wish they could see their friends' listening activity on their phones.

"Show listening activity"
"Stalking friends"
"See what my friends are listening to on my phone"

Some mentioned they wish they offered weekly recaps.

"I wish they give you weekly summaries"

When asked about adding a "Friend Activity" section on the mobile app in particular, 91% of survey responses said that they would like it.

"I've thought about wanting a friend activity feature on the mobile app as well. That would be nice because it would feel like a social media platform, and it would increase engagement of Spotify users."

Using these responses, I created an empathy map to gain a better, and more cohesive idea of what the general user wanted.

Using these responses, I created an empathy map to gain a better, and more cohesive idea of what the general user wanted. Using the empathy map, I created a user persona of a what a possible user of Spotify could look like, to get into the head of the target audience and better understand them.

I ultimately identified that users wanted a way to connect with their friends and discover new music.

My solution to this is to design a "Social" section for the mobile app, where users can stalk their friends' listening activity, which will help them discover new music. This section will also include a weekly recap feature, allowing users to easily share what they've been listening to in a visually appealing and trendy way. Furthermore, making blend playlists and group sessions easily accessible will reinforce sharing music among friends.

To start planning my UI design, I created a user flow to track a potential user's movement through the app.

Solution

Friend Activity

Allowing users to see what their friends are listening to on the mobile app, motivating social interactions and discovery of new music.

Friend Compatibility

Making Blend playlists and Music Compatibility easily accessible on the Friend profile reinforces sharing music among friends.

Weekly Recaps

Allows users to easily share what they've been listening to in an aesthetic, trendy way.

Friend activity
I added a "Social" Page, where users are able to see their weekly recap, what their friends are listening to and add to their own playlist.
Friend compatibility
they can see their taste match percentage (how similar their music tastes are) and easily accessible Blend and Group Session buttons.
weekly recaps
The user is provided a summary of their weekly recap that they can easily share through social media and with their friends.
Friend activity
I added a "Social" Page, where users are able to see their weekly recap, what their friends are listening to and add to their own playlist.
Friend compatibility
they can see their taste match percentage (how similar their music tastes are) and easily accessible Blend and Group Session buttons.
weekly recaps
The user is provided a summary of their weekly recap that they can easily share through social media and with their friends.
Friend activity
I added a "Social" Page, where users are able to see their weekly recap, what their friends are listening to and add to their own playlist.
Friend compatibility
they can see their taste match percentage (how similar their music tastes are) and easily accessible Blend and Group Session buttons.
weekly recaps
The user is provided a summary of their weekly recap that they can easily share through social media and with their friends.
Friend activity
I added a "Social" Page, where users are able to see their weekly recap, what their friends are listening to and add to their own playlist.
Friend compatibility
they can see their taste match percentage (how similar their music tastes are) and easily accessible Blend and Group Session buttons.
weekly recaps
The user is provided a summary of their weekly recap that they can easily share through social media and with their friends.

Friend activity
I added a "Social" Page, where users are able to see their weekly recap, what their friends are listening to and add to their own playlist.
Friend compatibility
they can see their taste match percentage (how similar their music tastes are) and easily accessible Blend and Group Session buttons.
weekly recaps
The user is provided a summary of their weekly recap that they can easily share through social media and with their friends.
Friend activity
I added a "Social" Page, where users are able to see their weekly recap, what their friends are listening to and add to their own playlist.
Friend compatibility
they can see their taste match percentage (how similar their music tastes are) and easily accessible Blend and Group Session buttons.
weekly recaps
The user is provided a summary of their weekly recap that they can easily share through social media and with their friends.
Friend activity
I added a "Social" Page, where users are able to see their weekly recap, what their friends are listening to and add to their own playlist.
Friend compatibility
they can see their taste match percentage (how similar their music tastes are) and easily accessible Blend and Group Session buttons.
weekly recaps
The user is provided a summary of their weekly recap that they can easily share through social media and with their friends.
Friend activity
I added a "Social" Page, where users are able to see their weekly recap, what their friends are listening to and add to their own playlist.
Friend compatibility
they can see their taste match percentage (how similar their music tastes are) and easily accessible Blend and Group Session buttons.
weekly recaps
The user is provided a summary of their weekly recap that they can easily share through social media and with their friends.

Reflection

My biggest takeaways from this project was the importance of finding and utilizing outside resources as much as possible (templates, icons, fonts, tutorials, mentors) that are accessible. I learned a lot about the UI/UX design process and became a lot more familiar with the platform Figma.

Overall, I really loved this case study and I loved that I could improve an app that I use on the daily basis.

Let's connect!

Resume

Navigation

Home

Work

Tools

Case studies

Spotify Redesign

CSU Website

Compatibility

Come on Barbie, Let's go Rush!

Terms & Conditions