Spotify App Redesign

UI/UX Project

OVERVIEW

This project is to redesign the Spotify app by adding a lyrics function and a comment feature into it. So it will become more interactive with the users.

HYPOTHESIS

Users want to be able to see the lyrics when listening to a song and have the possibility to comment on the songs.

COMPETITIVE RESEARCH

I did some research on Spotify and its competitors, to see whether they have lyrics or comment features or not.

Lyrics

Spotify

Apple Music

Netease Music

Youtube Music

Soundcloud

Limited Songs

Yes

Comments

Yes

Most of the music apps have or attempt to develop the lyrics feature, it shows the users' need at some level.
Most of the music apps do not have the comment feature yet, it is still an experimenting field for the main-stream apps.

USER INTERVIEWS

I interviewed both 9 Spotify users (only have Genius) and 9 Netease music users (have both lyrics and comment features) to get an idea of how they think of these features in two different perspectives.

GOALS

Do the users want to see the lyrics when listening to a song?
Do the users want to share their thoughts on songs?
Do the users use lyrics and comment features if have them?
What the users are doing now if they want to see the lyrics or comment?

LEARNINGS FROM INTERVIEWS

Around 80% of the interviewees would like to have an option to see the lyrics.
Around 70% of the interviewees want to comment on the songs and all the interviewees want to see others' comments.
Almost all the users of Netease music use the lyrics and comment feature.
The users search lyrics on Google or use Musixmatch when they don't have lyrics function.
The users go to comment or see the comments of the songs on Youtube.

PERSONAS

Based on the qualitative data and information I got from the interviews, I defined two personas which are Alex and Chris, they are both musicaholics with different personalities and needs. The personas could help me empathize the main user group better and prioritize goals according to their needs.

TASK FLOW

USER FLOW

MOOD BOARD

WIREFRAMES

Low-fidelity

Mid-fidelity

High-fidelity

USABILITY NAVAGATION TEST

Based on the high-fidelity wireframe, I conducted a navigation test with 10 online testers on the Usability Hub, testing how the users will interact with the prototype.