Have you ever tried to look for new songs but ended up waisting time scrolling and swiping with nothing matching your mood? For a lot of people, music should be effortless and is part of day everyday life. Yet, a lot of us fails at quickly finding the perfect playlist for the day! This sparked a question: how can I design the perfect music web app?
In order to understand the users’ pain points about their music experience on the current solutions on the market, I interviewed different people from various background. Their problems and concerns helped me discern 2 areas of improvement:
Available music websites are overwhelming, with busy pages, which leads to confusion and discourage from navigating further
Current solutions don’t provide easily accessible new songs/artists/playlists fit to the users tastes
Simplifying what already exist. Vibe Music needs to accommodate to those who want to discover new artists and songs, and to those who want to a quick and effective navigation. I want the user to experience an enjoyable, stress-free moment on the platform, which actually align with the sole purpose of music itself!
A clean Information Architecture is key to a smooth and enjoyable website navigation
Clean designs for each page will allow a quick, easy and pleasant navigation
Creating a website and app version of the platform will be another challenge that will improve user experience
I began by doing some research on the existing music websites to identify the key features I envisioned Vibe Music to have. I was able to know what solutions the users already prefer and dislike.
I wanted to grasp a better understanding of the users pain points. I conducted users interviews which allowed me to empathize with them and create personas and problem statement. These will be the common thread to make more strategic design decisions as well as identifying areas of improvements.
The pain points are significant! Users expect a music website to have an intuitive and stress-free navigation.
To kick-start the ideation, I first planned out a basic user flow then mapped out a sitemap to assure a clear and easy navigation. Then, I’ve scoped a number of wireframes I would have to build and started making low-fidelity prototype for desktop. Once done, I iterated the exercice for a phone screen size.
I conducted an unmoderated usability study on users from all ages and background. This study allowed me to pinpoint a couple of improvements axes, which I applied to my high-fidelity prototype for a second unmoderated usability study.
Most users were distracted by the carrousel, due to its size. I switched the design for a more minimalist (less images) and modern one
Some users weren't confortable with the white background, as they are used to music website being dark
A final usability study demonstrated the pain points were adressed: to users, the design is intuitive and pleasant to navigate, with a clear and neat design, making the website and its purpose more engaging and appreciated.
With this project, I realized how the smallest details have their weight in creating a smooth user experience. Always putting the user first-and-center is the best way to quickly design clear and concise solutions!
That being said, I wish to apply these ideas to next iterations:
In consideration for those with limited vision and more confortable with high contrasted colors, I'd create a bright version of the website
Adding a "like" feature on albums and artists would improve the quality of suggestions made by the AI
To improve navigation speed furthermore, I'd work on the homepage design on both devices to prevent the user from scrolling on the page
Creating a page where people could share their favorites songs, artists or playlists would also improve the website organically