L’importance de l’UX/UI design dans la conception d’une plateforme B2B

Etude de cas « portail fournisseurs et partenaires » dans le retail

Adopter une stratégie d’optimisation de l’expérience utilisateur lors de la conception d’une solution digitale B2B est un impératif. Les attentes en matière d’UX design sont dorénavant les mêmes à l’égard des plateformes B2B que pour les sites B2C. En effet, les utilisateurs de ces plateformes sont aussi des internautes habitués à consulter des interfaces fluides, intuitives et ergonomiques

Ainsi, pour l’agence Calliweb, l’étape de conception de l’UX design d’une plateforme B2B est capitale. C’est de sa qualité que dépendra l’adhésion des collaborateurs, clients et prestataires chargés de l’utiliser.  

Nous vous présentons donc ici les différentes phases de la création UX/UI design d’un portail B2B. Il s’agit du “supplier & order portal” créé pour le géant de la grande distribution au Moyen Orient, Majid Al Futtaim (MAF). 

Un portail destiné aux fournisseurs et partenaires de Carrefour au Moyen Orient, en Afrique et en Asie

Le « supplier & order portal » de Majid Al Futtaim

Le “supplier & ordre portal” permet à MAF de gérer les relations commerciales et les activités logistiques en ligne. Il a été conçu en tenant compte des besoins des collaborateurs du Groupe et de leurs partenaires commerciaux à l’échelle internationale.  

La filiale « retail » de Majid Al Futtaim gère en effet plus de 350 supermarchés et hypermarchés au Moyen-Orient, en Afrique et en Asie Centrale. Majid Al Futtaim Retail détient ainsi les droits de franchise exclusive de Carrefour dans cette partie du monde.  

La solution digitale complète conçue par Calliweb pour Majid Al Futtaim s’articule autour de 2 plateformes :

  • Le “supplier portal” qui centralise toutes les informations relatives aux fournisseurs de Majid Al Futtaim. Il vise à simplifier les échanges avec les fabricants qui veulent intégrer leurs produits au catalogue de MAF.
  • “L’order portal” qui regroupe l’ensemble des suivis de commande et de leurs validations pour les différents intervenants de MAF. 

Objectifs

Centraliser les informations & fluidifier les échanges commerciaux.

L’agence Calliweb a géré toutes les phases de création UX/UI du projet selon la méthodologie exposée ici. 

Méthodologie

Définition de personas représentant les différents pays

Les utilisateurs de la plateforme à construire étaient répartis dans 13 pays. Dans le cadre de leur activité, ils appliquent des process propres à leur métier mais aussi à leur pays. Il était donc essentiel de prendre en compte ces spécificités pour définir les différents profils d’utilisateurs. Il fallait en outre leur attribuer des niveaux d’intervention et de validation différents. Des workshops menés avec des représentants de tous les pays ont alors abouti à la définition de 17 personas. 

Modélisation des workflows de validation d’un fournisseur

Nous avons mené un travail collaboratif avec les équipes de MAF afin d’établir la procédure de validation d’un fournisseur. L’enjeu était de déterminer des process efficients pour les différentes entités de MAF. Pour cela, nous avons représenté de manière schématique les différents flux d’échanges d’information et de documents. Nous identifions également quel utilisateur ajoute quelle data à quel moment. Et toutes les étapes de validation nécessaires sont prises en compte afin de créer de nouveaux workflows. Enfin, nous modélisons tous ces flux et workflows pour mettre en place des process optimisés

Mapping des workflows de validation d’une commande

En atelier de conception, nous avons redéfini les process de validation des commandes avec les intervenants de MAF. Parmi les spécificités de ces process, il a fallu prendre en compte les acheteurs internes et externes à Majid Al Futtaim. Au final, nous sommes parvenus à homogénéiser les étapes de validation au sein du groupe et à l’international. 

Des wireframes créés en fonction des personas

Une fois tous les workflows établis, le studio UX/UI de Calliweb a créé les wireframes de la plateforme. Ces maquettes permettent de décider où placer les composants des différentes pages. De leur emplacement dépendra l’ergonomie du site. Pour ce portail, le travail sur le “zoning” des écrans a été décliné en fonction des 17 personas définis. 

Etablissement d’un design system

Vient ensuite la création d’un design system. Il s’agit de créer un référentiel qui regroupe les différents éléments visuels de l’interface et la façon de les utiliser. Cela vise notamment à faciliter le travail de l’équipe de développement qui se fait par la suite. Les développeurs disposeront ainsi d’une base avec les différents assets qui composent la plateforme et leurs déclinaisons.  

Contactez nos experts pour construire votre plateforme B2B

Résultats

Avant d’entrer dans la phase de développement technique, nous nous assurons donc que les flux et les parcours créés vont permettre à la plateforme d’obtenir les résultats escomptés. Pour le supplier & order portal de Majid Al Futtaim, voici ce que cela a apporté. 

Simplification de la gestion au quotidien

  • La centralisation des informations sur la plateforme facilite le travail au quotidien de toutes les entités de MAFQue ce soit côté fournisseurs, acheteurs ou collaborateurs, elle permet de regrouper toutes les informations concernant leurs profils. La plateforme représente un véritable gain de productivité pour tous les intervenants

Sécurisation des relations entre partenaires commerciaux

  • Depuis une seule interface, les managers des pôles peuvent suivre les étapes de validation des nouveaux fournisseurs et des nouveaux produits. En cas de standby sur une validation, les relances sont facilitées par l’automatisation des procédures. La plateforme permet aussi de remonter des alertes en cas d’expiration de certificats de conformité et de suivre les différents contrats arrivés à expiration. Enfin, sur son dashboard, chaque utilisateur accède à ses dernières informations, commandes ou alertes concernant son pôle. Il voit immédiatement si une action de sa part est requise.

Gain d’efficacité et de réactivité 

  • Pour le pôle logistique de MAF cette interface représente une véritable révolution. Elle permet en effet d’optimiser le remplissage des conteneurs. Cela représente des gains à tous les niveaux : temps, efficacité, économie d’énergie et de coûts. La plateforme permet de suivre tous les envois de commandes clients à travers le monde et selon les fournisseurs sélectionnés. La plateforme de commandes permet aussi de gagner en souplesse et en réactivité en donnant la possibilité d’adapter les prix en temps réel. L’équipe MAF peut ainsi modifier les coûts du transport de marchandises en fonction de la fluctuation des prix.  

Bases de données partagées par les différents pays

  • La plateforme permet de disposer d’une base de données complète sur les fournisseurs et leurs produits. Sur la partie “commande”, l’équipe de MAF accède à une base de données clients mise à jour en temps réel. Elle regroupe les contacts, les informations de livraison et tous les documents concernant les marques et les produits. Inexistantes auparavant, ces bases de données sont désormais accessibles dans les 13 pays du groupe

En conclusion

Le travail sur l’UX/UI design comprend donc des étapes indispensables à la conception d’une plateforme B2B. Dans notre méthodologie, nous impliquons tous les intervenants jugés utiles. De par leur connaissance métier, ils vont permettre de définir de nouveaux process plus efficaces. Ces échanges, analyses et tout le travail sur l’UX design donneront ensuite lieu à une plateforme performante. Les bénéfices générés seront significatifs à la fois en termes de productivité, coûts et amélioration des relations entre partenaires commerciaux.   

VOIR LES AUTRES ÉTUDES DE CAS