Case Study
Spotify Acquires Music League
Music League is an existing App that allows users to create and participate in friendly music competitions by curating playlists or episodes to showcase their musical taste and creativity.
Timeline: 4 Weeks
Project Type: Add a Feature
Tools: Figma, FigJam, Otter.ai, Maze
What I learned from this project
Roles: UX Designer, UI Designer, UX Researcher
The Problem
Users are seeking improved ways to connect and bond through music sharing.
Users would like a way to create a welcoming and non-judgmental environment where they can freely express their musical preferences and build meaningful connections with others.
To cater to users' desire for enhanced music connections, I integrated, 'Music League,' directly into Spotify's platform.
The Solution
This feature will enable users to curate and participate in music leagues, fostering a vibrant community of music lovers united through shared playlists. By seamlessly incorporating 'Music League' within Spotify, users can comfortably share their musical tastes, discover new tracks, and connect with others who share similar interests, creating an engaging and inclusive music-sharing experience.
Strict Constraints
Adhering to Spotify's Existing Features and UI: Worked within the constraints of Spotify's existing features and UI to design and implement the project.
Limited Resources: Navigated limited resources creatively to find innovative solutions that aligned with Spotify and Music League.
Maintaining Brand Identity: Ensured that design choices and user experience adhered to the platform's brand identity.
User Understanding: Preliminary personas offered data-driven archetypes that enhance user understanding, guiding my design decisions effectively.
Informed Decisions: These personas helped me make informed choices, aligning the feature with users' needs and preferences.
Design Proficiency: Understanding preliminary personas helped me improve my design proficiency. This guided me to create user-centered solutions that resonated with my target audience.
User-Centric Approach: I learned to put user needs and preferences at the forefront. By identifying and ranking possible features based on their impact on users, I ensured that the most crucial elements are addressed first, leading to a successful add-on feature.
MVPs: I prioritized the MVP of Music League. Focusing on this ensured that my efforts were directed towards the most important aspect of the project, avoiding unnecessary work on less essential features.
Iterative and Agile Process: Prioritization is a key aspect of the iterative and agile design process. It allowed me to deliver incremental improvements and gather feedback early on, making it easier to adapt and adjust priorities based on real-world insights and evolving project needs.
Preliminary Persona Building
Prioritization
App Preview
Research
Here I have included the key screens. If you’d like to view all my final designs in Figma, Click Here
Successes
7/8 testers were able to complete the “invite a friend task”.
90% of testers felt the tasks were easy to complete.
Daily Spotify users found Music League to integrate well into the existing platform.
Testers felt that Music League fits into Spotify’s brand and they were excited about the idea!
Sitemap & Task Flows
I created a sitemap in order to find the right place where Music League could fit into Spotify. Task flows were meant to create simple and direct ways in which users can achieve their goals.
Some More Key Screens
Some onboarding screens to guide users through understanding how Music League works by directly integrating Music League’s existing onboarding language.
These screens illustrate how a user might add a song to one of their Music Leagues or vote for a song that another person added. Users can search anywhere on Spotify to add a song. A league operates just like a playlist.
Took out the question mark that was never clicked.
UI Cards are highly adaptive and responsive.
The Process
Method 2: User Interviews
Objectives
I interviewed 5 people to learn about their experiences with Spotify and any desired features they might want.
This helped me narrow down the type of feature to implement within Spotify’s existing architecture and design system.
After analyzing the interview data, I was able to empathize with the users. I used the findings to define the problem and ideate from there.
Discovered the existing app Music League through an interview which sparked an idea for a solution.
Method 1: Competitive Analysis
Objectives
Prior to the interviews, I conducted an in-depth competitive analysis of music streaming apps.
I wanted to learn about the features that are already implemented within each app, and more specifically, which app users prefer and why.
This analysis allowed me to find out the areas where certain apps shined and where others did not.
Method 3: Heuristic Evaluation
Objectives
I did a heuristic evaluation for the existing Music League app.
This provided insights into what is currently working and the potential pitfalls that exist.
This helped me figure out what I needed to include in my Spotify version vs. what could be improved.
Takeaways
I found that Music League does a great job at following the 10 usability heuristics overall.
The biggest weakness was error prevention and the inability to change certain aspects of a League once it has been created.
Method 4: Preliminary Personas
From the interview findings, I created 3 Spotify user personas.
This allowed me to come up with hypotheses about the user I wanted to design for.
I was able to get a better idea of the users and had a guide for my ideation process.
Competitive Analysis Takeaways
Social Integration with Instagram, Twitter, and messaging apps
Extremely tailored listening and discovery features
Many choices for sound quality, based on price
Freemium options have very low sound quality
Options for radio listening
Options to share listening activity
Pricing ranges from free - $30 USD
Takeaways
Spotify is the preferred music streaming service
Favorite Features: Discover Weekly, Song Radios, Blend Playlists, Extremely personalized listening
Sharing music via social media and text is a huge part of their experience and they would like even more fun ways to do so
Music discovery is a constant
If there were more ways to not have to quit out of Spotify to share and discover music, that would be ideal
Ideation: Building Empathy
Lo-Fi Wireframes for Key Screens
After research and ideation, I sat down and sketched out possible solutions. If Spotify were to actually release a new feature, it would have to exist within their design system. With this in mind, I came up with solutions that seamlessly integrated into their ecosystem.
In app training makes new features easy to use!
Great UX! Spotify uses horizontal scroll to maximize on thumb ergonomics.
Prototyping & Testing
After creating Hi-Fi wireframes, I made a prototype and conducted a usability test via Maze with 8 total participants who use Spotify. Users were asked to complete 3 tasks. I also gathered insights and opinions on the feature itself at the end of the test. After the results came in, I altered my final designs based on test results and feedback.
Improvements
Testers felt that the Music League playlist screen was too cramped and that made it harder to vote for a song.
Question mark on home screen was unnecessary, no one clicked on it to reveal onboarding.
Ellipses were too small and hard to see on each page.
Changed the look of the Music League card to be more visible and accessible to users.
Final Thoughts & Next Steps
Predictable interactions create trust in the product as well as the brand.
Tasks
Create a new Music League
Vote for a song
Invite friends to a League
Objectives
Test whether or not the flows were intuitive
Observe any navigation or feature issues
Test usability of onboarding and League creation
Iterations
This project allowed me to learn how to design within an existing system and have a new feature fit in as seamlessly as possible. I found it to be quite challenging, but extremely rewarding once I had finished. I enjoyed working within strict constraints and researching existing design patterns.
Next steps include:
Creating Music League screens for desktop
Making a “discovery mode” which is only accessible while searching for a song to post to your league
Open leagues that anyone can join