Playlist consolidation
Designed at Spotify in 2020
Almost all consumption on Spotify is from a playlist. Because of this, many teams run experiments on the playlist page. I was my job to review the experiments, define guardrails and create an ideal UX that was flexible enough to cover the innovations without becoming inconsistent to our users.
My role
Sole designer • Wire-framing • Prototyping • Visual design • UI specification • Continues quality assurance
The team
Me as design lead • PM • Squad of front and back end engineers • User researcher • Data analyst • UX writer
The problem
Playlists are inconsistent
– They look different
– Behave differently
– Built on different tech stacks
State before this project
Headers
5
Image styles
3
Title styles
3
Description styles
9
Metadata variations
Actions
5
Play buttons
5
Play behaviours
4
Secondary action styles
7
Follow / Like styles
4
Download variations
6
Filter and sort variations
Headers
5
Track clouds
3
Preview rows
9
Track row variations
2
Additional content rows
4
Footers
Case in point, the play button looked like this:
And behaved like this:
- Tapping the button, it would either play in shuffle or from top to bottom, even buttons without the shuffle label would often play in shuffle.
- Tapping the button while playing, would either pause or play another random song
Audit
The first thing I did was to audit the current experience across Premium, Free, Android and iOS. While I lead this work I involved the PM, QA and members of the design systems team. The output was a massive document with tables full of inconsistencies.
Insights
Working with several teams, I synthesised a list of insights that would help us define the ideal playlist experience. Some of the insights we already had from previous research but many required new tests.
To continue with the example of the play button and it’s behaviour, we needed to know if it’s actually better to play in shuffle or from tom to bottom by default. Equally, we needed to understand if a play button with a simple play icon is better than the word “Play”. These are just two tests but we defined a lot more.
Explorations
While most building blocks was already in place and it was more a matter of making the ideal combination of components, I did explore a couple of new addition to the playlist experience as part of this project.
Specifically I looked into replacing the play buttons with labels with circular buttons with icons. The “play” and “shuffle play” doesn’t translate well and we had observed people struggling to to find the play button in some markets.
I also explored alternatives to the track cloud we use on our free tier to display the content of a playlist. While the track cloud gives you a good overview of the playlist it doesn’t do a good job properly evaluating the playlist and we had seen people getting confused and stuck trying to figure out how to play a song.
Solution
Once I had evaluated and refined all components and their behaviours, I created guidelines for anyone wanting to innovate with a playlist. I then went on a kind of tour explaining the new rules set and how to work with them to a number of key teams across the org.
Results
The main goal for the consolidation was not to improve upon top line metrics, but to set up Spotify for success by being able to innovate faster. That said, we did see positive impact for a number of tests.
Circular icon based play buttons instead of labels
0.4 percentage points increase of week 3 retention
Preview track rows instead of track cloud
- 0.18 pp increase of week 2 retention
- 0.19 pp increase of week 2 engagement
- 0.22 pp increase in week 2 consumption
These changes are gradually being implemented and rolled out in 2020 – 2021.