Online Radio Hub
The catalog of radio stations from all over the world in various genres that you can listen to online for free.
Role:
concept, research, design
Tools:
Figma, PS
Duration:
1 month
Problem
Daily lots of music lovers usually search the World Wide Web for radio stations with their favorite music of different genres, located on dozens of websites. People tend to find suitable audio content and convenient functionality on the same platform, which ultimately takes up too much time and effort.
Goal
To give music lovers a simple, fast and structured service tool for listening to the radio online. Easy to understand, convenient to use. Just to enjoy your favorite music, instead of wasting time to seek it.
Key pain points
1
Inconvenient or too confusing navigation: users get lost among options and choices.
2
A sophisticated system for filtering and sorting search results.
3
The lack of functionality of the online radio station.
4
There are several good services, but people need one thing, and it should be the best one for them.
Age
19
Education
Secondary school
Location
Ekaterinburg, Russia
Family
Single
Occupation
Student
Typical User Persona: Veronika
«Music is my life!»
Veronika studies at the Theater Institute of Ekaterinburg and dreams of becoming a musicologist. Her hobbies are composing music and playing acoustic guitar. A young girl is collecting information for her upcoming thesis on the history of musical genres.
Goals
- To write a textbook on the history of music.
- To become a guitar virtuoso.
- To record an album with her music tracks.
Frustrations
- There's too much bad music on the radio.
- It's too difficult for young musicians to become famous.
Wireframes
I challenged the task to pay full attention to every detail of the user interface, especially the data filtering and sorting options. I also spent a lot of time analyzing and working out the main points of user interaction with the interface: catalog (list of radio stations) and the radio station page (the most important one).
48
paper and digital wireframes in total
Prototypes
The prototyping stage is useful not only for the ability to trace the user's paths through the future interface. This is an effective tool for testing important functions even before drawing design mockups.
As a result of the tests, about 25% of the original functionality was revised and improved. New features have been added, and access to the main blocks of user content has been significantly simplified.
Usability study: findings
These are the key results of the usability study.
1
Searching by genre tags is relevant: many radio listeners focus on this parameter when searching.
2
Navigation through countries is effective together with photos of places: recognition is higher due to the visual image.
3
Users find the map very convenient and intuitive when searching for radio stations.
4
Features aimed at creating user preferences (ratings, playlists, etc.) increase the time spent on the radio station's page.
Mockups
The design shouldn't distract the user from the main thing. In online services of this type, the convenience of the interface and the elaboration of the logic of user behavior are always the key achievement.
The main page (selected fragment).
The radio station's page.
Radio stations by city (selected fragment).
The radio station is on the map.
The playlist of the radio station on the selected day.
Active states. Mobile and tablet versions.
Conclusions
Having a background on the topic of the project you're immersed in, the UX/UI designer is always one step ahead of others and sees a little bit more than the rest. Three years of deejaying in the nightclubs and experience in composing electronic tracks give me such an advantage and I'm extremely happy that I managed to make one more product really convenient and designed for people.
a Quote from user feedback
I don't need any other browser bookmarks anymore! All in one.
