The current process for Spotify users to identify a song and add it to their library requires multiple steps, and often users fail to make the desired connections.
This student project explores a solution for creating a seamless song identification experience by adding a music recognition feature within the Spotify app.
Spotify is far and away the most popular music streaming app available, and Shazam is the most used and recognized music recognition software on the market. However, they still have their fair share of competitors. For a competitive analysis, I looked at four other companies for each to assess strengths and weaknesses.
While conducting user research, I aimed to determine if my ultimate hypothesis—that users would appreciate having music recognition software integrated into their music streaming service to help streamline the process—was correct, so I could design a solution based upon user wants and needs.
I conducted an online survey with 24 participants and user interviews with 6 participants. My research discovered that users overwhelmingly supported embedding a music recognition feature within Spotify, with almost all users stating they would “absolutely” or “possibly” use a music recognition feature embedded within Spotify.
Based on my interviews, I concluded that users could be divided into three categories: mood-based listeners, task-based listeners, and structured listeners.
I created two personas: one to represent mood / task-based listeners (Emma) and one to represent structured / task-based listeners (Thomas).
I made two since they think and behave in different ways and have divergent wants & needs.
To continue to define the project goal, I had a brainstorming session where I came up with four different user frustrations. I charted the specific problem, the user's current work-around, possible solutions, and requirements for each. From here, I created my problem statement and my project goal.
Problem Statement:As a user of both Spotify and Shazam, I would appreciate having a music recognition feature embedded within my music streaming service, which would streamline and automate the process of adding the discovered song to my library, my ultimate end goal when identifying a song.
Project Goal:
Redesigning Spotify to include music recognition, which would be quickly accessible and fast-acting, provide accurate matches, showcase desired information, allow for all default task options, and automatically add the discovered song to the user's library.
Before I started designing, I also needed to take a look at the information architecture to see where the feature would best be placed. To assist with this, I created a site map for Spotify to determine where my new feature can fit in. And my task and user flows showcased a user using Spotify's new music recognition feature to add an identified song to a playlist.
For this project, I kept Spotify's colors, typography, icons, and layout as close to the original as possible. I only designed an icon and screens for the new feature, which I named "Identify." I also manipulated the bottom navigation bar to include this. I aimed to make the icon, feature name, and screens mimic Spotify's design as seamlessly as possible.
I also sketched ideas and created lo-fi and hi-fi wireframes.
Testing my designs helped me determine successes and issues, and see what revisions needed to be made. I conducted an unmoderated usability test of my high-fidelity prototype with 21 participants.
As this was my first time using Maze, I encountered a few technical issues that I had to overcome. For instance, I spent a lot of time animating screens for my prototype, which I realized I had to cut back on before running the test. After seeing the results, I would have cut them out completely so they didn't skew my analysis. Overall it was a great learning experience with a powerful tool.
From my asking, listening, researching, and understanding, I can safely say that Spotify and Shazam users would appreciate having a music recognition feature embedded into Spotify for a seamless identification experience.
To integrate this new feature, I took great care to match Spotify's interface and design. I listened to feedback and various strong opinions on how best to make this work. I looked thoroughly at my usability test results and tried to understand how and why certain things were successful and others were not. I did my best to create a design that considered all of the above.
Throughout this project, I gained valuable insights and lessons. Exploring the animation capabilities in Figma was a learning experience, highlighting both progress and areas for improvement. Adopting maze.co for usability tests proved to be a powerful tool, although I still recognize the value of moderated tests for comprehensive feedback. Ultimately, my confidence as a designer grew, but I was reminded that user information remains the most valuable asset. Moving forward, I will continue to trust my instincts while prioritizing user insights to deliver impactful design solutions.
Click here to view the full prototype on Figma.
