Site vitrine

Refonte du site du Marché de Rungis

Rungis International

Le plus grand marché de produits frais au monde

En janvier 2022, la société Semmaris nous a confié la refonte du site de Rungis, le plus grand marché de gros au monde. Le projet visait à garantir une autonomie à la société gestionnaire dans la construction du site et de ses contenus, en lui fournissant des modèles de pages et de composants correspondant à leurs besoins.

Contexte

La Semmaris ayant lancé un gros chantier de refonte de ses produits numériques en 2021, ce projet avait déjà été initié précédemment auprès d’un autre prestataire. Nous devions donc repartir des livrables déjà produits et adapter fortement notre méthodologie.

Enjeux

  • Fluidifier la navigation et les parcours sur le site pour les trois types d’utilisateurs identifiés
  • Prendre en compte des contraintes de conception en lien avec l’accessibilité et le SEO
  • Modéliser les livrables pour permettre l’autonomie des équipes de la Semmaris quant à la construction du site

Plan d’action

1.

Identification des utilisateurs et formalisation de leurs besoins

2.

Identification des contraintes à prendre en compte pour optimiser le SEO

3.

Définition d’une User Journey sur la base des besoins identifiés

4.

Réalisation d’un zoning pour les quatre pages principales du site

5.

Sketching d’une première proposition et itérations

6.

Définition d’une liste de templates de contenus pour les sections des pages internes

7.

Conception des Wireframes

8.

Réalisation des maquettes graphiques

1. Identification des utilisateurs et formalisation de leurs besoins

Un premier exercice en atelier avait pour but pour la Semmaris de cerner précisément quels étaient les trois types d’utilisateurs du site en identifiant leurs caractéristiques et leurs traits de personnalité :

Aperçu de la board Miro répertoriant les caractéristiques des types d'utilisateurs du site de Rungis

Cela leur a permis d’être plus juste dans l’identification des besoins, des raisons de visite et des informations recherchées par ces utilisateurs :

Aperçu de la board Miro répertoriant les besoins des utilisateurs du site de Rungis

2. Identification des contraintes à prendre en compte pour optimiser le SEO

Bénéficiant de la présence du consultant en SEO qu’avait mobilisé la Semmaris sur le projet, nous avons listé les différentes contraintes à prendre en compte pour optimiser celui-ci lors de la phase de conception :

Planche présentant les résultats de l'atelier de formulation des besoins SEO

3. Définition d’un User Journey sur la base des besoins identifiés

Pour chacun des trois types d’utilisateurs, le parcours à été séquencé en quatre étapes clés :

  • La découverte du site
  • La recherche d’informations
  • La transformation (inscription ou prise de contact)
  • L’utilisation régulière des outils

Pour chacune de ces phases, nous avons formalisé les actions qu’étaient susceptibles d’effectuer les utilisateurs sur le futur site :

User journey réalisée sur la base des besoins identifiés pour chacun des trois types d’utilisateurs

6. Réalisation d’un Zoning pour les quatre principales pages du site

Bien que l’essentiel de la mission fut dédiée à la conception de templates de pages et de modèles de composants, il fut convenu avec la Semmaris que nous travaillerions plus en profondeur sur les quatre principales pages du site, à savoir :

  • La page d’accueil générale
  • La page « S’implanter », dédiée aux potentiels futurs opérateurs du marché
  • La page « Acheter », dédiée aux acheteurs
  • La page « Découvrir » destinée à un public plus secondaire (visiteurs, médias, etc.)

Afin de cadrer leur future conception, nous avons commencer par concevoir un Zoning de ces quatre pages afin de déterminer quels contenus les composeront et comment ceux-ci y seront répartis :

Aperçu des écrans sous forme de zoning dans le fichier Figma
Lien vers le fichier Figma du Zoning

5. Sketching d’une première proposition et itérations

Une fois le zoning validé, la réalisation de Sketching nous a permis de nous projeter sur les livrables à produire par la suite :

Aperçu des écrans sous forme de sketching dans le fichier Figma

Cette étape fut aussi l’occasion de tester avec les équipes des idées de mises en forme et de fonctionnalités qui, même si elles n’ont pas été retenues, ont permis à la Semmaris de préciser le cadre fonctionnel et technique du futur site.

Lien vers le fichier Figma du Sketching

6. Définition d’une liste de templates de contenus pour les sections des pages internes

Concernant la partie modélisation, nous avons dans un 1er temps listé les templates de section de contenu que la Semmaris pouvait être susceptible d’utiliser lors de la construction des pages internes du site. L’objectif était de cadrer précisément cette phase et d’obtenir une estimation fine de la charge de travail à effectuer :

Aperçu de la liste et des Sketching des templates de contenus de section

8. Conception des Wireframes

Une fois le Sketching validé et la densité de contenu potentielle définies pour chacune des pages, nous avons entrepris de réaliser les wireframes des futures interfaces du site, tout en prenant en compte la logique de modélisation des pages internes et de leurs sections de contenus :

Aperçu des écrans sous forme de wireframes dans le fichier Figma
Lien vers le fichier Figma des Wireframes

9. Réalisation des maquettes graphiques

Une fois que l’ensemble des contenus des quatre pages principales nous avaient été fournis et que les Wireframes furent validés dans leur entièreté, nous avons pu finalisé complètement nos livrables par l’application d’une couche graphique aux maquettes déjà réalisées.

À partir de la charte existante, nous avons tâché de moderniser les interfaces tout en restant fidèle à l’identité de Rungis :

Aperçu des écrans sous forme de maquettes dans le fichier Figma
Lien vers le fichier Figma des maquettes graphiques

Et après ?

La suite de la collaboration avec les équipes de la Semmaris ne s’est pas faite attendre ! En effet, nous avons enchaîner directement la mission par la refonte de l’espace dédiée aux opérateurs implantés sur le marché.

Le développement des deux plateformes est en cours et est assuré par l’agence Sooyoos.

Allez hop, au boulot !

Contactez-nous pour passer à l’action...