Camila De Vincenzo

 

Living-Room.jpeg
 
 

Amazon Music TV Apps

Amazon Music's focus on TV platform expansion in 2018 opened the opportunity for app design updates. I worked as the 'Big Screen' UX lead, creating a new design system that was catered to accessibility and scalability but also opened up more opportunity for us to take advantage of screen real estate.

TLDR;

2018 - 2019 • Baselining • Metadata Mapping • Animations • Feedback Cycle

 
music-tv-banner.jpg
 
 

BASELINING

The previous design had metadata and several features and that we were missing in comparison to Amazon Music’s other platforms and competitors. The “Amazon Ember Thin” font face was not testing well in accessibility. Most importantly, there was a lot of opportunity to create a more visually engaging app.

01

 
 

METADATA MAPPING

The TV applications historically did not surface out as much metadata or actions as Amazon Music’s other platforms and even our competitor’s. Metadata like album name, song name, artist name, date released, etc. In the new design system, I built in more slots for such information. Additionally, I added actions in pages such as a top level play, shuffle, add song to library. These UI elements had not existed for TV.

02

 
Bauahaus_TV_1-final-min.gif
 
 

VISUAL & ANIMATION explorations

We really got take advantage of our high res imagery with this update. I added blurred backgrounds in the browse experience, which worked quite well with our new wave of playlist artwork updates, seen above. Our artist detail pages now sport beautiful hero imagery on the entire screen. Some additional small tweaks were pushed through; Rounded corners, drop shadows, new icon styling, new focus state, popularity bars in detail pages.

03

 
 
 
 

FEEDBACK CYCLE

At Amazon Music we have intensive feedback cycles on major design updates such as this. The first feedback cycle was presenting designs to design team. Secondly I ran quick and dirty ‘guerilla’ testing using a prototype that used different focus state animations, navigation types, and other micro interactions. Third feedback cycle was Alpha and Beta builds, both with QA testing.

05


<

>