Refonte du site e-commerce de Péligourmet

Client

Péligourmet

Date

Octobre 2018

Rôle

UX Designer

Team

CEO, COO, UI Designer (Lou Druet), Responsable logistique, développeurs fullstack

Péligourmet est un circuit court en ligne lancé en 2016. Le concept ne cesse d'évoluer pour s'adapter aux besoins des utilisateurs et des producteurs. 

En 2018, le concept évolue radicalement et suppose la refonte du site internet : j'interviens dans ce contexte afin de mettre en valeur le nouveau concept et la proposition de valeur sur le site e-commerce de Péligourmet.

Mission & objectifs

1. Cadrer et piloter la refonte de l'expérience utilisateur du site
   
2. Cadrer et piloter la refonte graphique élaborée par notre UI Designer

Ma démarche : analyse de l'existant

Le client a exprimé un certain nombre d'intuitions quant à la refonte de son site. J'ai procédé à une analyse de l'existant pour identifier les points de frictions de l'expérience utilisateur actuelle :

• Analyse des KPI (taux de rebond, taux de conversion, rétention client, ...)
• Analyse des sessions Hotjar
• Identification des workflows et des points d'optimisation
• Questionnaire quantitatif envoyé aux clients actuels de Péligourmet

Mes recommandations et livrables

Après analyse de l'existant et des retours utilisateurs, j'ai élaboré les recommandations suivantes :

• Redéfinition de la promesse client et de la proposition de valeur
• Refonte des pages stratégiques : Home page, Page Liste, Page produit
• Création d'une page producteur ayant pour objectif de les valoriser et d'apporter des informations aux utilisateurs sur les aliments et les méthodes de production.

Les livrables :

• Wireframes des pages suivantes : Home Page, Page Liste, Page Produit
• Brief et Moodboard du "refresh" graphique à l'attention de notre UI Designer

Ancienne version de la home page

Home Page

Problèmes identifiés : Mauvaise compréhension du concept, taux de rebond important

Le taux de rebond de la home page est très élevé. Nous pouvons l'expliquer par deux raisons : d'une part, le concept est mal compris des utilisateurs. Et d'autre part, la home page ne met pas en valeur la diversité de typologie de produit qu'on peut trouver sur le site.

Proposition de wireframe

Home Page

Proposition de solution pour la refonte

J'ai réalisé ce wireframe dans une démarche de co-conception avec le client en rappelant quels étaient les retours clients et les objectifs. 

1. Offrir un visuel inspirationnel
2. Valoriser la promesse client dans la hero banner
3. Proposer une barre de navigation avec les catégories de produits
4. Créer différentes rubriques contribuables par l'équipe au gré des saisons ou des coups de coeur
5. Donner la possibilité à l'utilisateur de filtrer les produits en fonction de sa date de livraison préférée
6. Mettre en avant les propositions de valeur de Péligourmet de façon à rendre plus transparents la sélection des producteurs et leurs modes de production
7. Informer l'utilisateur sur les aspects pratiques : "comment ça marche" et la livraison

Home Page

Maquette graphique finale

Cette proposition de notre UI Designer reprend exactement les inputs que nous lui avons confiés : 

• Le wireframe de la Home Page
• Le brief et le Moodboard pour le "refresh" 

Retours depuis la mise en production

" Le site est beaucoup plus intuitif et plus personnel qu'avant !" 

Pierre L., client Péligourmet

" Nous n'avons que des retours positifs de la part de nos clients depuis cette nouvelle version ! " 

Titouan Goenvec, Co-fondateur de Péligourmet

-12 %

Taux de rebond sur la Home Page

Liens utiles

En savoir plus sur les méthodes "guerillas" de Carine Lallemand

Le site de Péligourmet : www.peligourmet.com

Le site de Lou Druet, UI Designer : lou-druet.com