Administration

2020 | UX/UI

Afin de ne pas porter atteinte au client, j’ai homis et enlevé des informations confidentielles dans ce retour d’expérience, ces informations viennent exclusivement de moi et ne reflètent peut-être pas la vision du client.

maquettes minimalistes de la nouvelle interface et de l'ancienne

A gauche, le nouveau design. A droite, l'ancien design qui datait de 2000.

Contexte

Ce projet a été impacté par la crise sanitaire du Covid-19 et a eu des conséquences sur son déroulement.
J'ai été seul en charge de l'aspect experience utilisateur / interface utilisateur.
Remettre au goût du jour une application interne de gestion et d’accompagnement de jeunes aux parcours sinueux.
Au préalable, un travail de recherche (étude de terrain,personas, experience map, cartographie fonctionnelle etc.) avait été réalisé, m'apportant des entrants de qualité.

Problématiques

Limitations

Mon ignorance sur le sujet en termes de RGAA.
Les bases techniques avaient déjà été choisies avant mon arrivée sur le projet. Le design devait suivre la solution Material Design de Google. Ce qui par certains aspects n'est pas la plus optimale pour notre problématique de RGAA.
La difficulté à avoir accès aux utilisateurs à cause du Covid-19.

photo du parcours principal photo du parcours secondaire

Modélisation finale des deux premiers parcours à maquetter.

Solutions

  1. L'interface a été imaginé sous forme de dashboard, cela permet entre autres d'avoir une cohérence de présentation et de navigation.
  2. Simplifier au maximum les parcours pour faciliter la navigation.
  3. Pour le RGAA, je me suis renseigné auprès de collègues certifiés pour avoir les bases dans les réglementations à respecter. J'ai pu être sensibilisé sur des sujets tels que la navigation, les contrastes ou encore la lisibilité.
  4. L'élément pivot afin de mettre en avant les jeunes dans l'interface a été de regrouper dans un même endroit toutes les informations relatives au suivi du jeune, sous forme de fiche de synthèse. Il en a été de même pour les personnes qui s'occupent du jeune, chose qui également n'existait pas avant.
  5. Tester. Nous avons pu faire passer des tests utilisateurs (au nombre de 9) sur 9 scénarios spécifiques via Marvel et une phase de beta test avec environ 25 autres utilisateurs cibles en live. Les résultats étaient plutôt concluants pour les deux méthodes. Pour les tests, une note de 7,8 sur 10 pour la nouvelle interface contre 6,6 pour l'ancienne. Pour la beta, sur le panel qui a répondu aux questions post beta, les beta testeurs recommande à 4 sur 5 la nouvelle mouture à un collègue.
photo d'une journée de beta test capture écran des tests Marvel

A gauche, une photo d'une journée de beta test. A droite, une capture écran des tests Marvel.

Enseignements

La grande nouveauté pour moi avait été de prendre en compte les critères d’accessibilités RGAA pour concevoir les interfaces. Je m'étais donc renseigné sur internet et auprès de mes collègues certifiés pour en apprendre plus sur les contrastes, la lisibilité, la navigation, etc. qu'exige l’accessibillité. Cela m’a permis de monter en compétence sur le RGAA et de voir d’une nouvelle manière mes interfaces et mes interactions avec différents publics. Cela me servira dans mes prochains projets, même ceux qui ne seront pas RGAA, car en prenant en compte ces contraintes, ce n’est pas seulement les personnes déficientes visuelles ou porteuses de pathologies que nous aidons, mais tous les utilisateurs.

Mon deuxième enseignement sur ce projet avait été de découvrir de nouvelles techniques de travail en Agile. Je n‘avais jamais été protagoniste d'un PI planning. Je ne faisais pas partie d’une équipe en particulier, étant transverse, j’ai pu m’inprégner des différentes visions des équipes de développement sur les sprints successifs. Au final, au travers des interdépendances des équipes, ce travail m’a aidé à avoir une vision plus claire de ce que je devais faire. Pour les gros projets qui intègrent un grand nombre d'acteurs, environ une cinquantaine pour celui-ci, c’est une méthode intelligente pour bien lancer le projet et donner une vision plus claire du futur de celui-ci.

De mon point de vue, l'intégration a été le point noir de ce projet, il n'y avait pas d'intégrateur sur le projet ce qui veut dire que les développeurs ont dû intégrer eux-même les maquettes, en plus de leur travail de développement.

Outils

Sketch (maquettes), Marvel (prototype et tests utilisateurs) et Zeplin (intégration).

Livrables

Un parcours en wireframe, les autres en UI; un kit UI; des tests utilisateurs.

photo de sketches papier photo d'un extrait du Kit UI

A gauche, une photo de sketches papier. A droite, un extrait du Kit UI.