T. LeClerc est une marque française de cosmétiques créée par le pharmacien Théophile LeClerc qui élabora en 1881 une poudre de riz pour embellir le teint. La Maison Théophile LeClerc propose aujourd’hui une gamme complète de maquillage, de soins et d’accessoires beauté vendue en pharmacies, parapharmacies et à l’international.
En 2020, la société LJV Capital a racheté T. LeClerc et Innoxa. Souhaitant « redonner de l’éclat » à ces deux marques, elle a décidé de refondre leurs sites web. L’objectif était de dynamiser leur image et de développer les ventes sur le canal digital. L’agence Magnetism, chargée de ce projet, a confié le développement des sites T. LeClerc et Innoxa à l’agence Calliweb.
Nous allons présenter ici les missions effectuées par Calliweb pour T. LeClerc : la refonte des principales pages du site, l’interfaçage avec l’outil digital du logisticien et le développement de nouvelles fonctionnalités.
Refonte graphique et fonctionnelle du site t-leclerc.com
La refonte du site e-commerce de T. LeClerc a été effectuée en responsive design sur les versions desktop et mobile. A noter que cette plateforme de vente est multilingue, consultable en 3 langues (français, anglais, hollandais).
Refonte des pages principales
Dans un premier temps, Calliweb a intégré la refonte graphique des principales pages du site : home page, pages produits, collections ou marque.
Pour la construction de ces pages, nous avons développé de nouveaux blocs de contenu personnalisables. Un bloc a ainsi été créé pour afficher la sélection des best sellers de la marque et un autre présente les étapes à suivre dans la correction du teint. Concernant la home page, un nouveau carrousel entièrement paramétrable dans le back office du site a été conçu. Le système de “produits configurables” a été adopté pour la gestion des produits et de nouveaux attributs ont été créés. En effet, les produits de maquillage, tels que les rouges à lèvres, sont proposés dans de nombreuses teintes et il était important d’utiliser le meilleur moyen de gérer les variantes de couleur.
Création d’une plateforme d’échange (via FTP) avec le logisticien
Un projet e-commerce s’inscrit toujours dans un écosystème technologique singulier et propre à chaque client. Les logiciels, outils métiers et autres solutions digitales déjà en place doivent être interconnectés avec le site e-commerce. Les workflow d’échange et la mise à jour de la data sont ainsi automatisés.
Une des premières étapes de la refonte du site de T. LeClerc a donc consisté à créer une plateforme d’échange de flux entre le CMS Magento 2 et l’outil utilisé par leur logisticien. Cet interfaçage constituait un gros enjeu pour la gestion des flux logistiques, le suivi des commandes et la mise à jour de l’état des stocks de produits.
Store locator en full page
Les produits de la marque T. LeClerc sont vendus dans de nombreuses pharmacies et en parapharmacies. Le store locator qui permet de localiser ces points de vente est donc une fonctionnalité importante du site. Calliweb a fait évoluer cet élément clé afin de le rendre plus efficace. Il a été intégré en responsive design pour occuper toute la largeur de la page.
Il est accessible dans le header et depuis les fiches produits pour pouvoir être consulté à tout moment. L’utilisateur choisit entre ajouter le produit à son panier ou trouver un point de vente qui le commercialise. Il peut ensuite utiliser la géolocalisation ou saisir la ville de son choix pour identifier les officines proches de sa position géographique. Les pharmacies et parapharmacies concernées s’affichent sous forme de liste, avec leurs coordonnées, et leur position est indiquée sur une carte interactive.
De nouveaux modules pour enrichir l’expérience utilisateur
Module dynamique d’aide au choix : la roue à teint
Il n’est pas toujours aisé de choisir soi-même ses produits de maquillage. En point de vente, les conseillères peuvent aider les clientes à trouver les produits qui répondent à leurs attentes. Afin de reproduire en ligne cette fonction d’aide au choix et d’enrichir l’expérience digitale, nous avons développé la « roue à teint T. LeClerc ». Il s’agit d’un outil simple et ludique qui permet de déterminer les produits les plus adaptés à la carnation et au besoin des clientes. En répondant à trois questions successives, elles se voient proposer les poudres qui leur correspondent ainsi que des produits de maquillage complémentaires.
L’espace presse
Les retombées dans les médias pour les marques du secteur de la beauté sont très importantes. Ainsi, Calliweb a développé un nouveau module qui permet de mettre en avant les parutions et les dossiers de presse sur les produits T. LeClerc. C’est également une porte d’entrée pour les journalistes qui souhaitent entrer en contact avec des représentants de la marque. Cette cible privilégiée a donc désormais son espace attitré sur le site.
La collaboration active entre l’agence Calliweb (développement et intégration) et l’agence Magnetism (UX/UI design) a donné lieu à un site dont l’univers graphique et la fluidité du parcours d’achat sont représentatifs de la qualité et de l’image de la marque T. LeClerc. Les équipes de deux agences collaborent désormais autour de la déclinaison du site pour la marque Innoxa qui propose des produits cosmétiques adaptés aux peaux sensibles.
