Spotify

 
 
 

 
Case Study: Spotify Add a Feature

 

Role
UX/UI Designer
UX Researcher

 

Tools
Figma
FigJam

 

Timeline
Nov 2023 - Dec 2023

 

 

Background

Spotify is one of the world's leading music apps, with millions of songs available and hundreds of millions of users globally.

As an avid Spotify user myself, I found that the existing product doesn’t meet all my needs when it comes to discovering new music. I chose to explore this issue by designing a feature that would both improve the product and the users experience in finding new music. While I have ideas of how the product can be improved, I wanted to further investigate the problem through a user centric approach by speaking to other users. These conversations helped me define the specific problem I needed to solve.

 
 

 

Problem

Users often come across unfamiliar songs and artists in various settings, from public spaces to social events.

However, the existing Spotify app lacks an efficient feature that allows users to promptly identify and engage with these newly discovered songs within the platform. Resorting to third party identification apps or manual searches introduces disruptions, impacting user engagement and requiring users to switch between different applications.

 

 

Research and Analysis

Competitors did not incorporate a music identification feature into their app.

To gain an understanding of Spotify’s opportunity for growth in untapped features, I conducted a competitive analysis on the top music streaming services. The goal of this competitive analysis was to gather insights to the music streaming industry and identify any gaps that this Spotify feature can address. Through this analysis I found that they all offer an extensive selection of music, but none of which provided the option to scan and identify music. While users were able to use Shazam as a music identification app, it however is not able to function as a streaming service providing users with the capability to create/add playlists.

 
 
 
 

 

User Interviews

To understand and gather insights into user habits, preferences, and experiences with music discovery, I conducted 5 interviews with those who use music streaming services between the ages 20 - 32.

Sample Research questions:

  1. Do you find that your current music streaming platform adequately supports your music discovery needs, or are there aspects you find lacking?

  2. Do you use music identification apps or services to recognize songs you hear in your daily life?

  3. What does your current process look like to identify music?

  4. Is there anything you particularly like or dislike about your existing process?

  5. Would adding this music recognition feature influence your choice of music streaming service? Why or why not?

In order to help break down insights from the interviews, I created an Affinity Map to identify themes and patterns.

View Affinity Map.

 
 
 

 

User Persona

Based on the insights I gathered from the user interviews, I created Emily, a college student who uses music as part of her daily routine.

 
 
 

 

POV Statement and HMW Question

Drawing from the insights gained from understanding the user's needs in the persona, I formulated the POV and framed the problem for the HMW.

POV - I’m a music enthusiast seeking to expand my playlist, but I struggle with the discoverability of new songs, because it takes too much effort for me to search and add new songs to my playlist.

HMW - How might we make the process of discovering and adding new music to playlists more effortless and enjoyable for music enthusiasts?

 

 

Ideating a solution

In the ideation process, I created a feature prioritization chart based on my findings from competitive analysis and user interviews.

I prioritized the must have features to ensure the core functionality of the music identification feature, addressing the primary user needs for seamless identification and exploration. I then considered the nice-to-have features for their potential to elevate the user experience further, adding value without compromising the essential functionality. This approach aimed to create a well-rounded and impactful music identification feature that meets the immediate needs of users while offering additional enhancements for a more engaging and personalized experience.

 
 
 
 

 

Project Goals

Including both business goals and user goals in a project is crucial for achieving a well-balanced and successful outcome.

Using the insights gained from the user research, I put together project goals that this feature aims to achieve from both the perspective of the business and the user. This helped me ensure that their objectives aligned seamlessly, creating a strategic roadmap that not only addresses the specific needs and expectations of our users but also contributes directly to the overarching success and growth goals of the business.

 
 
 
 

 

User Flows

With the user persona in mind, I created two task flows that Emily would conduct while using the added feature on Spotify:

1. Identifying a Song
2. View Archived Song Identifications

These user flows for the new feature on Spotify ensures a seamless and intuitive journey for users, guiding them from the moment of song discovery to effortless identification and integration into their playlists, ultimately enhancing the overall music exploration experience.

 
 
 
 

 

Design process

Low-fidelity wireframing

In order to get a sense of how the feature would look on Spotify while maintaining the brand’s established identity, I created low-fidelity wireframes with various layout explorations. Taking into consideration both user research and Spotify's existing structure, I attempted to integrate the feature as a standalone element within the navigation bar. However, integrating the feature into the navigation bar made the overall look deviate from Spotify’s established structure. I was able to leverage the user’s familiarity with the search function to include the feature there, providing users with the ability to both search for music and identify songs.

 
 
 
 

 

Early Testing

User testing on Low-Fidelity Wireframes

Conducting early usability testing on low-fidelity wireframes provided invaluable insights into user interactions and preferences, allowing me to refine the design iteratively and proactively address potential usability challenges in the development process. My research goals for early testing were to identify any pain points associated with the usability of the Spot It feature and to collect user feedback on their overall satisfaction with the layout.

User tasks:

1. Use Spot It to identify song and add to playlist
2. Use Spot It to view previously identified songs in archive and save to playlist

Findings from user testing

 

 

High-Fidelity Wireframes

After gathering feedback from the early testing of the low-fidelity wireframes, I started developing the high-fidelity version.

Transitioning from low-fidelity wireframes to high-fidelity wireframes for Spotify involved refining the design with detailed visual elements and user interface enhancements, ensuring a more polished and representative version of the music identification feature, ready for further testing and development.

 
 
 
 
 

 

More usability testing

User Testing on High-fidelity

After refining the design with visual elements, UI components, and detailed interactions, I subjected the high-fidelity wireframes to usability testing. Keeping with the same research goals of early testing, I aimed to evaluate the user’s efficiency with tasks, identify pain points related to flow, and the overall user experience with high-fidelity frames.

User tasks:

1. Use Spot It to identify song and add to playlist
2. Use Spot It to view previously identified songs in archive and save to playlist

Findings from user testing

 
 

Iterations

Through usability testing of the high-fidelity, I identified issues with the prototype.

The usability testing feedback I received highlighted problems with the navigation bar not displaying properly in position and how content was hidden behind the iPhone’s dynamic island. I noticed this issue occurring throughout the design of other screens as well and fixed them accordingly.

 

 

Prototype

Spot It, a music identification feature for Spotify.

 

 

Reflection

My main learnings and key takeaways from this project.

This was my first project that I worked on with design constraints due to Spotify’s established brand identity. While working on this project I developed an understanding of how to design with constraints and effectively bridge them with user expectations of the existing product. One of my main challenges that I encountered in this project was figuring out how to apply a creative solution that also aligns with the brand’s cohesiveness. I was able to navigate through this challenge by implementing user centered design that prioritized simple task flows. Overall, this project helped me gain an understanding of working with design constraints and user expectations that I can apply for future projects.

 

 

Final Product

 

Other Projects:

Palate

End-to-end mobile application for ranking and reviewing restaurants.

TakeOFF

A responsive web design for a fictional airline.

 

© 2024 TINA TRAN. ALL RIGHTS RESERVED.