Givenchy
Design Systeme
Le site givenchybeauty.fr rassemble plusieurs centaines de pages produits, actualités et univers de marque (parfums, maquillage, soins), construites par des équipes différentes. Sans langage de composants commun, chaque nouvelle page repartait de zéro : incohérences visuelles d’une page à l’autre, production plus lente, remontée des équipes dev sur les incohérences, et risque d’écart avec l’image de marque. C’est ce problème que le système de design devait résoudre.
Le projet
Au sein d’Accenture, nous avons conçu le système de design du site givenchybeauty.fr. Nous avons structuré chaque page en composants réutilisables selon la méthode Atomic Design (atomes, molécules, organismes), documentés dans une bibliothèque de composants et un guide de style partagés entre les équipes de conception et de développement.
Mon rôle
Définition des principes de conception
Création d’une bibliothèque d’élément réutilisables
Conception de modèles de mise en page
Outils utilisés
Impact & résultats
Bibliothèque de composants
32 composants réutilisables couvrant 4 types de pages (home page, liste produits, fiche produit, panier chekout).
Temps de production
La réutilisation des composants a permis de concevoir de nouvelles pages sans repartir de zéro à chaque fois et une réduction du temps de mise en page de 60 %.
Adoption
Le système a été utilisé pour environ 300 pages (liste produits et fiche produit inclu)
