En 2021 et 2022, la société Ascanio a accompagné L’Eau Vive, réseau de magasin bio, dans la refonte de son site marchand afin d’augmenter sa présence sur internet et d’offrir une vraie expérience différenciatrice pour ses clients.

Sommaire

Sommaire
Une Expérience utilisateur repensée
Un site ultra performant
➡️ Recherche multicanale
➡️ Mode recette
➡️ Gestion des stocks
SEO friendly, optimisé pour le référencement local
Résultat et chiffres clés
Témoignages de l’Eau-Vive

Une Expérience utilisateur repensée

Benchmark, personas, userflow, wireframes, maquettage, prototypage, design system… ont été mis en place dans une démarche itérative afin de proposer la solution la plus ergonomique et simple possible pour les utilisateurs.

C’est grâce à l’équipe UI / UX d’Ascanio composée d’experts digitaux et en science cognitive que les leviers prioritaires ont pu être identifiés afin de définir le parcours client le plus performant possible :

• Parcours simple, prévisible et guidé (basé sur les schèmas mentaux des utilisateurs)
• Trouver les points bloquants et éviter les frustrations
• Conserver les codes du e-commerce classique tout en proposant un parcours innovant et optimisé
• Construire une interface intuitive et simple de navigation pour répondre à toutes les typologies d’utilisateurs
• Accompagner l’utilisateur tout au long du parcours au moyen de feedback sur ses actions
• Système de suggestion entre les produits et recettes

La refonte graphique a également pour but de moderniser l’image de marque et d’adapter la charte graphique déjà en place au web :

• Couleurs naturelles, camaïeu et nuances de vert et orange, jeu de transparence, cohésion avec la charte graphique actuelle de l’eau vive
• Proposer une expérience visuelle reconnaissable et identifiable comme étant celle de l’Eau Vive
• Interface claire sobre et rassurante : L’interface doit se faire oublier au profit des produits de la boutique
• Créer une ambiance dynamique et proche du consommateur : Accompagner et aider le consommateur dans son quotidien

Un site ultra performant

Si de nouvelles fonctionnalités innovantes ont pu être imaginées lors des différents ateliers de recherche utilisateurs, un travail de recherches et développement a également été mis en place afin de répondre techniquement de manière performante aux exigences.

Après beaucoup de recherches, tests et POC, le choix s’est rapidement porté sur Sylius (basé sous Symfony), et plus précisement l’API Sylius ainsi que son back-office. Le caractère modulaire de Sylius a été un atout dans le choix du framework. Côté front, nous utilisons le framework React. L’ensemble de l’application utilise Docker pour avoir un maximum de souplesse et de scalabilité en cas de montée en charge.

Recherche multicanale

Optimisée et extrêmement rapide, la recherche centralisée permet à l’utilisateur de trouver à la fois des produits et des recettes en quelques millisecondes avec une sensibilité à la casse sur des stocks différents selon les magasins et sur plus de 500 000 références.

Mode recette

Cette fonctionnalité est très pratique pour l’utilisateur mais il s’agit d’un défi technique de taille : la possibilité de mettre des produits au panier en fonction d’une recette et du nombre de personnes dans le foyer. Il est possible de retirer des ingrédients, d’ajouter des quantités, changer de marque, etc… En lien avec les stocks des différents magasins.

Gestion des stocks

L’envoi se fait par des flux depuis l’outil de gestion des stocks communs à tous les magasins : plus de 2000 flux chaque jour, avec plus de 7000 produits et 400 000 prix différents mis à jour toutes les deux heures.

La gestion et le traitement de ces flux exige de la rigueur et de la performance pour éviter toute erreur ou ralentissement du tunnel d’achat.

SEO friendly, optimisé pour le référencement local

Dans un objectif d’accroissement et de pérennisation du trafic, il était nécessaire d’avoir un site performant et orienté SEO.

L’optimisation des images, des textes, mais surtout du code React et la mise en place d’éléments essentiels ont été clés dans cette quête : Pré-render pour accélérer le référencement, Lazy loading pour charger uniquement ce dont on a besoin et accélérer le chargement, balises canoniques, redirections 301, paramétrage des urls contenant les mots clés nécessaires, optimisation de la version mobile du site, etc.

La structuration des contenus et l’optimisation de l’expérience utilisateur sont des éléments primordiaux pour le SEO

• Vitesse de navigation
• Parcours utilisateur simplifié et logique de navigation
• Hiérarchisation des contenus et tunnel de conversion simplifié
• Découpage des données produits (description, ingrédients, etc.) afin de fluidifier la lecture des utilisateurs et minimiser le taux de rebond.

Performances du site en version desktop et mobile (via Google PageSpeed Insights) :

La création de pages magasin dédiés permet également une optimisation de la présence locale des magasins.

Les pages sont reliées aux pages Google My Business et plus particulièrement à leurs avis ce qui améliore considérablement le référencement local.

Résultat et chiffres clés

Une moyenne de 50% de taux de rebond avant refonte et environ 20% aujourd’hui

0,30% de taux de conversion en moyenne contre 2,2% aujourd’hui.

Témoignages de l’Eau-Vive

« Le nouveau site marchand eau-vive.com a été un vrai service additionnel dans le contexte actuel ! Aussi bien en termes de fidélisation que de recrutement, ce site nous permet d’apporter de la proximité et de la valeur ajouté tout en rajeunissant l’image de marque.

Beaucoup de nouvelles fonctionnalités sont présentes ; plus de 600 recettes avec mise au panier des ingrédients, un compte client réinventé avec cumul de points fidélité et préférences de consommation, des listes de courses… Ce n’est que le début mais nous avons déjà de très bons retours. »