UI/UX Design: Unlocking the user experience through “Design Thinking” — Spotify UX Case

Elmustapha Abourar
7 min readApr 28, 2023
UX/UI Design Thinking

Design Thinking is a problem-solving approach that is used to come up with innovative solutions by understanding and empathizing with the needs of users. It involves a series of steps that help in identifying the problem, generating ideas, prototyping and testing solutions. Here are the five key steps of the Design Thinking process:

Design Thinkin

1 : Empathize: This is the first and most important step in the Design Thinking process. It involves understanding and empathizing with the people who are facing the problem. This step requires conducting user research, which involves observing, interviewing, and analyzing the behavior of users.

2 : Define: Once you have empathized with the users and understand their needs, the next step is to define the problem. This involves synthesizing the information collected during the empathy phase and identifying the core problems that need to be solved.

3 : Ideate: Once the problem is defined, it’s time to generate ideas. This phase involves brainstorming and coming up with as many ideas as possible, without judgment or evaluation. The goal is to generate a large number of ideas that can be refined and evaluated later.

4 : Prototype: Once you have selected the most promising ideas, it’s time to create a prototype or a rough draft of the solution. This can be a physical or digital prototype that allows you to test and refine the solution.

5 : Test: Finally, it’s time to test the solution. This involves testing the prototype with users and getting feedback. The goal is to identify any flaws or areas for improvement and refine the solution further.

Spotify User Case-Study :

Alex, a student, faces the common problem of getting distracted by his roommate while studying in his dorm room. Although he has noise-canceling headphones, he finds it hard to filter out distractions from music with lyrics. To address Alex’s needs, we will use the Design Thinking process to understand his goals, needs, wants, and fears and come up with a solution that improves his study experience with Spotify.

EMPATHY MAP

1 — Empathize :

The first step in the Design Thinking process is to empathize with the user. In this case, we need to understand Alex's needs, wants, and fears.

Alex’s Persona

From our research, we know that Alex wants to cut out distractions from his roommate, gain focus while studying. He needs to find playlists of songs with no lyrics and good tempo and exclude slow-paced music from his search. He also wants a way to refine his search, better classification of existing playlists, and a more efficient way to find playlists based on their attributes instead of their titles. His fears include spending too much time browsing playlists, not knowing what to type in the search bar, and ending up with overwhelming search results that don't match his needs.

2 — Define :

The next step is to define the problem. In this case, the problem is how to help Alex find the right music to study without distractions and with the right tempo (BPM).

Pain Points :

Based on Alex’s goals, needs, wants, and fears, we identified the following pain points that he experiences while using Spotify to find the right music to study:

1 — Alex could not find the “Playlist” section on top of the search results :

When Alex searched for playlists with no lyrics and good tempo, he could not find the “Playlists” section on top of the search results. This made him feel disappointed as he had to scroll down to find the section.

2 — Alex only found 3 playlists in the “Playlists” section :

When Alex finally found the “Playlists” section, he was disappointed to see that there were only 3 playlists available. This limited his options and made him feel like he had to settle for a playlist that may not meet all his needs.

3 — Alex did not find any precise description of the playlists

Even when Alex found a playlist that seemed promising, he was disappointed to see that the titles did not provide a precise description of the content. This made him feel overwhelmed as he had to listen to the playlists to determine if they were suitable for studying.

3 — Ideate :

The third step is to come up with ideas to solve the problem. Some possible ideas are:

1 — Make playlists more prominent: Add a “Playlists” tab to the navigation bar to make it easier for users to find playlists. This will help Alex quickly find the playlists he is looking for without having to scroll through search results.

2 — Increase the number of playlists displayed: Show more than three playlists in the search results to give Alex more options to choose from. This will also make it less likely for him to feel disappointed or overwhelmed.

3 — Provide better playlist descriptions: Improve the descriptions of playlists by providing more information about the type of music and the mood it evokes. This will help Alex quickly determine if a playlist is right for him without having to listen to each song.

4 — Add filters and sorting options: Allow users to filter playlists by tempo (BPM), type of music and mood to help them quickly find the perfect playlist.

5 — Utilize machine learning algorithms: Machine learning algorithms can be used to recommend playlists based on Alex’s listening history, search queries, and behavior on the app. This can help him discover new playlists that match his preferences without spending too much time searching for them.

Analyze audio tracks using AI algorithms: There are several machine learning models available that can analyze audio tracks and identify the vocal components of the track.

Remove vocal components: After identifying the vocal components, AI can be used to remove them from the track, leaving only the instrumental components.

Create instrumental tracks: Similarly, AI can be used to create instrumental and acapella tracks by removing the vocals or instrumental components from a song, leaving only the instruments or vocals.

Integrate with Spotify: These AI algorithms can be integrated into the Spotify platform, enabling users to easily filter and search for non-lyrical music (instrumentals) or acapella tracks.

4 — Prototype:

Based on the solutions discussed above, we can create a prototype for the new and improved Spotify search experience that caters to Alex’s needs. The prototype includes the following features:

You can Download the Prototype in FIGMA

  • A “Playlists” tab in the navigation bar that leads users to a page dedicated to playlists.
  • Filters to sort playlists based on tempo (BPM), type of music, and mood.
filters with AI Remover
  • A refined search experience that allows users to search for playlists based on attributes instead of just titles.
  • An AI-powered vocal or instrumental removal creation tool.
Result

This prototype addresses Alex’s pain points and provides him with an efficient and enjoyable search experience.

5 — Test :

To test the effectiveness of our prototype, we conducted user testing with a group of students who faced similar challenges to Alex. We asked them to perform several tasks, such as finding non-lyrical playlists, filtering playlists by tempo and type of music, and using the AI-powered vocal removal tool.

The results of the user testing were very positive. Participants were able to easily find non-lyrical playlists, use the filters to refine their search, and quickly remove vocals from songs using the AI tool.

Overall, the prototype was successful in addressing Alex’s pain points and providing an efficient and enjoyable search experience for users. By implementing these features into the Spotify platform, the app can better serve students like Alex who need to study in distracting environments.

Ressources :

What Is Design Thinking?

The Explainer: What Is Design Thinking?.

An introductory guide to design thinking.

--

--

Elmustapha Abourar

Software Engineer Student @Holberton School & Pro Dancers Choreographer DeeJay / Beat Maker