TP7: Rétroaction d’utilisateurs

Mat J. B., le 6 décembre, 2021

Comme tâche finale, nous devions évaluer les designs de nos pairs en se basant sur les critères ergonomiques de Bastien-Scapin. Pour ma part, j’ai évalué les designs de l’équipe qui tentait un redesign de la Coop HEC. Leur tâche n’était pas simple, considérant la complexité de l’offre de services et de produits de la Coop. Au final, mise à part quelques commentaires qui relèveraient plutôt de la direction artistique, leur travail était bon. La mission de ce cours n’étant pas la direction artistique, je me suis retenu d’émettre trop de commentaires sur leur travail à ce sujet.

Nous avions également la responsabilité de faire passer à des utilisateurs de petits tests durant lesquels nous leur ferions effectuer quelques tâches. Comme Laureen et moi n’avions pas les mêmes écrans—elle avait désigné des écrans d’appli mobile et moi du site web de marketing—nous avons opté pour poser des questions qui nous étaient propres. Voici les questions que j’ai posées :

• Si vous deviez créer un compte/vous abonner à Loki, pas où passeriez-vous ?
• Si vous aviez besoin de nous contacter, de quelle façon vous prendriez-vous ?
• Si vous souhaitiez changer la configuration, quel chemin prendriez-vous ?

Je présenterai ici une combinaison des commentaires reçus par mes pairs et les utilisateurs, principalement parce les tests utilisateurs ont été de plus grande utilité. À noter que les participants ont t0us deux visité le site prototype avec leur navigateur en plein largeur. Ils partagaient leur écran grâce à Teams et commentaient abondamment à voix haute.

Charte graphique – Formulaires et erreurs

Lors du partage des liens de nos maquettes Figma, certains de nos pairs ont commencé à déposer des commentaires directement, se permettant d’agir un peu comme des directeurs artistiques. À travers ces questions informelles, un des pairs s’est démarqué en demandant une simple clarification concernant la gestion des erreurs comme présentée dans la figure plus bas

La distinction entre la validation dynamique de champs de formulaire (colonne de gauche dans la figure plus haut) et les erreurs potentiellement données par un serveur suite à une soumission de formulaire (colonne de droite dans la figure plus haut) ne lui était pas évidente en regardant simplement le rendu visuel.

En soi cette question ne constitue pas un problème pour un utilisateur, puisque la rétroaction sera évidente au moment de l’utilisation. Toutefois, le UX ne s’applique pas simplement aux utilisateurs de nos produits, mais également aux manières de communiquer que nous avons entre nos pairs et nos collègues. Ce questionnement démontre qu’un rendu graphique seul n’est jamais suffisant pour expliquer une fonctionnalité, une description fonctionnelle aurait aidé grandement à comprendre pourquoi les deux choses sont présentées.

Page de création de compte

Les deux participants aux tests utilisateurs ont eu un moment d’hésitation une fois qu’ils sont arrivés à cette page pour compléter la tâche de création de compte. Les appels à action étant sous ce qui est communément appelé the fold—la ligne violette dans la figure plus haut—les participants les cherchaient sans tenter de scroller.

Un participant a suggéré une réorganisation de contenu de façon à ce que les blocs informationnels soient sur la même rangée que les appels à action. Je n’ai pas modifié le design de cette page avant de faire passer un deuxième test, afin de m’assurer de garder les mêmes interfaces pour tous les participants. Toutefois, puisque la progression des deux participants s’est trouvée ralentie, et qu’ils l’ont exprimé de vive voix, il y aurait un gain réel à changer la disposition de cette page et la tester à nouveau.

Page « Mon compte »

Cette page a été créée très rapidement afin que les utilisateurs durant le test puissent se rendre à la page de configuration. Un des deux participants a eu un long moment d’hésitation ici avant de trouver le lien « Configuration » dans les options à droite, même en passant sa souris plusieurs fois dessus. La deuxième participante de son côté l’a trouvé très rapidement sans hésiter.

Puisque cette page contient des points de départs vers des actions principales, un participant a suggéré de peut être considérer utiliser de grosses tuiles, ce qui permettrait de s’assurer que les actions disponibles soient claires et évidentes.

Les bons coups

À travers leurs tâches, les participants ont révélé certains choix de design comme étant de bons coups, parfois même à voix haute :

• Le prototype Figma présenté était interactif, ce qui permettait aux participants de cliquer pour naviguer. Avant de commencer une nouvelle tâche, je demandais au participant de retourner au point de départ, sans leur indiquer comment, et tous ont cliqué sur le logo en haut à gauche. L’intégration de ce standard peut sembler évident, mais dans le contexte d’une prototype, s’assurer que le logo permette un retour à la case départ aide énormément.
• Suivre une structure habituelle d’en-tête et de pied de page a permi aux participants de s’y retrouver rapidement quand ils ne trouvaient pas ce qu’ils cherchaient dans le contenu d’une page. Les liens vers l’abonnement (« Je m’abonne ») et vers la connexion à son compte (« Mon compte ») était bienvenus et facile à trouver. Reste à savoir si c’est l’emplacement, le libellé, ou la combinaison des deux éléments qui permettaient facilement aux participants de naviguer.
• Une participante était très contente qu’on lui offre le numéro de téléphone dans la section « Contactez-nous ». Si on prend en compte le persona des grands-parents—qui ne représente pas du tout la participante—il semble qu’offrir ce numéro serait effectivement une bonne chose à considérer.
• Enfin, même si ça n’a pas été explicitement mentionné, les couleurs contrastées et le fait que les éléments interactifs soit très clairs ont également contribué au succès des tests, puisque la dimension graphique n’a pas distrait les participants.

Self-Assessment Manikin Scale

Une fois leurs tâches complétées, j’ai posé les questions suivants aux participants, en leur demandant d’utiliser la Self-Assessment Manikin Scale pour grader leurs réponses :

• Quel était le niveau de votre sentiment de plaisir durant votre expérience ?
• Quel était le niveau de votre sentiment d’excitation durant votre expérience ?
• À quel point vous sentiez-vous en contrôle durant votre expérience ?

Comme en font foi leur réponses, leurs expériences étaient assez similaires :

Capture d’écran

Voici une capture d’écran silencieuse d’une navigation dans le prototype, et plus bas une capture d’écran du spaghetti que représente les connexions pour activer le prototype.