User Interviews

The research for this project consisted of two rounds of user interviews. The first round aimed to get a feel for why participants share music with people in their life (or why not if they don’t). The overall trends identified were that participants either hear a song and think of someone they know, which makes them want to send it to them to let them know they’re thinking of them, or that they enjoy discovering new music and like sharing what they discover with friends. In either case participants felt that sharing music with friends is a special way to stay connected to them. Everyone has busy lives, so scheduling time to catch up can be difficult to coordinate, but sending a quick song is a nice way to let someone know you’re thinking about them. Participants even shared that sending a song to someone can act like an icebreaker to a conversation since sometimes asking “how have you been?” feels like an overwhelming question to answer if you haven’t spoken in a long time.

Once I had a grasp of the different motivations surrounding why people share music, I wanted to dig deeper into how they do it in order to identify any pain points that may exist in that process, which became the focus of round two of the user interviews. All of the participants in round two shared that they solely use Spotify’s mobile app to share music via text to their friends (one person also uses Soundcloud in addition to Spotify). Here are a few quotes I pulled from round two highlighting the main pain points I identified:

User Persona

After synthesizing the results of both rounds of interviews I put together a user persona to start thinking about the problem space.

 Identifying the Problem

Using the pain points identified from my research I started to hone in on what problem this feature will aim to solve. After some brainstorming I came up with three potential problem statements to pursue:

How might we help users identify which friends share their music taste?

How might we make sharing music with friends even easier?

How might we help users keep track of music they’ve shared with friends?

A bunch of ideas came out of this exercise, but not all of them were great. -and certainly not all of them were feasible for the scope of this project. I started liking an idea to add a feature that would show you which of your friends share the same music taste as you based on what you’ve listened to. Maybe a user profile avatar would appear next to artists or albums they’ve listened to multiple times as you search, or maybe there’s a monthly report that shows you which of your friends’ listening habits had the most in common with yours that month. I decided this idea wasn’t strong enough to continue with since my research showed that not a lot of people spend time searching for music anymore, so most people likely wouldn’t even notice this feature. It’s not really solving a problem.

What I did decide to move forward with was a solution to a specific pain point I identified during user interviews: “Sometimes sharing a song via the Spotify app on my phone has too many steps to do quickly”. What if I pulled the share feature out of the layered menu where it exists now and stick it straight on to whatever view the user is in (song, artist, album) with a share button? This solution is a direct response to a specific pain point identified by multiple participants in my user interviews, which gave me the confidence to move forward to storyboarding knowing this solution would be solving an actual problem that exists.

Completing these two sketching exercises gave me a clear idea of what problem I was solving, a solution to move forward with, and some additional details as to how to feature would work.

 User Flow

With the premise to my solution decided on I needed to create the main user flow to figure out which screens I’d need to build out in order to illustrate the feature properly. I decided to include two flows here; one illustrating how the user would create a new contact shortcut, and the other illustrating how the shortcut feature would work once it’s set up.

Wireframes

Since I was adding a feature to an existing product I utilized screenshots to build my feature on top of making my wireframes pretty high fidelity to begin with.

The top row shows the flow including saved shortcuts, while the bottom row shows the flow for creating a new shortcut.

UI Designs

The final UI designs saw a few tweaks from the wireframes I’ll go over in the Test section. A few visible changes are the additions of photos and a more polished conformation pop-up notification at the end of the flow. Spotify has a very established design system employed across their app, so my job here was to follow along and not disrupt that system at all with the addition of my feature. I’ve separated the designs into three groups here to show more detail.

Using the Shortcut Feature

From the song view here the user would hold the share button until their favorites pop up, release the share button, and then select which contact they want to send the song to. A confirmation would then pop up with the option to leave the app and go directly to the message, or to dismiss and continue listening. This feature reduces the steps required to share a song to two from the six it requires currently.

Creating a New Shortcut

To create the shortcut used above the user would tap the share button instead of holding it which would take them to their share options menu. Here they have the option to do a one time share with someone who isn’t saved as a shortcut (the current process), share with a saved shortcut that isn’t on their favorites, share with multiple shortcuts, or create a new shortcut, which is what the screens below illustrate. When creating a new shortcut users add a name, a photo if they want to, preferred share method with applicable phone number/social handle, and finally a customized message to send along with the link to what they’re sharing.

Manually Sharing from the Share Options Menu

The screens below illustrate how the user would select the newly saved shortcut from their share options menu and manually share a song with them.

 Usability Testing

Two rounds of usability testing were conducted for this project. I built out a prototype inside Figma to illustrate the two flows and observed participants as they navigated through it. The first round was conducted after creating wireframes to see what participants thought of the flow/idea. I took away two main insights from the first round of usability that informed my design decisions going into filling out the UI designs:

1. The idea that Spotify would choose your favorite shortcuts to be displayed on the song page based on who you share the most music with could potentially create a negative user experience. For example, maybe you break up with someone you were dating and sharing music with a lot and you then have to see their face pop up in your favorites until someone else takes their place. -that would be a bit of a bummer.

   Design decision: I added a toggle switch to the shortcut detail page which lets the user decide if that contact should be added to their favorites or not.

2. Considering usability for folks with color blindness or any other visual impairment I wanted to make sure I wasn’t just relying on the use of different colors to signal key movements within the user flow.

   Design decision: I added a favorites icon next to the name of each contact to signal when it is included in the user’s favorites instead of just the blue ring.

The second round of usability testing was conducted after the first iteration of UI designs were done. The goal of this test was to gauge how successful the design decisions informed by the first round of usability testing were, and to see if anything else pops up. There was one main takeaway from this round of testing that informed a new addition to the final design.

1. I noticed a few people having a hard time figuring out what they were supposed to do once they created a new contact and saw it show up in their favorites.

   Design Decision: I added a few short phrases to help train users how to navigate the feature.

 Prototype with Final UI Designs

This project was really important for my growth as a designer. It challenged me in new ways and pushed me to think differently than I had in previous projects. The research and define phases of this project were especially important to focus in on how to identify a problem supported by research to then brainstorm potential solutions to. It’s so easy to try to jump to thinking about solutions right out the gate, but a great solution to a problem that doesn’t exist will get you nowhere in the end. This is the part of design that really excites me. -the problem solving.

Working within the constraints of adding on to a product that already exists was another challenge, but in some ways also made the process go a lot quicker. I spent a lot less time working out wireframes and making visual design decisions and lot more time really sitting inside the problem space. The final UI really felt like the tip of an iceberg of work buried just below the surface.

If could take this project further I’d love to address one of the other main pain points identified in my research regarding helping users keep track of music they’ve shared with other people. I think there’s some potential there to build out a way to visualize a share history within the app that could be interesting.

Thanks so much for reading! Please feel free to reach out if any of this interests you, I’d love that chat further about it :)