Case Study
Shazam
Music Identifier App Redesign
Overview
Shazam is a music search engine and discovery app capable of discerning the title and artist of almost any song in a matter of seconds. While initially just a simple utility, Shazam’s app has begun to use data to help users discover new music, follow artists, and even export their Shazam’d songs to Spotify and Apple playlists.
Despite the overwhelming amount of human-centered data they’ve collected on music taste, Shazam has done very little to leverage this information into useful features. Research indicates that the most common use case of Shazam lasts less than half a minute – suggesting that users are using the app to identify a song, then immediately bounce to a different app to collect or listen to the song.
Client: Shazam
Team: Leigh Yonemoto, Sebastian Baptiste, Eugena Oh
Role: UX Researcher, UX/UI Designer
Tools: Figma, Trello, Miro, Whimsical
Problem Statement
Shazam needs a way to increase time spent on the app by providing services and features to help connect users and their music.
The BIG Questions
In order to determine which features would increase the value of Shazam’s existing app, we asked ourselves the following questions:
What role does social networking play in sharing and enjoying music?
Do people like to receive music recommendations through an algorithm, or is human input more effective?
Can we use geolocation data to predict, record, or map music?
What can Shazam do to increase the value of using their service to feed users’ tastes in music?
The Process
RESEARCH
Competitive Analysis
We began our research by comparing Shazam’s features to those it its competitors like Spotify, Apple Music, and Pandora. The goal was to identify missed opportunities and to explore new features that would increase engagement and keep users on the app. Most music app competitors incorporate social features like a live listening feed, playlist sharing, and the ability to follow other users and artists.
Other features Shazam lacks involve personalization features such as personal profiles, curated playlists or radio stations, and being able to search for songs.
Feature Inventory
Spotify
Apple Music
Pandora
Shazam
Music Detection
Live Listening Feed
Share Playlists
Follow Friends & Artists
Personal Profile
Curated Playlists
Radio
Song Search
Comparative Analysis
We then conducted a comparative analysis with other social media apps like Instagram, Twitter, Snapchat, and Vemno. Here we focused on the primary features that helped to foster social engagement with other users such as a home feed, connecting with friends and followers, and the ability post personal stories and like content.
Feature Inventory
Snapchat
Venmo
Shazam
Home Feed
Friends & Followers
Stories
Likes
Profile
Map Feature
User Interviews
We interviewed 6 users who were familiar with the Shazam app to gain more insights. We found that the most used music app is Spotify because of its customization abilities such as curated playlists based on listening history, the ability to see what friends are listening to, and being able to create your own playlists and share it with others. Our interviewees were also avid users of social apps because it was a way to keep up to date with friends and engage with their network. Every person we interviewed stated that their sole purpose for using Shazam was to identify music. Other music apps were used for all other music needs.
What did people say?
SYNTHESIS
User Personas
We synthesized our research to create two user personas. This helped us develop empathy for our target user group and to help drive design decisions going forward.
Age: 25
Occupation: DJ
Location: Los Angeles, CA
Christina
The DJ
Needs
- Music discovery features
- Location services
- External app integration
- Social feed
Pain points
- Inability to see what other DJs are listening to
- Lack of sharing features on music apps
Goals
- Share songs with others
- Discover music in different locations
- Stay up-to-date with the latest music trends
Task Flow
Journey Map
Problem Statement
Christina needs a way to discover new music that she can use in her sets, because she wants to stay relevant as a DJ.
How might we...
How might we help Christina find music other DJ’s are listening to?
How might we help Christina discover new music in different locations?
Age: 27
Occupation: Courier
Location: New York, NY
Charles
The Music lover
Needs
- Curated playlists
- Lyric recognition
- Location services
- Connecting with friends
Pain points
- Doesn’t remember where he heard a song
- Lack of social features to share finds with friends
- Lack of music recognition
Goals
- Options when looking up music
- Ability to follow artists
- Easily keep track of songs by location
Task Flow
Journey Map
Problem Statement
Charles needs a way to find new songs to add to his curated playlists and see there he ears certain songs because he listens to music on the go.
How might we...
How might we help Charles know where he found a particular song?
How might we help Charles discover music his friends are listening to?
IDEATION
Keeping our users at the center of our decision making process, we brainstormed features that would act as solutions to their problem statements.
New Features
Profile
A profile feature gives the app a personal touch. On the profile users are able to see liked songs, view shazamed songs in a list or tile view, and share music to a feed. These songs can also be easily added to personal playlists. The new shazamaps feature is also accessible from the profile where users can access their map that has the location history of their past shazamed songs .
Feed
We designed a song activity feed allowing users to scroll and explore new music. Users can choose to explore their friend feed (people they follow), global feed (all Shazam users), and personal feed (songs they have shared).
ShazamAps
Shazamaps is a map feature with the locations, times, and dates of when a user has used the app to identify songs. This allows for another way to find songs that they have shazamed when they don’t remember the date, time, or name of the song, but can recall where they were when they heard it. This feature can also be used to explore other songs that people have listened to in a particular location
Bottom Navigation
We created a footer that would be on each page of the app keeping in mind the idea of "thumb-driven design." The tap to Shazam button is in the middle to create easier access for identifying music no matter where you are on the app.
App Map
Pen and Paper Sketches
TEST
Usability Testing
We conducted usability tests with our mid-fidelity prototypes and learned several things that informed our final iteration of our high-fidelity prototypes. We wanted to test the app’s functionality and get feedback about the navigation, interface design, and overall user experience.
BEFORE
AFTER
Users found the recommendations layout confusing.
Seeing a partial view of the album covers confused users and made the screen look unfinished. It wasn’t intuitive that they could scroll to the left to view more content.
Solution:
We changed the layout by reducing the space in between the columns to make the content of second column of recommendations more visible.
The location dot design was too large making it difficult to view the map.
The original design of our location dot on the shazamap was too large making it hard for users to select a specific location on the map and covered a lot of the map’s content.
Solution:
By making the location dot smaller, users are able to view the complete map and clearly view the exact location of the places they have opened the app to identify music.
BEFORE
AFTER
BEFORE
AFTER
The bottom navigation button did not follow common design patterns.
We initially put the feed icon on the right and the profile icon on the left. Users mentioned that the feed feature was more important to them than the profile feature. For most social apps, the feed was on the left of the navigation bar signifying that it was a primary feature as well.
Solution:
We changed the feed icon from a hamburger menu to a home icon and moved it to the left of the footer. Users gave us positive feedback on this change and said that the new layout was more intuitive and associated the home icon with new content and activity.
PROTOTYPE
Next Steps?
Given more time, we would like to incorporate more features our users wanted to see on Shazam such as:
Personalized Playlists
The users we interviewed mentioned that they would like to be able to create their own playlists on the Shazam app. They would also like to see curated playlists based on their music taste and past shazamed songs.
Playlist Sharing
Once we create a personalized playlist feature we would like users to be able to share those playlists with friends and followers. This can either be through direct messaging or posting it to their feed.
Swipe interActions
From the feed, users will be able to swipe right on the song to like it and swipe left to add to a playlist. From the music player, we want users to be able to swipe left to view the song lyrics and artist information.
Charts Redesign
We would like to show a city’s top charts based on the user’s current location. We would also make the search by city field more visible since we didn’t notice the feature existed when we first explored the app.
See more of my work:
Tot Squad
Client Website Redesign
SimplyKaiJewelry
E-commerce Responsive Redesign
Design Challenges
Explorative UI