Molly Bracken

Migration et montée de version sous Prestashop Enterprise 8.2

Le projet

Projet réalisé sous Prestashop Enterprise 

En tant que première agence Prestashop en france depuis 2020, notre équipe possède une expertise approfondie des spécificités de ce CMS. Grâce à nos compétences variées en UX, UI, développement et gestion de projet, nous avons eu la chance de pouvoir tester en avant première Prestashop Enterprise. 

Cette version intègre nativement des environnements de production, de pré-production et de staging. Pour le projet Molly Bracken, cette architecture nous a permis de sécuriser chaque déploiement en testant les nouveautés en conditions réelles avant leur mise en ligne, garantissant ainsi une plateforme stable et performante, même lors des mises à jour majeures.

Phase 1 : Audit de l'existant et spécifications fonctionnelles

Diagnostic de l'écosystème PrestaShop 1.6

Afin de préparer la migration du site Europe de Molly Bracken vers la version 8.1 puis 8.2 de Prestashop, nous avons commencé par réaliser un diagnostic approfondi de l'existant du site actuel.

Grâce à un audit de performance, nous avons pu déterminer que les temps de chargement étaient généralement trop élevés, notamment le TTFB. Cela était en partie dû à la version actuelle de leur Prestashop (1.6) ainsi qu'à leur base de données, surchargées par un traitement des logs non purgés.

L'audit a également relevé une accumulation d'overrides (surcharges de codes) ainsi que des modules tiers, ralentissant fortement le temps de rendu des pages.

Enfin, la mise en cache avancée via Redis ou Varnish n'était pas encore intégrée au site. La version 1.6 du site ne permettait donc pas une exploitation optimale de ces mécanismes, pourtant essentiels pour afficher du contenu dynamique à haute vitesse.

Identification des freins à la conversion via l'UX de la version 1.6

Côté UX, nous avons également identifié des freins importants à la conversion dans le parcours utilisateur de Molly Bracken. Grâce à notre expertise en CRO, voici une liste non exhaustive de freins identifiés à travers nos audits et qui devait être travaillée dans la refonte à venir : 

• Ergonomie générale du site, accès facile au produit et catégorie à améliorer
• Lisibilité des informations essentielles à revoir (prix, descriptif produit, réassurance) 
• Moteur de recherche et liste de filtres à optimiser 
• Parcours utilisateur global à revoir 

Benchmark et alignement avec la version US

Afin de cadrer les éléments à intégrer lors de la refonte, les équipes Yateo et Molly Bracken se sont focalisées sur la version US de la marque.

En effet, les sites US et Canada de Molly Bracken utilisent Shopify, avec une expérience utilisateur plus moderne et haut de gamme que la version Europe sous Prestashop 1.6. L'enjeu a donc été d'opérer "un mirroring" de l'expérience utilisateur et de la charte graphique du site US sur la version Prestashop 8.2 à venir.

Reproduction via un thème PrestaShop sur mesure

Plutôt qu'une adaptation basique, Yateo a décidé de traduire les standards de la version Shopify US dans un environnement Prestashop 100 % sur-mesure. 

Ce mirroring avait à la fois pour but de reproduire l'univers graphique de la version US, mais également d'apporter encore plus de fonctionnalités sur la partie technique. 

Développement avec PrestaShop Enterprise

Pour soutenir cette montée de version ambitieuse de Molly Bracken, le projet s'est structuré autour de la solution PrestaShop Enterprise. Ce choix nous a permis de travailler plus efficacement sur toutes les phases du projet :

• Infrastructure aménagée : L'accès natif à des environnements distincts pour la phase de développement, de staging et de production a été un outil essentiel à nos équipes pour travailler efficacement tout le long du projet.
• Gouvernance technique : un cadre certifié assurant la conformité des modules et la sécurité des données, répondant aux exigences de robustesse des structures "Enterprise".
• Accompagnement privilégié : un accès direct au support et aux ingénieurs de PrestaShop pour sécuriser les étapes complexes de la migration et garantir un SLA (Service Level Agreement) optimal.

Définition du cahier des charges

En collaboration avec les équipes de Molly Bracken et suite à nos audits, nous avons donc pu déterminer ensemble le cahier des charges. Cela nous a permis de dresser en détail les spécificités du projet et de mieux visualiser les priorités pour la montée de version. Voici quelques spécificités au cœur du projet de refonte Prestashop pour Molly Bracken : 

• Stratégie de migration des données (ETL) : nous avons mis en place la définition du périmètre d'importation en priorisant la data "chaude" : comptes clients et adresses, tout en purgeant les données obsolètes (anciennes commandes, paniers abandonnés datés) pour repartir sur une base de données saine.
• Stack Marketing & Tracking : Klaviyo pour l'automatisation, Advanced Search 5 pour la navigation à facettes AJAX, et Didomi pour la conformité RGPD.
• Implémentation d'un One Page Checkout (OPC) : Pour réduire drastiquement le nombre de clics avant la transaction.
• Géolocalisation IP : pour assurer automatiquement la bonne langue et la bonne devise dès l'entrée sur le site, évitant ainsi toute friction géographique.
• Cross-selling dynamique : mise en place de blocs "Shopper la tenue" sur les fiches produits pour augmenter mécaniquement le panier moyen (AOV).

Phase 2 : Développement de l'expérience utilisateur

Une fois les spécifications fonctionnelles établies, nos équipes sont passées à la création et à la mise en place des recommandations. Le défi de ce projet a résidé dans la création d'une structure technique beaucoup plus performante avec la version 8.2 de Prestashop, et d'aligner le design du site avec le site US.

UI/UX : Mirroring avec les versions internationales

L'approche de Yateo sur cette partie n'a pas été seulement d'opérer un mirroring avec la version US, mais de créer une architecture front-end sur mesure, exploitant pleinement le plein potentiel des dernières versions de Prestashop.

L'objectif principal de cette étape a été de visualiser les écrans clés du site (comme la page produit, le panier, le tunnel de commande, et l'espace client), en assurant une expérience utilisateur fluide, simplifiée, et optimisée pour répondre à la problématique de lier un parcours B2B sans pour autant impacter l'UI ou l'UX du site.

Front-end mirroring

Yateo a donc conçu un thème Prestashop sur mesure, avec un développement from scratch pour répondre aux besoins uniques de la marque tout en assurant l'évolutivité du site sur le long terme. 

Par exemple, chaque détail du design du site US a été méticuleusement traduit de Shopify à Prestashop, notamment en réintégrant les typologies fines et le design élégant pour que l'expérience utilisateur soit fluide et en cohérence avec l'image premium de la marque. Pour ce faire, Yateo a opéré des adaptations CSS avancées, tirant parti au maximum des libertés qu'offrent les dernières versions de Prestashop.

Mega Menu Pro et Creative Slider Responsive

Le Mega Menu Pro est également une intégration clé opérée par Yateo. Nos équipes ont intégré ce module pour créer un menu structuré et dynamique répondant à des besoins précis : 

• Menu multizone : le sélecteur de zone géographique permet aux utilisateurs de changer de domaine automatiquement selon les localisations sans quitter leur page actuelle. 
• Structuration en 4 colonnes : Yateo a organisé le menu en 4 colonnes afin d'afficher les catégories et sous-catégories avec des bannières HTML éditables et des logos spécifiques à chaque gamme de la marque. 

Grâce au Mega Menu Pro, Yateo permet une navigation simplifiée en assurant une expérience utilisateur fluide, personnalisée, sans compromettre la vitesse de chargement. 

Yateo a également décidé d'intégrer un Creative Slider. Ce module permet de gérer les bannières principales du site avec des animations complexes tout en assurant qu'elles soient responsives sur n'importe quel device.

Visuel Merchandising : la "Product Listing Page" (PLP) augmentée 

Dans l'optique d'améliorer au global le parcours utilisateur de la version FR de Molly Bracken, Yateo a également pris soin d'améliorer significativement la façon de naviguer sur les produits de la marque. Nos équipes se sont focalisées sur l'optimisation de la liste produit dans un premier temps :

• Navigation à facettes AJAX : L'implémentation d'un moteur de filtrage dynamique, via Advanced Search 5, a permis de fluidifier la recherche de produit en les filtrant en temps réel, sans rechargement de page. Cela a été possible grâce à des requêtes AJAX (Asynchronous JavaScript and XML) permettant d'envoyer et de recevoir des données sans nécessiter un rafraîchissement complet de la page, et ce, en arrière-plan. 
• Normalisation des coloris : afin d'optimiser l'expérience utilisateur à un des moments les plus critiques du parcours, nous avons opté pour normaliser les produits ayant un coloris proche. 
• Interactivité des vignettes : nous avons ajouté une seconde image au survol avec un effet fade-in pour afficher le produit en contexte, must-have de tout site e-commerce dans le secteur de la mode. 
• Deep linking via pastilles de couleurs : sous chaque produit, des pastilles correspondant aux déclinaisons des couleurs ont été intégrées. Via un travail de deep linking, chaque pastille disponible ramène à un lien vers la fiche produit exacte, optimisant ainsi l'expérience de recherche. 

Optimisation de la fiche produit

La fiche produit a également été grandement améliorée. Les principaux enjeux à cette étape du tunnel ont été de rassurer l'utilisateur en augmentant sa confiance et son confort d'achat, ainsi que de faciliter sa prise de décision. Voici les principales optimisations apportées à la fiche produit type de Molly Bracken : 

• Zone d'informations sticky : cela permet de garantir une accessibilité constante aux informations les plus importantes. Nos équipes ont choisi de mettre en place une colonne sticky sur la droite de la page, afin que l'utilisateur puisse scroller la page en gardant à portée les éléments essentiels. 
• Aide au choix et réassurance :  Une des principales implémentations de la fiche produit a été le guide de taille contextuel. Ce module permet de simplifier le processus de sélection des tailles afin d'éviter les erreurs d'achats. En plus du choix spécifique des tailles, le module propose des recommandations sur les dimensions à vérifier telles que la taille ou la poitrine. 
• Advanced Delivery Date : grâce à l'implémentation de ce module, l'utilisateur peut avoir une prévision de livraison fiable pour mieux se projeter sur son achat. Un calculateur dynamique affiche la date de livraison estimée en fonction du produit, du transporteur choisi et d'autres paramètres précis. 
• Un cross-selling dynamique et contextuel : Yateo a pris soin de créer un cross-selling pertinent via l'utilisation du module Cross-Selling Pro. Il affiche des produits associés directement sous le bouton « ajouter au panier », ce qui permet d'optimiser le panier moyen des clientes de Molly Bracken.

One Page Checkout et Marketing Automation

Une fois la fiche et la liste produit optimisées, nous sommes passés à l'optimisation du tunnel de paiement et à la mise en place du marketing automation :

• One Page Checkout : pour ce faire, Yateo a décidé d'utiliser le module One Page Checkout, dans l'idée de regrouper toutes les étapes du tunnel transactionnel en une seule page. La force de ce module réside dans sa compatibilité avec les modules de paiement social login, tels que Apple Pay ou Google Pay par exemple. 
• Stack Data et Compliance : afin de suivre le parcours client de manière détaillée, Yateo a implémenté un tracking complet, avec un data layer e-commerce. Ceci permet de pouvoir collecter des données précises sur l'action des utilisateurs et d'optimiser les campagnes d'acquisition et le tunnel d'achat en fonction des remontées. 
• Automatisation avec Klaviyo : nous avons implémenté ce module dans le but d'automatiser les envois de notifications “back in stock”, par exemple, mais également d'intégrer un flux de données intelligent grâce à Klaviyo. Yateo a lié le module Mail Alerts de Prestashop avec la stack Klaviyo. Ainsi, dès que le produit revient en stock, les utilisateurs ayant manifesté leur intérêt sont directement prévenus par un mail personnalisé.

Phase 3 : Recette, test & mise en production

Avant la mise en ligne officielle du nouveau site Europe de Molly Bracken, le projet est rentré en phase de test et de validation pour assurer la fonctionnalité et la cohérence de l'entièreté du site. 

Recette fonctionnelle et fiabilisation

Une première phase de test a été menée en préproduction. Celle-ci visait à s'assurer du bon fonctionnement du site au global, en se focalisant notamment sur l'homogénéité du parcours utilisateur, d'un point de vue technique mais aussi visuel. Voici des exemples de test précis : 

• Validation des workflows transactionnels : ce test a consisté à vérifier de bout en bout chaque élément du One Page Checkout, afin de s'assurer du fonctionnement des différents modules et connecteurs de paiement et de transport. 
• Contrôle de l'architecture modulaire : il était nécessaire de vérifier si chacun des modules sur mesure fonctionnait parfaitement. Le Mega Menu PRO, l'Advanced Search et les intégrations avec Pretty Block ont donc été scrutés minutieusement. 

Déploiement de la stack marketing & growth

Afin de prévoir au mieux la mise en ligne officielle du site, nous avons activé en amont les solutions tiers pour la partie marketing : 

• Mise en service de Klaviyo: nous avons activé et vérifié les flux de données et la liaison avec le module Mail Alerts.
• Test du tracking GA4/GTM : le déploiement final du suivi amélioré a été effectué, permettant de monitorer les performances de vente en temps réel et les données spécifiques du comportement utilisateur. 

Stratégie de migration de données et gestion du "delta"

Le transfert des données est l'étape la plus critique du projet. Pour assurer une continuité parfaite, nous avons mis en place une méthodologie en deux temps :

• Migration initiale : importation structurelle des bases clients et catalogues.

• Synchronisation du Delta : juste avant la bascule officielle, nos équipes ont réalisé un "delta de migration". Cette opération consiste à récupérer l'intégralité des informations générées sur l'ancien site (nouveaux comptes clients, dernières 

Validation de l'expérience internationale (Géolocalisation)

Avant l'ouverture publique, une batterie de tests finaux a été menée sur le moteur de géolocalisation natif de PrestaShop.

Nous avons validé que chaque utilisateur, en fonction de son adresse IP, soit immédiatement exposé à la langue et à la devise correspondant à son marché. Cette étape est essentielle pour supprimer toute friction psychologique dès l'entrée dans l'entonnoir de conversion.

Bascule et monitoring post-lancement

Le passage à la version PrestaShop Enterprise a permis de monitorer les performances en temps réel lors du Go-Live. Grâce aux environnements de staging et de production natifs, la bascule a été sécurisée, permettant aux équipes de Molly Bracken de prendre en main leur nouvel outil de travail dans des conditions optimales de stabilité.

Conclusion

La refonte du site Europe de Molly Bracken par Yateo a représenté un vaste travail d'adaptation et de compréhension des enjeux de la marque. En partant d'une version vieillissante de Prestashop (1.6), Yateo a su moderniser le site tout en s'alignant avec la modernité des versions US et Canada. Plus qu'une simple refonte, nos équipes ont appliqué, par leur expertise et leur vision, des recommandations optimisant d'autres leviers comme le CRO ou le SEO par exemple. Avec ce nouveau site, Molly Bracken bénéficie d'un site ultra-performant semblable aux standards des plus grands sites e-commerce dans le secteur de la mode.