Faire cohabiter institutionnel et marketing

Le site devait répondre à deux logiques différentes : une logique institutionnelle, pour comprendre l'entreprise et ses activités, et une logique marketing, pour découvrir les solutions et accéder aux produits.

Cette coexistence rendait certains parcours difficiles à comprendre. L'analyse des comportements avec Contentsquare a notamment fait ressortir des frictions dans le parcours permettant de trouver un produit.

L'enjeu était donc de mieux organiser la navigation et les contenus, sans opposer les besoins utilisateurs, les objectifs marketing, les contraintes SEO et les attentes métier.

Le travail UX a commencé par un questionnaire destiné aux équipes Hutchinson afin de mieux comprendre les objectifs du projet, les usages attendus et les contraintes liées au maillage entre les parties institutionnelle et marketing.

Une première piste avait notamment été proposée pendant la phase UX : une section « Looking for a solution » sur les pages Industries, permettant de créer un point de passage entre les deux univers.

Le questionnaire a permis d'interroger cette piste et de mieux comprendre les contraintes métier, techniques et SEO pouvant influencer l'architecture de navigation.

Ces éléments ont ensuite été confrontés aux données comportementales disponibles dans Contentsquare afin d'identifier les parcours présentant le plus de friction.

L'analyse a montré qu'une partie du parcours pouvait être simplifiée en rapprochant les niveaux marché et sous-marché.

L'objectif était de supprimer une page intermédiaire et de permettre aux utilisateurs d'accéder directement aux contenus recherchés, sans perdre la logique de navigation du site.

Avant Marché → Sous-marché → Contenu

Après Marché + Sous-marchés → Contenu

Pour rendre cette nouvelle structure concrète, réalisation d'un wireframe fonctionnel avec Figma Make permettant de simuler le fonctionnement du parcours.

Le prototype a servi de support pour présenter la solution aux différentes parties prenantes, confronter son fonctionnement aux contraintes métier et valider l'orientation avant de passer aux maquettes haute fidélité.

Puis conception des solutions, des wireframes aux maquettes haute fidélité et aux prototypes interactifs, avant de décliner la nouvelle identité visuelle dans un UI Kit en Atomic Design destiné aux équipes de développement externes.

La refonte a permis de clarifier la navigation entre les contenus institutionnels et marketing, tout en facilitant l'accès aux produits et aux informations recherchées.

La nouvelle architecture réduit une étape du parcours en regroupant les niveaux marché et sous-marché, tandis que le prototype fonctionnel a permis de valider concrètement le fonctionnement de cette nouvelle structure avant son passage en conception UI.

Le UI Kit en Atomic Design a fourni aux équipes de développement externes un cadre commun pour décliner les interfaces et maintenir leur cohérence.