Menu close X
let's talk.
Get in touch with me
connect.
Find me on LinkedIn
iTunes featured artist screen design

Giving iTunes an overdue tune-up

Personal Project: iTunes Desktop App Redesign

During some downtime, I decided to explore a redesign of the iTunes desktop application. While high-level, the redesign showcases a more visually appealing and vastly more intuitive interface that leverages familiar iTunes components.

My Role: UX & UI Designer
arrow pointing down
iTunes featured artist screen design
Redesigned iTunes music screen
Music landing screen
Fresh & Modern

A new look for a legacy product

Not a lot has changed since iTune’s inception in 2003. Nineteen years later, the application has been rebranded as Apple Music, but still has pervasive usability issues and is very much in need of an overhaul.  My goal with this project was to not only improve the utility of the application, but to elevate the design as well. The new design now makes better use of the space, creates more openness, and makes the application easier to use.

Redesigned iTunes TV screen
Redesigned iTunes movies screen
Redesigned iTunes podcast screen
Redesigned iTunes audiobooks screen
Movies, TV Shows, Podcasts, and Audiobooks landing screens

The process

A screenshot of the user goals
Step 1
Defining User Goals/Tasks

I established some user goals: the storing and playback of media (primary); browsing and discovering content (secondary)—any new enhancements would have to align with one of the two.

A screenshot of the heuristic evaluation document
Step 2
Usability Assessment

I conducted a quick usability assessment for some qualitative benchmarks. I found the screens to be complicated and restrictive; there were no new discoveries.

A wireframe of the iTunes music library screen
Step 3
Wireframes

I created wireframes that introduced new features and enhancements to address the vulnerabilities that surfaced from the usability assessment.

An image of the redesigned music library screen
Step 4
UI Design

Lastly, based on the wireframes, I applied visual design and created mockups of the new interface. I then used the mockups to create a prototype to visualize the UX.

Landing screen

A screen shot of the old iTunes music library screen
Existing Design

Upon opening iTunes, it’s unclear where to start—there are no onboarding instructions and the UI not very engaging

Redesigned iTunes movies screen
New Design

Now it’s clear what users can do here, there are obvious entry points to guide users and help them accomplish their goals/tasks.  For added visual appeal, homescreens now include vivid background images and feature recently played/updated media content.

Main navigation

A screenshot of the old iTunes navigation
Existing Design

Navigating the interface is taxing and switching between screens is particularly challenging due to the main navigation being hidden within a dropdown menu

Redesigned iTunes music screen
New Design

The main navigation has been pulled out of the drop down menu (which has been deleted) and placed prominently at the top, enabling users to effortlessly switch between screens.  The new main navigation, along with relevant supporting images in the background, make it easier to orient yourself, no matter where you are.

Media player

A screenshot of the old iTunes media player
Existing Design

The media player, although anchored at the top, manages to get lost, blending in with the application window, providing no contrast and could be easily overlooked

A screen shot of the new  iTunes media player
New Design

The media player has been moved to the bottom of the application window, in the direct line of sight of the user, and remains affixed to the window (visible at all times) as the user scrolls down.  Additionally, the color of the player is now dark, which provides a striking contrast against the content and the controls are now sleek and refined.

Left rail links

A screenshot of the old iTunes left rail
Existing Design

The left rail isn’t purposeful, it appears to be just a playlist catchall.

An image of the redesigned iTunes left rail
New Design

The left rail has been removed and the playlists have been given their own section in the library–they’re more prominent and easy to access

iTunes store

The old iTunes Store page
Existing Design

The excessive amount of content is overwhelming. Despite grouping, the categories feel like they have no reasoned structure or relevance.

Redesigned iTunes Store page
New Design

The layout is somewhat similar to how it is today, however, the content is grouped more effectively and there’s more negative space to reduce the clutter and facilitate frictionless browsing. The number of sections have been vastly reduced and the focus is on (3) main themes: what’s trending, what’s new and what’s recommended.

See the prototype
arrow pointing upward