IDAGIO App
UX & UI app design for a streaming platform specialising in classical music
Background
IDAGIO offer video and audio streaming to music lovers in over 190 countries worldwide. Their acclaimed audio streaming service is unique and features optimised metadata, curation of playlists and content by music-lovers for music-lovers compliment the app.
____
At the core of the product is the App and it’s search function tailored to classical music. It’s home to over 2 million licensed tracks, lossless audio, personalised recommendations, expert-curated playlists and exclusive recordings you wont find anywhere else.
The Approach
IDAGIO approached me to redesign and create several areas’s of the native app interface, this included;
- Improving the search function and filtering system
- Redesigning the login and signup UI and improving the UX
- Introducing a brand new concerts section where users can stream high quality online concerts, operas, ballets and documentaries
- The creation of a playback queue
- Employment of hot links giving users instant access to playback tracks, browse curated playlists and browse the extensive catalogue based on unique user preferences.
- Introduce a new dark mode theme.
Once this work was completed, I also redesigned their website that employed the same dark aesthetic to showcase the app with it’s sleek and more appealing interface.
Dark Mode
By the end of 2019 some 92 popular apps and services were offering Dark Mode and by early to mid 2020, dark mode had become very ubiquitous. With this in mind, I created a brand new dark mode colour palette and UI theme for their native app to lift their traditional light mode which used a light white background with darker text and UI elements, into a sleek, modern, and more visually appealing space. Additionally, dark mode can be easier on the eyes in low-light environments, making it a popular choice for night-time use.
Benefits & challenges
The main benefit of dark mode is that it throws focus on individual parts of a screen providing a visual respite from overstimulation.
From a design perspective, dark mode presented some interesting challenges and opportunities. On the one hand, it was more difficult to design for dark mode because as a designer it was vital that I considered not only colour contrast but also the use of shadows, highlights, and other visual cues to ensure that elements were clearly visible.
____
On the other hand, it also provided an opportunity to be more creative and experimental and challenge the ‘academic’,’older generation’ stereotype that is often associated with this music genre.
Designing the UI and UX for dark mode also had implications for accessibility. Whilst it was important to ensure that the designs were accessible to everyone, I also recognised that some people with visual impairments may find that dark mode makes it easier for them to read and interact with the content. This underscores the importance of designing with accessibility in mind and offering options for users with different needs.
Search function
A fundamental aspect of the product revolves around its customised search function designed for classical music. IDAGIO had an already robust algorithm, however in order to improve the UX I proposed tweaks to the query processing and ranking to improve the candidate retrieval with a stricter latency of result capture. With this in place, I went on to design a search UI which automatically updated after each character step, providing users with instant search result without the need to press search or finish typing an entire query.
Login & Sign Up
Pre-redesign IDAGIO also experienced an issue with there onboarding system, with a surge of bounce rates occurring at signup and validation issues on login for current users. The reason for this was because the forms were simply not designed properly and displayed poor client side validation. This left users feeling lost and frustrated or not knowing exactly what happened. To solve this, I designed a new intuitive and responsive sign up form based on a hybrid reward early, punish late approach. By improving the default behaviour and aligning this to a more streamlined UI, users were able to complete this process more seamlessly, causing an increase in user retention and successful subscription upgrades.
The end result
A dark mode version which provided a natural, sleek interface, allowing objects to exist in a borderless space rather than a glowing white rectangle, and an intentionally clean UX with a strong focus on ensuring the usability is intuitive and pain-free. Employing minimal extra colours and utilising just one key highlight colour meant that IDAGIO could easily toggle between light and dark modes whilst ensuring that that the content priority is kept. Through careful consideration of UI implementation and execution, the user-centric approach placed the user at the heart of the experience, creating a smooth and effortless interaction with the product and an increase in downloads, bringing the current total of app downloads to over 1.6 million.