top of page
Spotify float.jpg

Designs for an Artificial Intelligence
assistance in Spotify application

Role:           UX Designer UX Researcher

Team:          Nima Shahab Shahmir, Yura Kim, Sophia Shin
Timeline:     January - March 2023

Tags:           UX/UI Mobile App IOS App Usability Study User Research

Tools:          Figma Google Docs Google Slides Google Meets Zoom Slack Apple Voice Memo
Detail:         UX Design course, Master's degree in User Experience Design at Maryland Institute College of Art

Frame 32.png

In this project, my primary focus revolved around collecting user feedback, research, and designing the interface for the initial phase of user text search and main menu of Spotify Assistant.

At-a-Glance

 

During my UX design master's program at the Maryland Institute College of Art, my team and I undertook a project to design an interface for Spotify application with an artificial intelligence (AI) music assistant feature. Our goal was to enable users to effortlessly create playlists containing new music based on their past activity and followed artists, while also responding to music-related and in-app requests. The AI feature was designed to offer both text and audio input options for user searches.


 

Through user-centric research and iterative design processes, we aimed to create an intuitive and user-friendly experience that seamlessly integrated AI capabilities into the Spotify app.

UX SPOTIFY At-a-Glance

Problem

 

Many Spotify users feel overwhelmed while browsing the unorganized music search menu and podcast contents, leading to difficulty in discovering music that suits their mood or situation.

Customers expect a quick, accurate, and user-friendly AI assistant feature that delivers relevant results based on their preferences and mood, offering both voice and text input options for flexibility.

UX SPOTIFY Problem

Solution

 

To address this problem, our objective was to develop interfaces for AI-powered features that generate personalized playlists tailored to users' preferences and situational contexts, ensuring a seamless and efficient browsing experience.

By achieving this, we aim to enhance user confidence and engagement, leading to potential increases in premium subscriptions for Spotify. The success of this solution would reflect in happier and more satisfied users, fostering a stronger and more loyal user base for the platform.

UX SPOTIFY Solution
Frame 33.png
Frame 34.png
Frame 35.png

Process

 

Throughout the project, effective communication with my teammates ensured a cohesive approach. We meticulously aligned the design aesthetics, colors, and fonts of Spotify, seamlessly integrating our screens with the live application's look and feel. Our extensive research involved studying successful applications and analyzing music platforms to create a user-friendly design for our AI music assistant.

We began with sketches and comprehensive desk research, formulating relevant questions for user interviews and usability testing. Conducting 7 interviews with 12 participants, we gathered valuable insights into user needs. These inputs guided our iterative process, resulting in three sets of high-fidelity designs, refined based on user feedback. The final interactive prototype represents a user-centric AI music assistant for Spotify, embodying best design practices for an enjoyable and efficient user experience.

UX SPOTIFY Process

User Research and Sketches

 

I took the lead in conducting interviews with 4 participants to gain a deep understanding of the overall user needs for the new AI music assistant feature. The participants, ranging from tech-savvy Spotify veterans to newcomers, offered diverse perspectives. This data played a pivotal role in guiding my design approach and provided essential direction for the entire team, allowing us to create designs that effectively addressed the users' needs and preferences.

Users expressed the need for a more simplified and personalized interface, particularly when creating and organizing playlists. They desired a more intuitive search menu and the ability to view playlists based on artists. The Released Radar playlist was praised as a useful way to discover new music from their favorite artists.

 

The AI-powered playlist creator feature received positive feedback, with users finding it fascinating and useful for discovering new artists and songs. However, privacy concerns emerged due to its utilization of in-app activity data. Users preferred voice-based interaction with the AI feature, seeking quick and accurate suggestions based on a song's specific attributes, like instruments and vocals.

UX SPOTIFY User Research

We mainly focused on 4 personas:

Additionally, we developed user flow which is in tune with the persona:

As part of our team's collaborative effort, we each developed sketches for the interface design. My focus was on covering all the menus to understand the sections I would be working on.
Here is my initial sketch for this project.

Wireframes and Prototypes

 

Throughout the project, I ensured constant communication with my team while designing the main menu and text AI search interfaces for the AI music assistant feature. Collaborating closely with my teammates, we maintained consistency in design aesthetics and the Spotify brand across different sections of the project. I started with Mid/High Fidelity designs, which were refined based on user feedback. After conducting usability tests, I created the final High-Fidelity design for the AI music assistant feature.

UX SPOTIFY Wireframes and Prototypes
Frame 38.png
Frame 39.png
UX SPOTIFY Usability Study

Usability Study

 

I conducted user testing sessions with 7 participants, both in person and virtually using the Zoom application. After providing a brief introduction to the project, I shared the interactive prototype with each participant and asked them to complete various tasks. This allowed me to evaluate the effectiveness and user-friendliness of my designs.
 

The tasks performed by the participants helped me gather valuable feedback and insights. Based on their input, I implemented iterative design improvements to enhance the overall user experience. The measurements and data collected from the participants' feedback played a crucial role in shaping the iterative design process for this project.

Design Iterations

 

The insights gleaned from my usability study played a critical role in the iterative refinement of the Spotify AI music assistant feature's design. By meticulously analyzing user interactions, preferences, and pain points, I identified areas for enhancement.

These design iterations were a direct response to the valuable feedback received, which enabled us to craft an interface that prioritized user intuition, catered to their needs, and empowered them to navigate the feature seamlessly.

The iterative process allowed me to align the interface more closely with user expectations, resulting in a more user-centric and engaging experience.

UX SPOTIFY Design Iterations

Iteration #1: An intuitive main menu
 

The left image showcases the menu created during the mid-fidelity design phase. This menu, while abundant in options, proved overwhelming for users, leading to confusion as revealed in usability studies. Notably, the Recent Prompts section dominated screen real estate, necessitating users to select "Start Session" to initiate the Spotify Assistant.

On the right, the redesigned menu reflects the iterative design process, driven by insights from usability testing. The Recent Prompts menu has been transformed into a compact menu positioned above the search box. Users can effortlessly scroll through available prompts. Furthermore, users now encounter a more seamless interaction with the AI feature upon opening Spotify Assistant, eliminating the need to click "Start Session."
As part of the new interface, "Spotify AI" button is added in the bottom menu making it easier for user access to this feature.

Iteration #2: Recent Prompts redesigned

Let's dive deeper into the enhancements made to the Recent Prompts menu.

On the left side, we have the mid-fidelity interface where users had to scroll vertically to access their past prompts for the Spotify Assistant. Additionally, users had the option to delete individual prompts. However, feedback from usability testing indicated that the delete option wasn't particularly useful.

Now, on the right, we have the redesigned version, which optimizes screen real estate more efficiently.

In higher-fidelity iterations, a long tap feature was envisioned, allowing users to seamlessly remove prompts from the scrollable list, making the process more intuitive and space-efficient.

UX SPOTIFY Final Design

Final Design

Spotify float.jpg

↓ Click below to view and interact with the final design

What I Learned

 

  1. Iterative Enhancement: Constant refinement based on user feedback resulted in a more intuitive Spotify AI Assistant.
     

  2. User-Focused Design: The AI music assistant's development was guided by user insights, ensuring it aligns with user needs.
     

  3. Streamlined Menu and Navigation: A revamped menu layout enhanced navigation and user interaction.
     

  4. User Input Integration: Valuable user suggestions played a pivotal role in shaping the final AI Assistant design.
     

  5. Efficiency and Effectiveness: Striking the right balance between simplicity and essential features created an efficient music experience.
     

In summary, my experience with the Spotify AI Assistant project highlighted the significance of iterative improvement, putting users at the center of design, optimizing navigation, embracing user feedback, and delivering a streamlined yet powerful music interaction tool.

UX SPOTIFY What I Learned
bottom of page