◼︎ 03 | Eve

UI | DESIGN SYSTEM ◼︎

OVERVIEW

Eve is a twilight themed music application designed with the intent of providing an easy to navigate and relaxed user experience.

TIMELINE

1 Month

INDIVIDUAL PROJECT

TOOLS

Figma
Adobe Photoshop

PROJECT TYPE

User Interface Design
User Experience Design
↓ navigate here

At a glance

Eve is a fresh take on what an easy to navigate music application could look like. It's user interface was designed with the intent of providing a relaxed user experience focused on easy discovery of live events and video/album art.

Key Flows

1. EXPLORE MUSIC

The explore navigation page is designed to ease music exploration and consists of :

Featured songs

This provides a visually appealing entry point and allows for immediate engagement with trending or important music.

Curated playlists

These offer pre-selected, themed collections that simplify decision-making for users.

Curated song list

This offers a more granular exploration option, allowing users to discover individual tracks that might interest them

Trending artist list

This feature helps users discover new artists related to their interests

Trending music

This keeps the content fresh and relevant, giving users a sense of what's current in the music world without requiring them to search extensively.

The explore navigation has a segmented control that allows the user to explore by playlists, artists, albums, genres, and instruments.

2. BROWSE LIBRARY

The library navigation page features a well-organized layout that simplifies the search for saved music :

Recently played

This feature reduces cognitive load by providing quick access to content the user had engaged with recently.

Saved playlists

Saved playlists, users can quickly access their curated collections.

Liked artists

This category allows users to browse their music by liked artists, which is a natural way many users think about music.

Liked albums

Albums often represent a specific theme in an artist's work and the liked albums feature allows users to access music in the way the artist intended.

Liked genres + instruments

Categorizing music by genre aligns with how many people naturally think about and explore music.

3. HOME

The home page features an intuitive interface for browsing upcoming live music concerts, allowing users to easily discovery and engagement :

Live Event Feed

Featured live event feed with clickable concert cards and a quick booking button.

Event Details

Each event card leads to a dedicated section containing show dates and venues, information about the artist, and a call to action button to book tickets.

Key Screens

LIVE EVENTS

MY LIBRARY

EXPLORE

MUSIC PLAYER

Background

I thoroughly studied the UI of Spotify and the most common user complaints tech reviews pointed toward.

"..Spotify’s app is getting cluttered and overleveraged"

"The menu was full of recommendations and recent plays — I couldn’t find “Albums” anywhere in the list. There wasn’t even a clear way to navigate to it."

Source : The Verge, Sep 30, 2022.

"Spotify’s new design is part TikTok, part Instagram, and part YouTube"

"Spotify has for years tried to find ways to put podcasts and music and everything else side by side but seems to be recognizing that the best answer is to give each thing more space to breathe."

Source : The Verge, Mar 8, 2023.

"The auto-playing, social-network wannabe Home feed is a mess."

"The TikTok and Instagram-inspired feed of auto-playing music and recommendations looked immediately tiresome.."

Source : Trusted Reviews, March 28, 2023

Apart from this, the Spotify community page is filled with users complaining about the annoying live events feed urging Spotify to add a turn off feature.

Keeping aside the business goals of the platform, there was so much to learn and unfold about structuring of content.

The problem is that..

Modern music streaming platforms have evolved beyond their core functionality resulting in cluttered, overwhelming interfaces that detract from the primary purpose of music discovery and enjoyment.

THE CHALLENGE

Music meta data

Retaining the underlying structure of music meta data.

Visual load

Reducing and organizing content per page, making sure audiobooks, music, and podcasts are separated.

Low learning curve

Aim for a low learning curve - a completely new interface may frustrate existing users, potentially leading to app abandonment.

Opportunity

1. Organizing Content  

Better organize music content while retaining live events, podcasts and audiobooks in the same application.

2. Relaxed User Interface

A sleek interface with no auto-playing videos and a soothing color scheme.

3. Easy Discovery

An interface that promotes live events and music and album art discovery.

Turning Opportunities into Solution Elements

1. ORGANIZING CONTENT

A. Competitor Teardown

Conducted an analysis of Spotify's content structure and user flows to establish an understanding of content organization and user navigation.

B. Structuring Content

Established main navigation items - Explore, Home and My Library.

Simplified content discovery by separating podcasts, music and audiobooks under each navigation item

C. Information Architecture

Created Information Architecture to organize features and establish heirarchy

2. RELAXED USER INTERFACE

Visual Design

Took inspiration from the colors of twilight to creating a soothing theme.

3. EASY DISCOVERY

Explored ways to design a clean music player that would feature full length music videos and album art with the option to view live lyrics and go full screen to encourage discovery and appreciation.

Featured live events discovery and streamlined booking process in a clutter-free user journey

Design System

Reflections

RESEARCH

1. Conducting usability testing with high-fidelity prototypes prior to finalizing the user interface would have been ideal.

2. Conducting qualitative research with avid music app users to uncover deeper insights about frustrations with current applications would have helped me add more innovative features.

USER INTERFACE

1. Given more time, I would have liked to create a simpler user interface and reworked the key components for a minimalistic look.

2. I wanted to explore unconventional interface designs that retained the structure of music metadata while streamlining user flows.