Spotify Remixed
Role: UX Research, UI/UX Designer
Project type: Conceptual case study
I banded together with two other UI/UX Designers, Simmi Chhabria and Nahla Almbaid, for this project.
We wanted challenge ourselves on finding ways to improve an existing product.
As music lovers, our product of choice was an easy one: Spotify.
Objective
To evaluate the effectiveness and efficiency of Spotify, and recommend improvements based on the findings.
Deep Diving in Spotify
According to this study, majority of Spotify’s users aged between 18-34 (54.4%). Moreover, 42.6% of users are premium members. Hence, we decided to keep this demographic in mind when conducting our research.
Assessing the Spotify App
We wanted to identify what makes Spotify great and how it can improve, and divided the workload accordingly.
I worked on the SWOT Analysis. The sources of my research can be found here.
SWOT Analysis
Competitive Analysis
Customer Journey Mapping
Understanding Spotify’s Users
We wanted to know what Spotify Premium’s current users think about the product and brainstormed on what questions to ask that will enable us to identify their pain points.
We consolidated these questions into a discussion guide.
-
Target areas include opinions on the product, competitors, playlist organization and execution of tasks.
-
Tasks we asked users to perform include the process of liking songs and playlist management.
Problem Statement
Based on our research results, we have come up with our problem statement on the right, with organization being our key focus,
Spotify’s current system for song organization has led to several issues for users in recent years. The app offers limited options for users to manage their playlists, and a non-intuitive "like" button for saving songs.
Creating a Persona
With the problem statement finalized, I crafted out the persona for the team, regularly checking in with them for their feedback.
Improving Spotify
With our research completed, we ideated on how we can improve the Spotify app. We narrowed it down to 4 areas to focus on.
#1 - Home page personalization options
#2 - Revising the process of liking songs
#3 - A song recognition feature
#4 - Playlist visual personalization
#1 - Home Page Personalization
According to the interview results, only 27% of users like Spotify’s current UI. They did not like how visually cluttered the Home page looked. My team and I sought out to address this issue. Simmi headed the conceptualization of this feature.
My responsibilities for these feature:
Assist Simmi in the ideation process together with Nahla
Ability to toggle recommendations
We wanted to give more power to user on what they would like to see on their home page. Adding a toggle switch allowed users to turn recommendations on and off, thereby reducing clutter.
When opening the app, users are notified about the revamped Home page
Users can now turn recommendations on and off by tapping the toggle switch.
Customizing sections
Users can also add, remove and rearrange sections of the Home page. This gives them the freedom in prioritizing what they would like to see on their Home page.
Users can access this feature by tapping the ‘Customize’ feature located on the top right corner of the Home page.
Once satisfied with the arrangement, users can tap ‘Done’ to finalize the appearance.
When tapped, users can rearrange the sections of the Home page.
Users can also add or remove sections of their Home page by selecting the ‘+’ icon on the top right corner.
#2 - Revising the ‘Likes’ process
Of the users we interviewed, 67% preferred to add new songs they find to the in-built Liked Songs playlist instead of their own personal playlists. The reason being it saves time.
However, the issues the users faced in doing so, was the accumulation of songs, leading to a cluttered Liked Songs playlist.
My responsibilities for this feature:
Create user flows
Work on the high fidelity wireframes and prototypes
User Flow
Reintroducing the Heart icon
During the interview process, many users expressed that they missed the heart icon to represent liking a song.
They felt that the current plus (+) icon meant adding to playlist instead of the act of liking a song.
We updated the UI by adding the heart back into its infrastructure.
Bulk Organization Feature
Currently, if users want to add liked songs to a playlist, they have to do so one at a time, making this task tedious and time-consuming.
With the bulk organization feature, users would be able to select multiple songs in one go, to add to a playlist of their choice.
User Flow
High Fidelity Wireframe
On the Liked Songs playlist, users can manage their songs by tapping the ‘Manage Songs’ button located on the top left
A new overlay will appear and users would then choose which playlist they want to move the selected songs to.
Users can then choose the ‘move songs to a playlist’ option.
When tapped, a checkbox will appear, prompting users to pick the songs they want added to a playlist, tapping ‘Next’ when done.
#3 - The Spot-it Feature
Spot-it is a song detection feature built into the Spotify app. With it, users need not have to go the extra step in adding a song detected from a third party app into their Spotify playlists.
Why Spot-it? Based on our secondary research, Spotify’s competitors do not have a song detection tool built into their app, providing a window of opportunity for Spotify.
Furthermore, there is also demand for such a feature from the community forums, shown here.
My responsibilities for this feature:
Came up with its concept
Designed the logo
Worked on the high fidelity wireframes and prototypes
How it works
When opening the app, users are notified about the introduction of Spot-it. Here, they are given the choice of adding it as a widget to their phone.
The feature is also accessible from the top right corner of the home page.
Once added as widget, it will appear on the phone screen. Tapping on it starts the song detection process
Once a song is detected, it is automatically added to an in-built playlist, titled ‘Spot-it Songs’. Here, the user can decide what they want to do with it, such as adding it to a playlist.
Designing the Logo
When I was designing the Spot-it logo, I steered away from literal icons like a sound waves or microphone. I wanted it also has to capture the Spotify brand.
I went through the sketches with my team, progressively editing and narrowing down the options based on their feedback.
The Final Look
Many iterations have resulted in the following finalized logo design and its various states.
#4 - The Vibe Check Feature
Users that we interviewed also commented that all of their playlists look the same, and would prefer that each of their playlists have their own look and feel to match the mood of the songs they contain.
The Vibe Check Feature addresses this concern by providing users options to customize the appearance of their playlists.
It is also interactive, where the thumbnail visuals also change depending on the genre of songs added to it.
My responsibilities for this feature:
Design the Vibe Check icon
Worked on the high fidelity wireframes and prototypes
Implementation of song reordering gesture
Customizing playlist backgrounds
To change the color scheme of a playlist, tap the palette icon:
Choose from a preset color theme.
Once a theme is selected, the appearance of the playlist will change accordingly. We are also looking to explore custom themes/backgrounds for this feature.
Evolving thumbnails
Nahla came up with this amazing concept, where the thumbnail visual of a playlist will change according to the songs added to it based on their genres.
It is a feature that we hope will encourage users to organize their liked songs into playlists and watch them evolve.
Arranging song order using gestures
88% of the users we interviewed failed in performing gestures they thought were intuitive in performing tasks.
Of all the gestures attempted, the most common one was the attempt to holding and dragging a song in a playlist to arrange them.
We decided to implement such a gesture into our prototype.
High-fidelity Prototype
We decided to incorporate all 4 of the above focus areas into a seamless, high-fidelity prototype.
I worked on prototyping focus areas #2, #3 and #4.
I hope you will enjoy engaging with it as much as my team and I have while working on this project!