Watch.gif

Shazam - Prototyping & Animation

Designing user experiences require more than just pretty pixels.

 

Shazam
Prototype and animation work

Role
Senior Product Designer

Years
2014 - 2017

Shazam is a globally used and well known app that recognises music, TV and media around you. Having a user base of 300+ million global active users the app is wide reaching and has recently been purchased by Apple.

This page details the prototyping and animation work that I did while at the company across a wide range of products and features from Snapchat integration to user testing prototypes.

 
The transition I created from a list of tracks > to the selected track.

The transition I created from a list of tracks > to the selected track.

 

Problem solving prototypes

Static designs can only do so much. Especially in the current climate of app development the boundaries of movement and transitions are being pushed with every new OS update, which makes being able to bring your designs to life more important than ever. 

In order to prioritise the user's experience over aesthetics prototyping is the perfect tool to see if your intended solution will work.
 

 
One of the prototypes that I created for the inclusion of Shazam within Snapchat. The final version is now live in the Snapchat app.  View the press release here

One of the prototypes that I created for the inclusion of Shazam within Snapchat. The final version is now live in the Snapchat app.
View the press release here

Rather than using a standard modal view I created this immersive view (Currently live in the Shazam app).

Rather than using a standard modal view I created this immersive view
(Currently live in the Shazam app).

A prototype idea to improve the repetitive track rails in the Shazam app.

A prototype idea to improve the repetitive track rails in the Shazam app.

A prototype created for an idea for a Playlists section in the Shazam app.

A prototype created for an idea for a Playlists section in the Shazam app.

 
A card interaction prototype (v1) used in the   Discover   project

A card interaction prototype (v1) used in the Discover project

A card interaction prototype (v2) used in the   Discover   project

A card interaction prototype (v2) used in the Discover project

An Apple TV prototype

An Apple TV prototype

 

Animations

They say the best things in life are free right? This also applies to animation in apps.

They are the little fun delights that can brighten a user's experience. The results can't be measured using beacons or any other statistic but that's what separates a good app from an amazing app. 

Below are some animations that I have produced using After Effects or Principle whilst working at Shazam.

 
 
Watch.gif