Cela fait plusieurs fois que nous vous proposons des articles au sujet de projets menés à bien par nos développeurs.
Mais au BearStudio, nous possédons aussi des designers !
Zoom sur une mission UX design qui nous a été confiée par One Prepaid, leader des solutions de plateformes transactionnelles.
En tant que logiciel de gestion à distance des systèmes de cartes prépayées, One Prepaid s’adresse à des enseignes proposant ce type de système de paiement (Darty, Fnac, Yves Rocher etc.). La structure fait donc face à des impératifs très précis en termes d’expérience utilisateur.
L’interface de One Prepaid existe depuis plus de 12 ans… Il est donc nécessaire de lui donner un coup de neuf et de remettre au centre des préoccupations le client et son expérience de la plateforme. Vous l’aurez deviné, c’est à nous qu’ils ont fait appel !
Leur demande : « redonner un coup de neuf à notre plateforme en mettant l’expérience utilisateur au centre de la plateforme ».
D’abord, l’équipe de Stéphane Assuid (CEO de One Prepaid) nous a commandé une charte graphique (guide comprenant les recommandations d’utilisation des différents éléments graphiques susceptibles d’apparaître sur l’ensemble des supports de communication d’une entreprise).
Une de nos propositions retenue, ce document a ensuite servi de base à nos designers.
Ensuite, on s’attelle à l’audit UX de la plateforme. Pour ce faire, nous respectons plusieurs étapes :
Il est ressorti de cet audit, qu’en effet, le remaniement de l’arborescence globale et des différentes fonctionnalités était important, tant pour des raisons visuelles que pratiques.
L’audit est une étape cruciale dans un projet numérique, nous y accordons une grande importance au BearStudio. C’est d’ailleurs pour cela que nous avons mis en place des mini-audit UX gratuits.
Lors de la première réunion avec les clients, notre équipe a pris soin de passer en revue l’intégralité des écrans en posant toutes les questions nécessaires pour bien se figurer la logique du fonctionnement de l’interface.
Il faut savoir qu’un bon UX designer essaye toujours de comprendre le besoin de l’utilisateur pour partager son expérience et ainsi détecter les points forts mais aussi les faiblesses de celle-ci.
Le projet étant conséquent, nous avons décidé de le diviser en deux grandes parties. Afin d’avancer étape par étape et ainsi, de ne pas se perdre dans un périmètre trop grand.
Nous avons donc commencé par la conception des écrans cœurs (les plus utilisés). L’objectif étant d’en améliorer l’ergonomie et de rendre le design logique, pratique et fonctionnel.
Pour ce projet, les écrans cœurs de fonction correspondent à la partie opérationnelle comme la création des cartes prépayées.
Puis nous avons travaillé sur la deuxième partie qui était plus orientée logistique (gestion des rapports par exemple). Attention : même en découpant le projet il est important d’avoir une compréhension globale de celui-ci.
Nous avons organisé toute une série d’interviews afin de récolter un maximum d’avis auprès des principaux utilisateurs de One Prepaid et ce en allant du service logistique, au service commercial, en passant par la comptabilité.
L’idée est de plonger dans le quotidien de ses services pour mieux comprendre leurs attentes et besoins !
Les retours des clients finaux nous ont permis de sélectionner les chantiers prioritaires et de comprendre le métier et les logiques de navigation des utilisateurs en fonction de leur rôle.
Eh oui, qui de mieux placé pour évaluer la praticité d’une application que ses utilisateurs les plus réguliers ?
Ces interviews sont essentielles pour la refonte d’une plateforme ou application. Comprendre l’utilisateur afin de créer quelque chose qui correspond à ses besoins: c’est ça le cœur de l’UX !
Revenons à nos moutons (enfin nos ours) : dans la lignée de l’inventaire numérique effectué en amont, notre équipe UX s’est focalisée sur la création des nouveaux userflows.
Cette pratique consiste à retracer le parcours de l’utilisateur de la façon la plus claire possible, en n’oubliant aucune étape.
C’est une phase indispensable avant d’effectuer la modélisation sous la forme de wireframes, où les problématiques de style n’entrent pas encore précisément en jeu.
Les wireframes sont des maquettes statiques des futures pages présentes sur la plateforme et reprennent le parcours des userflows.
C’est la dernière étape avant de proposer au client une première version de maquettes interactives. C’est-à-dire une simulation virtuelle permettant de faire valider les nouvelles fonctionnalités proposées et les features envisagées.
Toute cette phase se réalise en collaboration avec le client avec lequel nous organisons des démonstrations et des réunions chaque semaine afin de se maintenir dans la bonne direction.
Le suivi client est permanent et ce dernier a accès à l’avancée du projet en temps réel. Nous tenons à adopter une méthode agile afin de rester en phase avec la réalité de l’expérience utilisateur.
Nous utilisons également un environnement de test tout au long du projet afin de reproduire les actions cœurs du métier. Le but est de s’assurer de la bonne utilité et utilisabilité des fonctionnalités du projet.
En plus de la refonte UX du projet, notre équipe participe également pleinement à son développement et à son déploiement. Ce chantier comporte plusieurs caractéristiques spécifiques.
Il faut dire que la présence de nombreux écrans rend le travail plus complexe mais aussi plus intéressant.
Mais ce n’est pas la première fois que nos experts ont affaire à une application avec un back-office bien distinct de l’interface utilisateur.
En revanche, un des aspects de ce chantier appelle à une grande vigilance de la part de nos ours : il s’agit de l’enjeu lié à la sécurité du service et plus précisément à la sécurisation des transactions.
En effet, One Prepaid se doit de garantir la sécurité des fonds présents sur les cartes cadeaux des utilisateurs.
Par exemple, nous ne pouvions pas envisager une fuite des numéros de carte des utilisateurs dans nos requêtes, il fallait donc penser à une méthode sécurisée.
Nous avons alors utilisé un identifiant unique sur les cartes. Cet identifiant ne permet pas d’effectuer d’opérations mais permet au système d’effectuer une requête permettant d’accéder aux informations de façon sécurisée. En résumé, nous utilisons un identifiant en intermédiaire afin de ne pas afficher les éléments confidentiels.
Une autre particularité de ce chantier s’articule autour du fait que notre intervention se porte sur un service ayant déjà fait ses preuves auprès d’une communauté d’utilisateurs.
D’un côté nous gagnons pas mal de temps, surtout au début, mais ça induit également un certain nombre de règles à respecter impérativement.
Évidemment, les clients ont des habitudes bien ancrées qu’il faut optimiser. Nous devons alors penser à des petits systèmes d’accompagnement au changement afin de ne pas bouleverser leurs habitudes.
La refonte doit être un avantage et non une contrainte pour les clients.
De plus, la refonte d’une interface utilisateur est toujours satisfaisante car elle permet d’apprécier l’avant-après, de voir les améliorations apportées au projet. Mais il faut faire face à des contraintes liées à la dette technique.
En effet, le projet fonctionne bien depuis 15 ans avec des clients réguliers et un historique important. Le code déjà existant doit donc continuer d’opérer.
Il faut veiller à ne pas trop s’en éloigner sans réfléchir aux conséquences, continuer à programmer autour de celui-ci. Ce qui crée un cadre parfois un peu contraignant autour du projet.
Ce chantier complet et complexe s’avère bénéfique pour tout le monde !
Le client est satisfait et nos experts ont l’occasion de monter davantage en compétences «sur le terrain».
Publié le 20/07/2021 dans Design
Rédigé par :