App Screen Showcase Mockup Psd.jpg

Dio - A radio-like music experience


Controlled Radio Experience



My Role

UI / UX Engineer


iOS UI Design
User-Centered Design


Adobe Photoshop

Project Time

Sept - Oct 2017 




Part 1.

Problem Definition

Problem Definition


Design Initiative

We have so many musical apps today. We download our favorite albums from online stores. We create our own musical playlist. 

Our playlist becomes longer, our artist library becomes bigger. However, all in all, it is the user who is building their own library, and what they can play is what they already have. 

The problem arises here: "I'm getting bored of my old songs, I want new ones". 

In reality, we already have a brilliant solution -- "Radio Stations", where there are professional editors who do the job of creating a new playlist and make sure songs seldom get repeated. 

We want to mimic that process of a radio station, however in a more intelligent way and empower user more power control.


I want new songs




Solution: User Controlled Radio Experience

We want to keep the experience of listening to the radio station, where songs are prompted up instead of selected from user library. 

However, unlike traditional radio station, the user does not always have to finish a song he/she doesn't like. They have the power to choose to skip a song. 

More importantly, the songs aren't prompted in a random way. New songs are selected based on user's taste of music. 

In other words, we always try to prompt new songs, but still, keep genre allied with the taste that user is familiar with.





Part 2.

Problem Definition

User Studies

User Studies





Requirement Analysis

  • Auto-Recommendation System

  • Intelligent Recommendation

  • Song Playing Control

  • Collection System


Part 3.

Problem Definition

User Studies

Design Process

Design Process


Browse & Explore

Just like ordinary music apps, the online music library is sorted by Album / Artist / Genre, each one of them is a Playlist, where each individual songs are stored inside. The user can get a familiar music browsing experience just like every other app. 

The prominent difference is the Channel category, where the only artist would be included in the list but not specific songs. It can be played, however, the user would not know what song would be prompted next. This allows the user to explore new songs in a more freeway.



Shuffle Like Radio

The core feature of the app is built around the Radio feature. Where users are always prompted with new songs, and they can choose to Trash, Like or Skip a song. 

The "Trash" option make sure the song would never appear in the future recommendation. The "Like" options would add the song into user's collection, and  future recommendation. The "Skip" option simply skips the song prompted. 

A full journey map is shown below.


Part 4.

Problem Definition

User Studies

Design Process

Final Product

Final Product

Dio aims to deliver the ultimate music experience with Radio stays at its core service. That is being said, the whole user experience is to facilitate a better radio experience.


Feature 1: Player

The essential difference can be found at the player interface. Unlike the traditional player, the main control buttons of Radio interface are "Trash", "Like" and "Skip". 

The three buttons are essential for the user to build their own music library and allows the system to make a recommendation based on user's taste of music.





Feature 2: Song Collection

User liked songs would be saved in the collection, where songs are categorized by artists and genres. 

The collection can work both like a "playlist" and a "channel". The Play All button allows the user to play songs that exist only within user saved libraries. The Listen Similar allows the user to start their customized radio experience, where songs are prompted based on user's previous listening history and liked ones.




Feature 3: Playlist & Channel

Playlist gives a traditional music experience to the user, where the list of songs is presented to the user. 

Channel aims to deliver a Radio experience. The user would be able to view the genre/artist under the channel, but the song pool is generated by the recommendation system and is not visible to the user. 

To mimic the Radio experience, the radio channel song pool has "infinite" number of songs, the selection of songs are based on the channel's characteristics, which are either artist type or genre.




Feature 4: Explore & Trend

The "explore" and "trend" section provide the user with options to explore new genres of music.