CovetiOS App

The Challenge

After the recent success of visual to-do list app NINE, a trend in user behaviour was discovered and the way certain features were been used, in particular visual shopping lists. Because of this, it was decided there was potential for a fully featured app focusing on visual social shopping and so Covet was born.

Covet is a simple concept where a user can go out, photograph products they wish to purchase or already own and share them with the world to motivate and inspire. They can create and collaborate on lists, share them with friends and family, discover unique, interesting and unusual things that would never of even been envisioned.

Covet Cover Image
The Solution

I was fortunate enough to have a vast amount of valuable user research from NINE and majority of it applied to Covet and what we wanted to build. Looking further into the research, I began to draft out possible features, visual concepts and flows. The process moved fast, and as soon as ideas were fully drafted, it was then I moved onto producing a series of low fidelity wireframes and user flows ready to prototype internally.

User testing confirmed my flows, features and functionality worked correctly as imagined and this enabled me to move onto a design system for Covet, which had no visual design. So I was starting via a blank canvas.

Covet Wireframe 01
Connector
Covet Wireframe 02
Connector
Covet Wireframe 03
Covet Wireframe 04
Connector
Covet Wireframe 05
Connector
Covet Wireframe 06
Covet Wireframe 07
Connector
Covet Wireframe 08
Connector
Covet Wireframe 09
Design systems

The first stage of my design process is to create and build a flexible grid system which will be the foundation of my component library. Once the grid system was tested and finalised, I then experimented with typography, colour palettes and iconography styles which all formalise the final components.

It was agreed that Covet should be a clean, minimal and elegant app, with emphasis on ease of use and speed in capturing products. The user was our priority, but also the content would be centre stage and seize the users attention.

I selected the Montserrat typeface, as it has the clean, sharp and legible qualities that Covet desired. I also opted for a neutral palette, and thought that if content is king within the app, then colour should not be an obstacle and so I selected a crimson red for subtle interaction throughout.

Grid System
10 columns | 32px width | 5px Gutter, Margin | 8px Baseline
Covet Columns
Covet Baseline
Colour
All colours used for the project
Covet Primary Colours
Typography
All typefaces used for the project
Covet Typography 01
Covet Typography 02
Covet Typography 03
Covet Typography 04
Iconography
24px grid system, 2px outline
Covet Iconography 01
Covet Iconography 02
Covet Iconography 03
UI Components
Atomic design system
Covet UI Components
Covet Device 01
Final UI

The final app is a homage to Minimalism, fresh, original design. The content within Covet is the vital aspect, and so I chose to keep the UI minimal to avoid distraction or unnecessary force. I wanted Covet to be easy on the eyes, and I carefully considered and crafted every element to be as simple as possible.

The contrast between the clean white UI and subtle red actionable states works incredibly well, and motivates and influences a user in their direction throughout the app.

I wanted the app to not only be simple visually but also in the way people interact with the platform, and so every aspect and feature was precisely designed. With this intent from the way a user captures a product, to the way a user shares this product to the world, it was vital that users were able to inspire and promote content as quickly as possible within a shopping environment.

Covet Device 02
Covet Final Screen 01
Covet Final Screen 02
Covet Final Screen 03
Covet Final Screen 04
Covet Final Screen 05
Covet Final Screen 06
Covet Final Screen 07
Covet Final Screen 08
Covet Final Screen 09
Covet Final Screen 10
Covet Final Screen 11
Covet Final Screen 12
Covet Final Screen 13
Covet Final Screen 14
Covet Final Screen 15