Kerri Grier

The Challenge

How might we deepen relationships through music?

In this hypothetical case study, Spotify is looking for a way to make its app more social as a means to increase user engagement and retention. The goal is to deepen connections between people (whether that's between individuals or groups) through music.
View Prototype

Project Type

Solo project for UX Academy program

Tools

Sketch, Invision

Role

Research, Interaction Design, UX / UI Design

Duration

5 weeks

The Solution

Facilitating music recommendations

A feature where users can easily request and give music recommendations to friends and followers. Recommended songs are compiled within a playlist so that the requester can review the music in a familiar way.

Design Process

Understand how people connect through music

For this challenge, I focused on understanding how people currently connect with others through music. Knowing the existing mental models allowed me to identify gaps where technology could help make these existing behaviors easier.

Research

Who are we designing for and what are their needs?

Research Plan

Prior to the actual research, I drafted a research plan to define my research goals and lay out my assumptions. View the entire Research Plan.
Goals:
Understand the needs and desires people have for music.
How they connect to others with music.
How the music streaming industry is currently keeping people engaged and connected.

Secondary Research

Spotify is one of the leaders in music streaming, but who exactly is using it vs another streaming service? A market analysis gave a deeper look at the demographic I'd be designing for:
The primary user base is between 15-34 years old and > 50% of users have premium. Spotify is the most male dominated of the music streaming app in the game, and 75% use Spotify on mobile - primarily iOS.
Based on my competitive analysis, I created personas for each major competitor:
There were a couple of trends between competitors: namely, other streaming services were finding ways to integrate with other services, such as the Google Home or Amazon Echo, as well as developing more mature algorithms to personalize song recommendations. Spotify currently offers quite a bit of freedom in creating your own playlists, however, it seems to lag behind in its new song recommendations.

User Interviews

After getting a better idea of the demographic and product space, I interviewed several potential and current Spotify users on their experience with music and streaming services - especially on moments when music had made an impact on them.
Insights

Empathy Map

I distilled key points from my interview notes and grouped similar notes to find patterns:

Define

Outlining the scope

Personas

I created a persona that summarized the insights from the primary and secondary research:

POV/ HMW Statements

I listed out POV and HMW statements to help inspire my brainstorming session. These statements were based on the insights and needs I determined from the interviews.
HMW/POV Table

Ideate

Mapping out ideas

Brainstorming

Keeping my problem statements in mind, I did a freestyle brainstorm for potential social features. I then went through each idea and ranked it based on perceived effort, impact, and how social it would be. I placed the ideas that were both at least moderately social and impactful to the top. Check out the idea list.

I decided to focus on creating a feature where users could post song requests and send recommendations to their friends within the Spotify app.

Task and User Flows

I created a couple of user flows to show the decision points and interactions a user would take to accomplish each goal. I added a brief paragraph before each user flow to bring some context to the flow.
User Flows
Click image to view full-size

Prototype

Adding the feature to the existing app

Wireframes

I created high-fidelity wireframes to focus on the visual hierarchy of the content before adding imagery and branding.
View: All Wireframe Screens

Mockups

After refining the wireframes to ensure that the most important content was getting the attention it deserved, I added images to bring the pages to life.
Mockups

Prototype

I assembled the prototype based on tasks that are essential to the new feature: suggest a song to a friend, create a music request, and review request playlist.
Interact with the prototype below:
View Prototype

Test

Finding opportunities for improvement

Usability Tests

I recruited 5 participants from my network and local public spaces to try out the new feature. The primary goal of the usability test was to observe and understand how people would submit and suggest music requests. Each usability test was recorded and then transcribed for review after. View the Usability Test Plan.

Affinity Map

I distilled comments and observations made during the usability tests and grouped similar statements together to suss out any patterns:
Click image to view full size

Iterate

Refining the new feature flow

I updated the prototype based on the affinity map recommendations. Below are some of the changes made:
Update #1 - Allow users to make recommendations to anyone
Initially, users could only make a recommendation if someone had requested it. However, based on the usability tests, I could see that the first instinct was to search for a song to send to a friend, rather than to see who wanted a recommendation. I added this capability so that users could have more freedom and flexibility in who to recommend songs to
Added Recommend Music to list of options when searching for songs.
Once the Recommend Music option (see previous image) is clicked, users are taken to this screen where they can select multiple friends to send music recommendations to.
Update #2 - Clarify Music Recommendation dialog box
There was a lot of confusion with completing the music recommendation: users were unsure when the recommendation was made, whether they needed to add a note, and who they could recommend to. I updated the dialog box to make it clear that they needed to select the CTA to send the recommendation, as well as clarified the wording.
Original
Updated

Reflection

Lessons learned

One of the aspects about this project that I really enjoyed was being able to think of a new feature within existing constraints. Taking the time to deeply explore an existing app helped me learn more about UI design and how other designers had approached a problem.
‍
However, the usability tests taught me to stay aware of existing mental models within an app. A majority of participants associated the green CTA buttons with only playing a playlist and using the button for other actions was surprising to them. I tried my best to re-use existing aspects of the app for the new feature, but it could have been interesting to explore branching out and bringing new elements to the app.
LinkedinE-MailMedium
Designed by Kerri Grier © 2020.