Garnier Nutrisse
︎
2013
︎
2013
My role
Art Direction
Pitching
UI/UX Design & Research
Graphic Design
Digital animation
Art Direction
Pitching
UI/UX Design & Research
Graphic Design
Digital animation
Softwares
Illustrator
Photoshop
Flash ︎
Illustrator
Photoshop
Flash ︎
Context
While working at Haygarth, one of my main clients was L’Oreal, particularly their sub-brand Garnier.
The project I am showing you here is one of the many projects I worked on for them. For this project, I was tasked to produce a microsite for Nutrisse - a home hair colour product.
While working at Haygarth, one of my main clients was L’Oreal, particularly their sub-brand Garnier.
The project I am showing you here is one of the many projects I worked on for them. For this project, I was tasked to produce a microsite for Nutrisse - a home hair colour product.
Role specifications
Pitching and responding successfully to a brief by L’Oreal Garnier. It consisted in creating a Shade Selector microsite to be implemented in the Garnier website. The goal was to help visitors find a colour shade, by following a series of interactive steps and questions. Alongside this, we also created a campaign to find embassadors for each of the Nutrisse shades. They were featured in the microsite and across social media platforms.
My role also involved leading a team of developers and designers working on this project and campaign. Please scroll down for images ︎︎︎
Pitching and responding successfully to a brief by L’Oreal Garnier. It consisted in creating a Shade Selector microsite to be implemented in the Garnier website. The goal was to help visitors find a colour shade, by following a series of interactive steps and questions. Alongside this, we also created a campaign to find embassadors for each of the Nutrisse shades. They were featured in the microsite and across social media platforms.
My role also involved leading a team of developers and designers working on this project and campaign. Please scroll down for images ︎︎︎
![](https://freight.cargo.site/t/original/i/3d2f96bd9795030e25981f9317b593b3f7aa40616e6405e05bed9f80ff490ed6/site_1.jpg)
The microsite had four sections: ‘Home’, ‘About Nutrisse’, ‘Choose a Colour’ and ‘Colour Advice’.
Find some of these pages below ︎︎︎
Find some of these pages below ︎︎︎
![](https://freight.cargo.site/t/original/i/672fd5d5c0c8bddae4b1698624f602faf324674f17fa1e073257f0004f52dea3/room.jpg)
![](https://freight.cargo.site/t/original/i/f92a70ac3fde78280f027110504bb93aaeaa36b59cd572f82109d6e11ad6bc02/laptop2.png)
![](https://freight.cargo.site/t/original/i/2c63cd3a7b1c73c4b3659de1f9ee16f367b855ebfb561d7a21a87dd4c877e601/Nutrisse_big_scroll_3.png)
![CHOOSE A COLOUR SECTION - First of six steps on the 'Choose a Colour' section](https://freight.cargo.site/t/original/i/6e2a3241e4d6b1d2aa9a991065a4c87f062e22abdd690add0ef70e0771900236/1-nutrisse_laptop_bed.jpg)
![CHOOSE A COLOUR SECTION - Last step on the 'Choose a Colour' section](https://freight.cargo.site/t/original/i/13bf007e1585700f5401c46b668c83e9642e8d5431168643cc8f096c6e996d7c/2-nutrisse_laptop_bed.jpg)
![CHOOSE A COLOUR SECTION - End screen on the 'Choose a Colour' section](https://freight.cargo.site/t/original/i/756a77f235ca584708618e573ae0cd65d0cf094d999c1e7307289ab6f96abd9c/3-nutrisse_laptop_bed.jpg)
![ABOUT NUTRISSE - First page of the 'About' section. Users are invited to see the different colour ranges by clicking on the respective ambassador.](https://freight.cargo.site/t/original/i/0d80b2e9b67302e7ab9ba0c434ba2dc5a7b92665ddae9963a8831458031fa497/4-nutrisse_laptop_bed.jpg)
![ABOUT NUTRISSE - The 'Blonde' shade is selected, updating the area at the bottom of the screen, which now shows all respective shades.](https://freight.cargo.site/t/original/i/ce97ff2d9c0ab096ba0cf30cd36dcbd10d3dd64e193f9d78eef2927d838bea5f/5-nutrisse_laptop_bed.jpg)
![ABOUT NUTRISSE - Users can click on a square/shade to see more details and to buy.](https://freight.cargo.site/t/original/i/9c349d798b0e7544ec5135a8c08ff6daeb9c79cdd7d4a0aef2fadfe047c23eba/6-nutrisse_laptop_bed.jpg)
![COLOUR ADVICE - Users are invited to select from two options in order to get an answer: option '1. Select your product' and option '2. Do you want to:'](https://freight.cargo.site/t/original/i/54f9226d8eac155a31b94d1442f32e2d0ef7c2d63f4a4370c674b47f2ee3431d/7-nutrisse_laptop_bed.jpg)
![COLOUR ADVICE - Here, a user has selected 'Nutrisse Creme' from option 1. and 'Colour your whole hair?' from section 2.](https://freight.cargo.site/t/original/i/f06ffc7f0b8f6c68bec1f8e234c3ec61c9c321a68164481569d838a9e6c12d96/8-nutrisse_laptop_bed.jpg)