Virgin Radio Italy
Reinventing the "style rock" radio app par excellence, thanks to a new user experience. Designed for any device with a Rock'n Roll interface.
The restyle project of the Virgin Radio app continues the experience of the Radio 105 mobile project. Both apps, together with Radio 101 and Radio Monte Carlo, belong to the Mediaset Radio group, which entrusted Rawfish with the restyle, the development and maintenance.
The design system created for Radio 105 laid the foundations for an approach that was transversal to all apps. Focus on navigation, patterns and components shared against a customized UI with regards to the brand image of each reality.
Virgin Radio requested greater attention to the tone of voice and the use of the color palette to restore the right “coolness”. We wanted, at a glance, upon opening the app, to immediately reflect the spirit of radio and rock imagery. We have collected many ideas as listeners of good music. Brainstorming (what do you think if I say “style rock”?), Research of style and images have led us to synthesize the first 3 ideas for the structure of the home. Have you ever entered a record shop?
Contribution
UI/UX design
IOS native development
Android native development
Project management
Team Rawfish
Length
4 months
Published
July 2019
Cover flow
Browse the covers of the last 5 songs broadcast. We recreated the cover flow from scratch. We wanted to evoke the search for missing vinyl in the favorite record store.
Space for Music
The mood immediately shared was: space for music, for covers. The chromatic variety of each would have made the home always different.
ON AIR
The iconic luminous sign. Placing it in the home seemed the right choice to return an analog flavor with a strong connotation to the digital version of Virgin Radio.
Menu
Everything at your fingertips. Program, song on air, all the main and secondary actions are easily accessible to stress the hand.
What song is this? Get to know new music with a tap!
Leafing through the covers of the songs just broadcast, with a tap you access the song title and the name of the band / performer.
You can also share the song's web url, receive a notification on the next step and listen to a 30-second sample.
“Music and News now share the home. The user, with a single swipe, can switch from the ON AIR view to the selection of ROCK TRENDS news.”
Alberto
Art Director UI UX Designer
News: how to enhance the dynamic content of infotainment
The Virgin Radio platform presents news in two macro categories: "Rock Trends" and Rock News.
"Rock Trends" are the headlines, selected by the editorial staff.
To give an infotainment cut to the new app, we have highlighted this category by allowing the user to reach it from the home with a single swipe. The home is thus composed of a double view: Direct “ON AIR” (with all the quick information on the program, piece on the air, last pieces broadcast, etc.) and the news in evidence. The user can thus listen to Virgin Radio while comfortably reading the latest news from the world of music.
To create a connection between the two macro categories, all the News categorized in "Rock News", "Virgin Radio Life" and "Virgin Radio Recommend" can be reached from the "All News" button in the "Rock Trends" section or from the item of menu "News". The app dynamically reads the categories from the backend of the Virgin Radio site, allowing the editorial staff to make changes without requiring intervention on the app.
On demand content
On-demand content such as Podcasts and Replicas are available for each program of the schedule.
Accessible both from the program card and from the main menu, they now allow the user to search for the exact point from which to resume listening using the dedicated cursor.
A dedicated component has been designed for browsing content on demand.
The "ON AIR" button allows you to return to listen to the live broadcast at any time.
Virgin Radio TV
The new app also hosts the Virgin Radio TV streaming channel.
Both from the home and from the menu item, the user accesses the custom fullscreen native player.
Bottom navigation
The decision to bring navigation down, unites all the apps developed by Rawfish for the Radio Mediaset Group.
The average size of the monitors that now settles on 6 inches or more, has determined this choice: allow the user to be able to use the app and navigate it with the thumb of one hand.
We have leveraged the app into its potential daily use, with users that are often on the move, for pleasure, even on city public transport.
Design system: construction of a complete and scalable atomic set
Virgin Radio's design system lives on similar basic components among the group's apps. They are differentiated according to the mood of the app and its brand image or to meet particular needs.
The dominant colors are black and red. In some cases, graphic patterns have been used, already used in the visuals of web and social communication.
“The app sends you a notification on time to listen to your favorite show or song.”
Ciprian
Senior iOS Developer
Carplay and Android auto. New touchpoints in the Mediaset Radio ecosystem.
This second release includes, among the main new features, compatibility with Carplay (for Apple systems) and Android auto (for Android systems).
The user can follow both live and on-demand content.
Compatibility has been extended to all four radios of the group developed by Rawfish.
