Case study: Spotify spotlight

“Spotify is the world’s biggest music streaming platform with a 32% subscriber market share in Q1 globally.” — Midia Research

Ok so now that I have begun with a customary big impact statistic, let me cut to the chase. I find there are several issues with the current iteration of the Spotify iOS app, an app that I use for unhealthy amounts of time on a daily basis to keep my soul and mind focused. And since I am deeply possessed by well-designed products, I decided to design what an improved version of Spotify could look like. This is a case study concerning the issues I find with the Spotify app UX and potential solutions to those issues.

Note: I will be using a UX Case Study on Fitbit by Stacey Wang as inspiration. Also, currently, I am overlooking the user surveys part of the process, and am focusing on solving the issues that “I” am facing with the app.

Another Note: This exercise was carried out while listening to Spotify :)

Design Process

I will be using a design framework that I am familiar with and understand the best — Design Thinking.

The 5 Steps of the Design Thinking Framework

Part 1: Empathising with the User

While it is hard to empathise with oneself, I shall try my best. I have tried to pen down my own persona from a third-person perspective and tried to be as objective as possible.

Satyam Saxena (21)

• Listened to more than 30k (~21 days) of music in 2020 on Spotify
• Listens to music while walking (his idea of fitness)
• Listens to music while studying anything that doesn’t require too much input
• Says that music helps his mind to calm down, and concentrate
• Believes he is highly receptive to all music tastes, and can’t narrow down on a favourite genre.
• Loves discovering new songs, a good one just might make his day for the next 30 minutes.
• Listens to podcasts occasionally

Needs and Goals:

• Would like to discover absolutely new music
• Would like to organise his music in a better manner
• Would love to share his music with friends more easily

Part 2: Defining the Problems

The Spotify app has been on the app store since a long time and over the years has undergone significant improvements both visually and functionally. However, there always exists scope for improvement, and here are my two cents on the iOS app in particular. Apologies if I’m too scathing.

Warning: Long section. Head over to the next section for a TL;DR version of the problems.

A) Home Tab

• In its current iteration, the home tab is a cluttered mess of playlists and podcasts and recommendations and promoted music in no perceivable order.
• Due to the imperceptible mix of music and podcasts, it is cumbersome to discover new podcasts and shows.
• Some sections are redundant such as the 6 small recently played items at the top and then the “Recently played” section that comes later.
• What’s the point of a separate button at the top that looks like a notifications button but when you open it, all you find is a list of new podcast episodes and music releases which should be there on the home page in the first place?
• Why are the podcast artworks rounded off at the edges and the music artworks squared off? Why can’t we have consistently round edges, akin to other design elements throughout the app, such as buttons, the now playing widget, app icon etc?

B) Now Playing Screen

• Before complaining, I would appreciate it for being the prettiest “now playing” screen that I have come across yet in any music app and there is little that I’d like to change on the face of it. The issues start coming up when we open the options menu in the top right.
• Why do we need shuffle, repeat, add to queue and like buttons again when they were present on the previous screen?
• The first fold of options provides no evidence that there are 6 more options waiting for you if you scroll. Many of the most frequently used actions such as sharing a song are accessible only after scrolling, adding friction to the process.
• The design of the share sheet is visually incoherent with the rest of the screens.

C) Downloading Music for Offline Listening

• If a user needs to download a song for offline listening, the only way is to add it to a dedicated playlist that you’ve marked for downloading.
• This adds an unnecessary complication for users who want to download one particular song since they have to have a separate playlist for their downloaded music.
• Let’s say a user has a playlist of 200 songs, out of which he only wants 20 to be available offline. The only way to accomplish this in the current app is to have the 20 songs in the 200 song playlist and another smaller playlist of 20 songs which is downloaded in its entirety.
• This is an unpleasant experience and introduces complexity to an otherwise basic task.

D) Sharing Music

• Based on my reading, one of the primary reasons why Spotify took off in its initial days was the Network Effect, and the curated discoverable playlists that few competitors provided. I believe Spotify can further expand the social aspect of the app.
• No, I don’t want Spotify to turn into another painful social media app that begins to ruin the lives of all that use it.
• However, sharing music by copying its link and going on another app and pasting it is too much of an effort for us blessed souls who like to spread good music.
• A framework where people can share music with people they are close to and listen together within the Spotify app is needed.
• The friend activity section on the desktop app should be incorporated into the mobile app as well.

E) Now Playing Notification

• Currently, the actions possible from the Now Playing notification are: previous, play/pause, next, volume adjustment
• In order to like a particular new song and save it, the only option is to launch the app and carry out the action over there which introduces a fair bit of friction.

Part 3: Ideating the Solutions

A) Jobs to be Done

Here’s a TL;DR version of the previous part, with a list of the Jobs to be done:

1. Home tab needs to be revamped, to make it easier to navigate and visually consistent.
2. Actions on the Now Playing screen need to be streamlined.
3. A way to download a single song into a default playlist should be provided.
4. A music sharing section is needed.
5. Ability to like a song from the Now Playing notification needed.

B) Low Fidelity Sketches

Before jumping into Figma and preparing high fidelity mockups, I felt the need to ‘sketch’ out my ideas on paper (see what I did there?). Here are some rough sketches.

Part 4 & 5: Prototyping & Testing

I prepared all my UI mockups using Figma, owing partly to my experience using this software and partly to the fact that it is free and has a rich collection of community assets that make life a tad bit easy. I also prepared an interactive prototype that could give people a better understanding of what I had designed.

I shared this prototype with 6 close friends (all avid Spotify users) and gathered their feedback to improve on my designs and refine the UX.

Here are the final high-fidelity mockups.

A) Home Tab Revamp

I designated two separate sections for music, and podcasts to enable easy discovery and prevent mixing up of the two content formats. These two sections can be toggled by using the two prominent buttons on the top. A green bar at the bottom coupled with a dynamic background colour blob denote the active state and give visual feedback to the user upon tapping.

I removed the notifications section at the top since it had notifications about new episodes and songs that are anyway displayed on the home page. I also removed the settings button on the home tab since it isn’t used very frequently and can be accessed using the profile button on the “Your Library” tab. In its place, I added a button for the Friend Activity section (discussed in a later section).

B) Streamlined Actions on the Now Playing Screen

Once the options menu is opened, I eliminated all the redundant options that were already present on the ‘now playing’ screen leaving just 9 options that could be neatly arranged in a grid. This eliminates scrolling and brings the important options within easy reach.

I also redesigned the share page, with a new sharing feature that I introduce later in this article. Since the options sheet and the social sharing sheet come up from the bottom, these menus can be dismissed at any time by swiping down or using the back button in the top left corner.

C) Downloading Individual Songs

I added a download button on the ‘Now Playing’ screen so that users can download a single song quickly without having to add it to a downloaded playlist.

When the user taps on the download button, the song gets added by default to the ‘Downloads’ playlist. This allows the users to add a song that they want to download, to a playlist in which there might be several songs that they don’t want to download. This still maintains the possibility of the user adding a song to a downloaded playlist if the user so wishes.

D) A New Music Sharing Space — Friend Activity

Tapping on the Friend Activity button brings the user to the Friend Activity section. While a basic version of friend activity exists on the Spotify desktop app, its phone version seems like a half-hearted attempt.

The Friend Activity home page lists all the people we follow along with their last listened/currently listening song (provided they haven’t enabled private sessions in the settings).

Tapping on a chat tile brings us to the chat & sharing screen. The person’s photo, name and username are displayed prominently in the top header, along with the group listening session icon, and more options.

E) Shared Listening Experiences — Group Sessions

While Group Sessions have been in beta development since some time now, their UX has been choppy at best. In order to listen to time-synced music/shows with their friends, users need to share links with their friends in other apps, and this process can be simplified.

Tapping on the group session icon in the top right opens up an overlay sheet from the bottom. From here, the users can start a group listening session with synced music and podcasts. Since we accessed this from the chat page of a particular person, by default the session will start with the person in question.

Group sessions can also be started from the Friend activity page itself.

More friends can be invited within the Spotify app itself.

F) More Functional Now Playing Notification

I included two new buttons on the now playing notification:

Like button (heart) and Add to playlist button

Since these buttons are a part of apple’s notification ecosystem, I used Apple’s SF symbols as the icons, to maintain coherency. I used the light font-weight.

The heart button uses a stroke in its inactive state and a solid black fill in its active state. The ‘add to playlist’ button when tapped launches the Spotify app’s ‘add to playlist’ screen where the user can add the song to their playlist.

Part 6: Impact of These Solutions

Spotify is an app that impacts the lives of millions of people on a daily basis. As a consequence, any improvement to the app and its UX makes lives easier, and contributes to Spotify’s dominance in the music streaming space.

Revamped Home Tab Layout

One of the biggest new areas of expansion in the audio segment is podcasts, and original shows, and Spotify, like all other players is investing heavily into this space. Thus, having two separate sections for music, and other content allows for easier discovery, giving podcasts and their creators the attention and limelight they deserve. It enables people to get to what they want quicker, and introduces curiosity into the user’s mind to explore a new app section that has popped up on their home tab for the first time. It can also onboard many first-time podcast listeners in developing markets such as India where many people are unaware about the concept of a podcast.

Streamlined options menu on the Now Playing screen

This puts the actions users commonly take while listening to music within easy reach, eliminates redundancy, and integrates efficiently with the Friend Activity section to enable fluid sharing of music without leaving the app.

Friend Activity Section:

The Friends Activity section is an entirely new direction in which Spotify has not yet ventured into (at least to this extent). In my opinion, enabling social sharing within the app can increase user retention, since they don’t need to leave the app to share music with their friends and family. They can converse within the app, and listen to music and shows together, something which has picked up steam ever since the pandemic started.

People can discover new music and shows just by seeing what their friends are listening to, thus enabling facile and friction-less recommendations.

It is my personal desire to not let this turn into another social media app and consequently I did not go down the route of adding additional social features such as stories, or likeable posts etc. I wish the app to remain an intimate, comfortable space where people can listen to the music and shows they love, and share it with the people they care about, without the worries and negativity associated with social media.

More options on the Now Playing Notification

This addition straight up makes the lives of users easier. While running, commuting, or anytime when it is inconvenient to open the app, an option to like the song and save it for later from the lock screen is a godsend.

Part 7: Interactive Prototype & Deck

I have designed an interactive prototype in Figma for the proposed solutions. The interactive prototype can give a much better experience to viewers since I have put in efforts to make it as close to the real app as possible.

Click here to access the interactive prototype

Click here to access the Spotlight Spotify deck

Part 8: Appendix

• Typeface: Circular Standard, Apple SF Symbols
• Cover Image Mockup
• Icons: Feather Icons Plugin in Figma

Part 9: Conclusion

Thanks for making it till here! It will be my pleasure to listen to any and every feedback on this work since this is my first attempt at such a case study. For any collaborations or communication, please feel free to reach out to me at stymsxn@gmail.com, or Instagram, or LinkedIn.

Disclaimer: I have no associations with Spotify. I love products, design and music. I’ve spent countless hours using this app, and have inevitably thought about how this app can be improved, and this case study was my crack at it.