Spotify

Mergelist Feature

Introducing Spotify's new feature - Mergelist. Allowing users to combine playlists into one playlist.

Design Role

UX/UI Designer

length of time

5 Weeks

Design tools

Figma, Illustrator

Project background

Like they say there's a song for every mood, but in a practical sense it is not possible to have such a large number of songs stored in any device. Spotify perfectly solves this problem. Spotify is an international online and offline music streaming and media services provider headquartered in Stockholm, Sweden.

Spotify began its journey in the year 2006, and since then, it has been serving a platter of podcasts, videos, and music to its customers. The core business of the company lies in music or audio streaming. Although Spotify was founded in 2006, it was launched 2 years later in the year 2008.

One of the main reasons for its commercial success is that it provides a good list of search variables such as users can type the song, artist, album, or genre on the search bar and then hit go, THAT'S IT. Spotify enjoys a huge cheering section of about 286 million active users (monthly), of which 130 million are premium users as of 2020.

Another challenge for Spotify is the competition that it is facing from competitors like Apple Music and Amazon Music Unlimited 

Goals

The goal of this project it to add a useful feature to Spotify's existing product based off user research. The focus will be to evaluate Spotify and determine what new feature can be added to the product by interviewing users and trying to solve problems within the product. 

User Research

Spotify has strong numbers in users and, generally, people who use Spotify don't stray away. However, Spotify wants to make sure that users are regularly introduced to new features that get them to engage with the app in a different, yet exciting way. My goal was to do that user research and figure out how Spotify users move through the app and see if there were any opportunities for improvement on their regular flows that might be made simpler with a new feature.

Research Goals

  • To understand the current features and their capabilities of how Spotify users interact with the app
  • To understand the needs of Spotify users, in order to create empathy with our target audience
  • To identify the pros and cons of implementing a new feature into the Spotify music platform

Market Research

To get a better idea of Spotify's users, I took a look into Spotify's user demographics. I wanted to see if there was any information about what audiences Spotify is honing in on with their services. Unsurprisingly, Spotify is catering mostly towards millennials with their marketing and overall product and with good reason. According to Statisa, 72% of all US weekly streams on Spotify are from millennials. Additionally, 26% of their overall users are 18-24 years old and 29% are 25-34 years old. Knowing this confirmed some suspicions that the company is really looking to be innovative and appeal to younger audiences as the go-to streaming service.

Key Findings:

  • Songs on spotify 70 million
  • 44% of users listen to spotify on a daily basis
  • 2.9 million podcasts
  • The average millennial using Spotify spends 143 minutes per day streaming music on the platform
  • Millennials stream on repeat more than they stream on random, and they are 90% more likely to have the latest tech products versus their counterparts.

Insights

  • Spotify boasts more than 140 million listeners and 113 million listeners are premium subscribers.
  • There are over 50 million tracks available on the platform and it supports over 700,000 podcasts.
  • Around 52% of Spotify users access its services from smartphones, and 55% of users have registered with the platform via their Facebook accounts.
  • By 2016, streaming services were responsible for more than 50% of all U.S. music industry revenue bringing in a total of $3.9 billion.
  • By 2016, it was estimated that 22.6 million U.S. consumers subscribed to streaming services.

Competitive Analysis

Direct & Indirect Competitors

Although Spotify is the number one music streaming service out there, I did a high-level competitive analysis against some of Spotify’s biggest competitors to see what some of their biggest differences are in terms of strengths and weaknesses and their overall pros and cons of features available on each platform.

Features

I decided to dive a bit further in the research and compare each competitors features for their mobile applications, desktops, and browsers. According to this table, it appears that Apple Music and Amazon are are Spotify's closest competitors.

Survey

After gaining insights from the competitive analysis, I conducted a user survey to better understand the user needs, wants, pain points, and desired features for a streaming app. I chose participants who actively use Spotify on a daily basis. The user survey helped me better understand how the users are engaging with Spotify.

After analyzing the results of the survey, it seems that most people use Spotify for its convenience for creating playlists. Although many mentioned that the variety in music played a big factor for them, realistically other streaming services have similar variety in artists and songs. It also seems that people are fairly neutral about Spotify as a company and app overall, but some really love the look and interface and how user-friendly it is.

Interviews

Because the online survey responses showed that users are comfortable with the already existing interface of Spotify and can't immediately think of anything that they'd want to change about their experience, I wanted to focus in on how users interact with the app and what features they frequently use. Therefore, in these interviews I specifically asked questions about playlist usage and what they're doing while listening to music. One user was really into creating playlists (like a majority of survey respondents), while the other I interviewed was more of an outlier and more likely to listen to albums all the way through than set up and listen to playlists. I learned critical information from each of them. In particular, majority of users expressed that music really helps set the mood for what they're doing and really take care to choose the right music before getting started. It seemed like many feature ideas mentioned by the participants were really good to implement but I needed to decide on which one specific feature to include. Some of the features mentioned by the users were the ability to combine playlist so they can shuffle as on playlists, or add a Shazam type feature where a user could hear what song is playing in the background.

Research Findings:

With the research information gathered from the user interviews, I decided to put all the information into an affinity map to help me look for any patterns that may stand out. After creating the affinity map, I was finally able to decide on the new feature for Spotify. The new feature I decided to create - The Mergelist Feature.

user persona

After analyzing all of my research, I developed one persona — meet Avi Hansson. Avi listens to music every day for a variety of reasons, but, ultimately, he turns to music to help set his mood for whatever activity he is getting into. Avi is motivated by discovering new music that falls in line with his interests and adding it to his collection of songs in his library. Avi enjoys creating playlists for special occasions, moods, and activities. On the flip side, however, he is wanting to be able to combine his playlists together so he can shuffle those playlists as one. He wants to be able to keep his playlists separate but create somewhat of a merge.


user empathy map

With this persona presented, I then moved on to creating an empathy map for Avi in order to really empathize with what he does, feels, thinks and says with the Spotify app and identify areas of opportunity.

information architecture

Site Map

Using what I learned from the user research, persona, and empathy map, I developed an updated information architecture/site map for the Spotify app that would add in areas for the new mergelist feature that I wanted to develop. Additionally, I created a few user tasks and user flow to help identify the new screens I would need to develop for my final prototype.

Task Flow

I created a few user tasks to help identify the new screens I would need to develop for my prototype.

  • In task #1, Avi wants to create a new mergelist so he can merge playlists together.
  • In task #2, Avi wants to merge two existing playlists together so he can later shuffle the merged playlist.
  • In task #3, Avi selects the new mergelist and shuffles the mergelist.

User Flow

I created a user flow to help identify the new screens I would need to develop for my final prototype. The main scenario here is Avi is really Viking on two playlists he recently created. He want to merge the 2 playlist together is he can combine the two and shuffle the mergelist from one main shuffle.

interface design

Sketching

Since Spotify already has a strong interface, adding in a new feature presented a fun challenge. Below, you can see a few of the wireframe sketches I developed to add in the merge feature based on design patterns from other applications. I really wanted to focus in on haw to integrate the merge feature into the interface in a way that didn't confuse users who are already so familiar with the app's interface, but also think of ways to make it stand out a bit to encourage users to actually use the new mergelist feature.

Based on scenario 1
Based on Scenario 2
Based on Scenario 3

Wireframes

Once I had all the sketching done of the different scenarios from the user flow, I designed the low fidelity screens of how the new mergelist feature would look and work within the Spotify application. The merge feature is in green to indicate the new feature placement.

Logo Design

Merge Icon Design

I wanted to create an icon that the user would recognize but would also be familiar with Spotify's user interface design and branding. The merge icon is mimicing the same design of Spotify's current shuffle icon. The merge icon use the lines merging into one with an arrow. The shuffle icon lines do not touch, so I wanted to have the same design for the merge icon. Thus, the merge icon was design and added a "+" to add a new merge.

UI Kit

Spotify uses their iconic bright green color to pop among a mostly black and white design. However, I knew that I wanted this new feature to stand out and still keep the same branding experience the user can be familiarized with . The merge feature icon is using the same look and shape of the shuffle icon but with a design of what we see as a merge. The merge icon is conveying two separate items combining, or in this case, merging. I wanted to keep the "+" to let users know this is to add (add merge or new merge).

Final Design

The high fidelity screens involved adding in the new merge icon in the right locations the user can locate the icon. The merge playlist screen is designed to be straightforward and simple so the user can make their selection and continue with their user journey. Once all the high fidelity screens were complete it was then time for prototyping to see how the new merge feature would work with users.

Usability Testing

Prototype

With the final design all set, I went not o create the flows for the prototype. I wanted the prototype to be a clear and simple so the user can complete the tasks. The prototype was based off the scenarios of the user flows and user tasks.

Scenario One

The user is wanting to create a new mergelist. The user taps on "your library" and taps on the merge icon. The user names the new mergelist and taps on the "create" button. The user then taps on "add playlists" and selects the playlists to merge. Once playlists are selected, the user will tap on "merge playlists". The user can now shuffle the mergelist and enjoy the music.

Scenario Two

The user is wanting to merge four existing playlists together to create one mergelist. The user selects the playlist from the Home Screen. The user taps on the playlists. The user taps on the merge icon and proceeds with naming the mergelist and selecting the three playlists to merge. The user then taps on the "merge playlists" and proceeds to shuffle the newly created mergelist.

User Testing

Using a prototype of the Spotify app I created in Figma, I conducted in-person and remote usability testing with 5 participants. I gave the participants a run-down of the usability testing process and asked them to complete a series of tasks using the prototype. The participants were between the ages 20 - 40 years old, both male and female. I recoded the users interactions, impressions, narratives, and navigation flow.

Test Results

Through my usability testing research I derived the key observations and feedback from my users. From these I derived the important patterns and looked for opportunities for improvement, as well as test completion and error-free rates.

Affinity Map

I created an affinity map by grouping the screens from the prototype. The groupings with each participant's response are color-coded by user. I then placed each sticky in the corresponding group, and derived insights which I then turned into recommendations to improve the new feature. This affinity map helped me look for patterns, and let me know what to improve for future revisions.

The insights from my usability testing allowed me to consider design recommendations to improve the user experience of the app:

  • Add An Option For Artists To Create Polls During The Live Stream In Order To Encourage The mergelist screen was modified with bolding the Merge Playlist when a playlist is selected
  • Eliminated the extra step when creating a merge list (Spotify did not have this when creating a playlist) so I felt I needed to keep it familiar to not confuse the user.

Conclusion

I had a lot of fun working with an already existing interface and trying to figure out how to integrate something new. It gave me a chance to experiment more with Figma's prototyping capabilities and how to work from an already established brand and UI elements. As for next steps, I would love to work on connecting all of the elements on these pages to work together and further build out this prototype. From there, more user testing would need to happen (ideally in person) to see how users interact with a more functional prototype.

I think Spotify could benefit from implementing this feature for those who want to merge playlists together to shuffle playlists, duplicate playlists and edits playlists easier. If this feature were to be implemented I predict an increase of Spotify premium users, an increase in the number of mergelist/playlists created, and an increase of engagement in the overall application.

Let’s Connect, grab some coffee, and talk design