Maveco
Maveco

 

Work.

Work RSS rss feed icon

Subscribe to the Maveco Work RSS feed.

 

Post

Case Study – Clippet

Clippet
 
This is a case study for the native app Clippet, for iPhone and Android.
 
Client: FiveFootSix
My role: Creative Lead/App Consultant
 

Introduction

In January 2014 I was approached by the lovely people at FiveFootSix to help design an app for a new startup called Clippet, which they had completed the superb branding for.
 
Clippet offers “concise, digestible audio summaries of the day’s best news stories” in the form of quick-fire clips on mobile devices, lasting approximately a minute.
 

Clippet
 

 

Design

Taking the initial branding I started with a grid and the concept of a split screen to appropriate information/navigation/controls.
 
clippetEnlarge
 

Iconography

Custom drawn iconography, to perfectly complement the main brand mark and principal typography
 
clippet-icons-final-iphone
 

Colour Theory

Colours were the main brand hero colour and 4 colours to represent the 4 categories of information, Affairs, Culture, Global and Innovation
 
Clippet brand colour chart
 

Typography

Typography was DIN Light, a mixture of upper and lower case, with upper case used exclusively for Clippet titles, for gravitas.
 
clippet-typography
 

Navigation

Principle navigation was a standard top left hamburger menu, with a top down drawer inspired by the first version of Vine for iPhone.
 clippet-menu
 

Categories

Categories were displayed as colour bars
 
clippet-categories
 

Clips

Clips were split screen, inspired by podcast apps, with the 1 minute clip duration represented by a circular time marker, inspired by a stopwatch countdown.
 
clippet-clip
 

Playlists

Playlists could be created and stored for offline listening
 
clippet-playlist
 
After the successful launch of the iPhone app, the next step was creating a version for Android. Finally I added some onboarding.
 
clippet-onboarding
 

View the Invision prototype here:


Related External Links

Clippet News app launch film by FiveFootSix and Studio Yes (Vimeo)

InVision Prototype


Work - Similar Posts