Visual Identity Design for a Face Tracking AR Experience

Introduction

The challenge was to create a browser based AR experience where users can try different makeup categories virtually using Augmented Reality, and can check which ever makeup products has been used to produce that particular effect & also can get an exciting offer if user fill out a survey form.

About Brand

Before diving into design, I looked up their online presence and collected few points about the brand personality & audience.

Starting with Visual Design

Before moving forward I want to clarify one thing, about primary color used in this experience, within the first round of reviews stakeholders asked me to change Ultramarine Blue to Antique Ruby, because that's the color majorly resonated with colorbar cosmetic.

I picked blue because of it's Vibrance.

To capture the essence of the brand as bold, fashion-forward & playful I decided to give it a magazine look, not exactly like magazine but cut outs from magazine.

and I decided to go ahead with these below elements.

I stick to two fonts for this experience, both are serif fonts, one is Kalnia and another one is Vogue.

Below is the color palette:

1. Red being primary, because Colorbar cosmetics uses red color define itself (now they have changed it now gold/muddy orange).

2. Green being red's complementary color and yellow is it's adjust color, so I kept both of them as ascent color.

3. B/W as neutrals.

Designing Interface Design

Before moving forward with high fidelity designs in figma, I sketch out basic pathway for the experience, what things should I be adding, how will the user navigate through the experience, a basic user journey.

Then ideas were turned into this