Spotify Redesign
September 2023 - 3 Week Sprint
Context
Spotify is the world’s most popular audio streaming subscription service with more than 551 million users worldwide as of 2023.
Problem
A survey consisting of 60 Spotify Music listeners reported that 85% of users exit out of car mode while driving. This is alarming. With driving involved, bad design is a safety issue. Spotify has reign over millions of users across the globe. There is a huge opportunity for redesign, however the user has to remain happy enough to keep using car mode.
Goal
Redesign Spotify Car Mode to ensure drivers’ safety while enabling access to requested features.
Challenges
If users are going to use their phone regardless while driving, how can I design a safer user interface?
How can I simplify Spotify’s car mode without the platform becoming too restricting for a user?
Reasons why users are exiting out of car mode.
Spotify users’ willingness to use digital assistance to access features.
Survey consisting of 60 Spotify listeners.
User Feedback
Interesting enough, the biggest complaint about Spotify’s car mode is that the user cannot change the playlist. However, Spotify does indeed allow you to change the playlist within the home page.
With just a simple swipe up, a user can choose a new playlist to listen to, yet listeners are unaware of this.
Problem Mapping
The current Spotify car mode interface is causing unnecessary distractions that lead to a risk of car accidents.
I decided to map out in more detail the experience flow to locate distracting moments, while listening to music in the car.
Current Flow
Ideal Flow
Hand Sketch Wireframes
The next step was to create a lo-fi sketch of different methods of accessing features within the same home platform.
User Testing
I conducted 3 user tests to evaluate the functionality of the application with the buttons already provided within Spotify.
I was able to conduct simple card sorting tests to validate confusing instances. I asked my test group to design their ideal car play homepage.
User Test 1
This user did not know what quick play meant and therefore left it out of their design. This user wanted the buttons as large as possible and would have left the album cover out of the design if it didn’t leave the screen empty.
This users biggest concern was adding songs to playlists. When asked what type of prompt would follow after clicking the add song button, their response was some type of slider interface.
User Test 2
This user stressed the importance of the queue button being in the design. They would like an easier way to add songs to the queue without having to exit out of car mode.
This user also stated that trying to exit out of car mode while driving was very distracting.
User Test 3
This third user put the majority of buttons in their design. This user said they may not use the digital assistance, but it should be included to promote safety.
This user included the car mode button in their design. They wanted a way to still exit car mode if needed.
Results
From surveys, user interviews, and user testing, I can make several inferences:
- Majority of users prioritize adding songs to playlists and viewing the queue.
- Spotify users do not know what quick play means and therefore don’t know you can switch the playlist in car mode.
- To repeat a song or play a song a second time, users do not use the rewind button.
- Users agree that a digital assistance would be beneficial but are still uncertain whether they would use it or not.
Final Design
After gaining valuable feedback from Spotify users, I was able to move forward with making final design decisions.
Original Spotify Design Improved Design
Homepage
1. Queue button
2. Digital assistance button
3. Name change
Improved Design
Digital Assistance Page
1. Second mode of exiting the page for better access.
Animations would be used to signal to the user when to speak.
Original Spotify Design Improved Design
Queue
1. Digital assistance button to help add specific songs to the queue.
2. Second mode of closing the page to increase accessibility.
Improved Design
Adding Song to a Playlist
By holding down the plus button, a scroll appears with your top playlists.
Haptic feedback allows the user to sense that they are hovering over a playlist.
By releasing your finger, the song may be added to a playlist.
Improved Design Improved Design
Features of the Improved Design
1. Blurred background when adding a song to a playlist.
2. After successfully adding a song to a playlist, the button will change to a green checkmark.
Original Spotify Design Improved Design
Switching a Playlist
1. Majority of users use the shuffle button very limitedly or only when selecting a new playlist.
By relocating the shuffle button, it may be access when needed, but will not take up space on the homepage.
Simple Feature Mockup
Though not all features are shown, this clickable prototype serves to further comprehend the design.
Figma is only available via chrome 84+, Firefox 79+, Safari 15.5+, Edge 84+