Pierre Fabre - One Design system to rule them all

Notre rôle a été d’imaginer et de concevoir les parcours omnicanaux de l’ensemble des marques du groupe tout en intégrant une logique de rationalisation afin d’optimiser les coûts, le time to market et de pouvoir mettre en oeuvre le Core Model des marques pilotes

Les objectifs :

• Développer la présence online des marques du groupe
• Renforcer le territoire de marque, l’engagement et la conversion
• Développer la connaissance client

Nous avons construit un Design System qui permet de déployer une expérience client cohérente et performante sur l’ensemble des points de contact digitaux des différentes marques du groupe.
En intégrant le Design System au sein d’une site factory, nous avons rendu utilisables l’ensemble des assets de marque du groupe immédiatement et facilement.

La construction:
Pour construire le premier socle du Design System, nous avons travaillé avec deux marques pilotes emblématiques: Eau Thermale Avène et René Furterer.
Nous avons imaginé une logique basée sur un Design System Master (que nous avons appelé Core Model) qui serait ensuite décliné pour chacune des marques.
Nous avons fixé un ratio de 80% d’éléments génériques communs à toutes les marques versus 20% d’éléments spécifiques à chaque marque incluant notamment l’identité graphique et certains besoins fonctionnels spécifiques.

Notre Core Model consiste donc en une bibliothèque de composants et de templates associée à des guidelines d’utilisation et intégrée au sein d’une plateforme dédiée aux Design Systems : Frontify.
Nous avons utilisé les principes de l'Atomic Design pour structurer les différents éléments du Core Model.

Les étapes clés de construction du Core Model:

• Définition de la stratégie d’expérience et des grands principes qui guident notre travail de conception.
• 5 sprints design pour concevoir l’ensemble des templates nécessaires pour adresser chacun des parcours utilisateurs en s’appuyant sur les deux marques pilotes.
• Chaque bloc ou composant est identifié puis rationalisé dans une démarche Core Model.
• Les templates et blocs sont ensuite déclinés en maquette graphique Mobile et Desktop pour chacune des marques.

L’ensemble des éléments du Core Model ont été conçus en Responsive Design et intègrent une couche d’optimisation pour le SEO ainsi que des capacités de customisation permettant d’intégrer facilement les différentes identités de marques.

L'outils utilisé:
Nous avons choisi de nous appuyer sur la solution Frontify car elle répondait parfaitement aux besoins.