Directeur Artistique Digital, UX/UI designer senior à Paris depuis plus de 11 ans, j’accompagne les entreprises pour leur permettre d'atteindre leurs utilisateurs à travers des fonctionnalités simples et intuitives, une communication digitale efficace et des sites web et application mobiles claires.
visage.gif

Chanel : Les Coyères • Site web en responsive

(See the english version here)
Plusieurs fois par an, Chanel renouvelle sa collection de maquillages avec une nouvelle gamme de couleurs et de nouveaux produits. Pour la nouvelle saison, un make-up artist crée de nouveaux looks associant rouge à lèvres, eye-liners et vernis à ongles sur un support papier spécial appelé "Coyères". Ces "Coyères" servent de support pour monter toutes les étapes nécessaires à l'application du maquillage pour les consommat•rices•eurs lors d'événements ou de cours de maquillage. La mission était d’adapter cette expérience sur les supports digitaux via la plate-forme en ligne Chanel.com, de concevoir les éléments UX / UI et les tous visuels, nous avions aussi produit des maquettes haute fidélité avec des spécifications fonctionnelles animées que les développeurs d'AKQA utiliseraient pour développer le site.

Travaillé en tant que directeur artistique • UX/UI designer pour AKQA Paris
Livrables : Maquettes des pages UX/UI en responsive.

Mockup-02_coyere_desktop2.png

selection du look préféré

J'ai travaillé en étroite collaboration avec Daniel Baesler, un directeur de création talentueux. Notre point de départ était de savoir comment proposer les différents looks. Afin de les aider à choisir, nous avons utilisé les Coyères peints mais avions également mis en avant les gammes de couleurs associées à chacun d'eux. Chaque tuile (colorée) correspond à la couleur d’un produit de maquillage utilisé pour le look en question.

 

Étapes d’application du maquillage

La page du Coyère est composée de 3 principales fonctionnalités : le stepper (barre d’étapes), le produit associé et l'aperçu sur un Coyère

coyere.png

1 - Le stepper
Le stepper est divisé en différentes parties, principalement 4 : les yeux, les lèvres, la peau et les ongles. Une partie est subdivisée en plusieurs étapes, par exemple 5 pour les yeux.

2 - Produits et conseils associés
Pour chacune des étapes, un produit et des conseils associés sont affichés. S'il y a différentes teintes, suivez simplement les lettres A- B - C - D indiquées sur l'image du produit.

3 - Aperçu sur le Coyère
Les étapes détaillées de chacune des actions sont affichées sur le Coyère.

visage.gif
 

résultat Final

 

Les pages entières

04-_-Chanel_coyere_desktop_09.jpg
 
Mockup-02_coyere_phone.png
 

d’autres écrans