Le blogue d'Idéactif
19 janvier 2010
Produire des wireframes : des outils à profusion
Quelques fois par année, j’ai l’habitude de prendre quelques heures, voire quelques jours, pour me remettre à jour sur certains aspects de mon valeureux métier d’architecte de l’information (ou designer d’interaction, ou spécialiste de l’expérience utilisateur, ou web designer, ou même ergonome, c’est à votre goût). C’est ce que je viens de faire pour les outils de créations de wireframes et j’ai la tête qui tourne…
J’ai probablement créé mon premier wireframe vers février 1996, quand j’ai eu le mandat de concevoir le tout premier site du Cirque du Soleil (pitch gagné avec la firme eMarketing de Pierre Côté, pour un fabuleux budget total de 18 000 beaux dollars, tout inclus!). Durant de nombreuses années, les wireframes se faisaient à la mitaine, avec n’importe quel outil de dessin, voire même sur papier, ce que certains préfèrent encore. Plus tard, Visio sur PC et Omnigraffle pour Mac sont devenus les outils de choix, car plusieurs kits de modélisation (templates) étaient disponibles pour ces logiciels.
Il y a quelques années, des outils dédiés à la création de wireframe sont apparus, tels que Axure (pour quelques centaines de $$$) et iRise (pour quelques milliers de $$$). Maintenant, en date de janvier 2010, il existe des dizaines de logiciels dédiés, qui peuvent rouler en local sur votre ordi, en ligne dans le « cloud » ou en format hybride local et « cloud ». Certains permettent de créer des prototypes complets avec tous les widgets AJAX, d’autres permettent seulement des esquisses rapides pour l’idéation préliminaire. Certains même peuvent vous aider à préparer un prototype complet pour tests à distance (remote usability testing.) Le choix est en train de devenir intéressant.
Lequel choisir? Je vais vous décevoir, car je n’en ai aucune idée pour le moment. Pourquoi? Parce qu’il faut investir beaucoup de temps pour essayer ces différents outils et comprendre leurs avantages spécifiques et leurs limites dans le cadre de sa pratique personnelle. J’utilise encore le bon vieux Visio, mais mon travail nécessite de plus en plus de documenter de l’interaction et de moins en moins de la mise en écran (screen layout). Je vais devoir trouver un outil qui répond à mes besoins, mais je n’en adopterai pas un avant d’être certain que mes livrables seront encore meilleurs pour mes clients. Pas de gizmos wizbang pour moi. Je cherche du solide, du mature et je n’ai pas encore trouvé. Mais je suis sûr que ça viendra très bientôt.
D’ici là, voici quelques-unes des question que je me pose et que vous devriez vous poser avant de choisir un ou plusieurs de ces outils, mis à part le choix de plate-forme, PC, Mac ou autre.
1) Avez-vous le temps et la motivation pour apprivoiser le fonctionnement d’un nouveau logiciel?
Chacun des ces logiciels fonctionne différemment, possède souvent une panoplie de fonctions et requiert un certain temps d’apprentissage pour être efficace. Si vous débutez un projet avec des délais serrés, remettez à plus tard l’essai d’un nouvel outil (quoique certains vous diront que la pression de produire fait des miracles pour tester un logiciel à fond!).
2) Êtes-vous prêt à prendre le risque d’investir temps et (quelque fois) argent dans un outil qui n’a peut-être pas encore fait ses preuves?
Je remarque que beaucoup de ces logiciels proviennent de compagnies en startup. Il y a actuellement une intense compétition pour s’approprier ce petit marché niche et il est probable que plusieurs ne survivront pas. Ne mettez pas tous vos oeufs dans le même panier. Faites beaucoup de recherches sur les blogs, forums, Twitter, spécialisés en UX/AI/Webdesign, etc. pour aller chercher le sentiment général et le mérite de chacun des outils avant de choisir celui qui vous accompagnera. Mis à part iRise et autres outils de prototypage orientés Big Business, la plupart de ces logiciels sont abordables. Un outil mature comme Axure commande un prix plus élevé, mais la stabilité relative de l’entreprise vient avec.
3) Quel genre de design faites-vous le plus souvent?
Si votre pratique n’exige pas un haut degré de précision quant à la documentation, ou si vous créez des sites Web de quelques pages sans beaucoup d’interaction, un simple logiciel de dessin ou du papier et crayon peuvent suffire. Si toutefois vous devez concevoir des sites Web avec de nombreuses composantes interactives, des widgets Ajax, des séquences d’authentification, du Web 2.0 à profusion, regardez plutôt du côté des logiciels plus robustes qui offrent des fonctions de simulation conditionnelle (comme Axure).
4) Quelles sont les exigences de communication avec vos collègues, clients et partenaires?
Point d’une extrême importance qui est souvent négligé. Le rôle central d’un concepteur (peu importe son domaine) est de communiquer ses idées et de convaincre des gens qui n’ont pas toujours votre appétit pour les détails infinis qui troublent votre sommeil. Si votre logiciel ne vous permet pas de faire des bons vieux PDF imprimables, oubliez ça… Il faut que votre outil vous permette de transmettre vos idées à l’aide du plus bas dénominateur commun (i.e. imprimante et projecteur) dans tous les contextes (votre bureau, celui du client, la brousse, etc.).
5) Jusqu’à quel point voulez-vous simuler une application Web réelle, avec tout le « look and feel »?
Votre but est-il d’esquisser rapidement des idées durant un remue-méninge ou de créer un prototype hyper-réaliste avec des images, des vidéos et du CSS/XHTML de qualité déjà en place? Certains des outils les plus simples et les moins chers (comme balsamiq) font partie de la première catégorie et peuvent vous rendre vachement efficaces en un rien de temps. Il n’est pas interdit de combiner l’usage de deux logiciels selon vos besoins.
6) Est-ce que les tests d’utilisabilité (user testing) font partie votre processus de travail?
Vous savez sûrement que tester un prototype avec du « vrai monde » avant de coder fait toujours partie d’un bon petit déjeuner équilibré. Bien sûr, on fait tous ça ;-) La création de prototypes réalistes qui simulent des fonctions interactives clés devient alors une exigence incontournable. La règle d’or pour les test auprès d’utilisateurs: ne jamais leur demander de faire semblant d’utiliser un site Web; ils ne doivent pas se poser cette question. Ce qui met la barre très haute quant à la création d’un prototype testable, et aussi pour le logiciel qui prétendra créer ce genre de prototype facilement.
7) De quel budget disposez-vous pour l’achat et le maintien d’un logiciel de ce genre?
Certains outils sont gratuits pour un usage limité, d’autres coûtent la peau des fesses. Généralement, you get what you pay for, mais assurez-vous de payer seulement pour ce que vous avez besoin.
8) Travaillez-vous seul ou en équipe sur les mêmes documents?
Je travaille la plupart du temps seul sur mes documents, et c’est probablement le cas de la plupart de nous en tant que pigistes ou en petite agence. Par contre, en grande entreprise, ça peut être différent. Si plusieurs personnes peuvent travailler sur un même document simultanément, oubliez les solutions simples et peu coûteuses. Par contre ne confondez pas accès simultané (plus complexe) et travail collaboratif (annotations, révisions, etc.) Certains outils permettent ce genre de travail asynchrone.
Si ça vous tente, allez faire un tour sur mes signets delicious où j’ai commencé à répertorier certains de ces outils et des ressources connexes : delicious.com/jfpetit/wireframes.
26 mai 2009
Groupes de discussion, tests d’utilisabilité ou tri de cartes?
Même en 2009, il y a encore une méconnaissance importante des bienfaits respectifs des groupes de discussion (communément appelés focus groups), des tests d’utilisabilité et du tri de cartes (également appelé classement de cartes, ou son équivalent en anglais, card sorting) comme méthodes de développement et d’évaluation de sites Web. Il faut d’abord préciser que chacune des ces activités devraient être réalisées à des moments bien précis du développement, et qu’elles ne mesurent pas toutes l’utilisabilité. Il faut également comprendre qu’elles sont indépendantes l’une de l’autre et qu’elles peuvent être utilisées ensemble dans une séquence bien déterminée ou séparément au besoin.
Gare aux interprétations hâtives
Les groupes de discussion utilisent souvent des maquettes ou des prototypes très préliminaires comme objet d’étude. Cette méthode qualitative génère habituellement des opinions, qui peuvent être quelques fois très différentes des actions mesurables. Par exemple, un participant peut exprimer l’opinion qu’il aime la page qu’on lui présente et la trouverait facile à utiliser. Cela peut être vrai ou faux, mais il est impossible de le savoir vraiment, peu importe la taille du groupe. Cette méthode ne peut pas vraiment mesurer l’utilisabilité d’un site ou de toute autre produit interactif.
Les tests d’utilisabilité servent justement à mesurer objectivement la facilité ou la difficulté d’utilisation. Ils doivent être effectués à l’aide de prototypes les plus près de la réalité possible. Il est dangereux de demander à un participant de « faire semblant » d’utiliser un site Web alors que ce qu’on lui présente ressemble à des schémas de pages (wireframes) ou est un prototype à peine fonctionnel. Il est possible d’utiliser des prototypes en papier ou des schémas de page, mais à condition de tester des éléments de contenu précis et non pas une réelle suite d’interaction.
Lors de ces tests, on voit souvent des cas où un participant exprime une opinion positive à propos d’une page ou d’une fonction, mais après avoir essayé de l’utiliser, il devient évident qu’il rencontre des difficultés inattendues. Même après avoir vécu des difficultés importantes, certains participants répondront que leur expérience a été positive et facile quand on leur redemande leur opinion. Comment différencier tous ces résultats et retenir l’essentiel? C’est là qu’un spécialiste entre en jeu. Il peut distinguer entre les opinions, les faits et les inévitables « effets de tests », qui poussent souvent les participants à être un peu trop gentils et optimistes. Ils se sentent observés et veulent souvent bien paraitre, ce qui est parfaitement humain et normal. La prudence est de mise lors de la phase d’interprétation, qui est déterminante pour la suite. C’est pourquoi on recommande d’avoir au moins deux personnes présentes qui observent et prennent des notes lors des tests d’utilisabilité; il est alors plus facile d’en arriver à un consensus sur les résultats.
Les facteurs esthétiques ont leur importance
Les tests permettent donc de mesurer la facilité d’utilisation et de s’assurer qu’une opinion soit validée par des actions mesurables. Par contre, un groupe de discussion est tout indiqué en début de projet pour mesurer des perceptions face à un nouveau produit ou face à une entreprise ou organisme. Par exemple, on pourrait y présenter un site existant et demander l’opinion des participants sur leur perception (est-ce trop simpliste? élitiste? inintéressant?, etc.) dans le but de corriger le tir pour une version améliorée. Les groupes sont également intéressants pour évaluer la part esthétique d’un site, qui est aussi très importante. Un des gourous de l’utilisabilité, Don Norman, a beaucoup écrit sur l’importance de l’esthétique et son influence sur la perception. Les utilisateurs qui trouvent un site beau et bien fait auront tendance à être mieux disposés envers ce site. Ils lui accorderont plus de crédibilité et feront probablement un effort additionnel pour l’utiliser à son plein potentiel. S’ils rencontrent une difficulté dans leur parcours, ils seront plus enclins à persévérer et à mener à bien une tâche, sans l’abandonner en cours de route. Par contre, il est très rare d’avoir une maquette très complète incluant tout le design graphique en début de projet, et c’est souvent à cette étape qu’on fait appel aux groupes de discussion. Selon le budget disponible, il faut choisir la méthode qui nous apportera les meilleures données au bon moment.
Le tri de cartes est une méthode quantitative
Le tri de cartes est une méthodologie qui est bel et bien quantitative si elle est bien exécutée. Elle repose entièrement sur l’interprétation que font les participants des éléments de contenu qu’on leur demande d’organiser en groupes et sous-groupes. Contrairement aux groupes et au tests d’utilisabilité, il ne s’agit pas d’une méthode d’évaluation (il y a des exceptions toutefois), mais plutôt d’un outil de conception qui devrait tomber dans la cour des architectes de l’information, et non pas celle des ergonomes. L’interprétation des résultats de tri de cartes doit aussi être sujette à caution. Si un ou plusieurs des participants ne connaissent pas la signification exacte de certains éléments, ou qu’ils les interprètent d’une façon erronée, ils risquent de placer ces éléments dans une catégorie qui ne fera pas de sens pour personne. Par exemple, lors d’un tri de carte que nous avions faits pour le site des Archives de Radio-Canada, certains élèves de secondaire (un groupe cible prioritaire) avaient classé « Crise d’octobre » sous la catégorie « Science et technologie ». À quoi pensaient-ils en faisant ce choix? Impossible de le savoir, car cette méthodologie ne prévoit généralement pas des entrevues post-test, et il faut donc se fier à la tendance générale et non pas à des cas particuliers. D’où l’importance d’effectuer correctement l’échantillonnage et d’avoir au moins 30 sujets par groupe homogène (par exemple, 30 étudiants du même niveau scolaire) pour obtenir des résultats statistiquement significatifs.
Pour en savoir plus sur le tri de cartes, je vous conseille cet article de Ergolab.
À propos de ce blogue
La conception, l'évaluation et l'optimisation de sites Web constituent le coeur de nos activités quotidiennes. Ce blogue traitera donc principalement de qualité de l'expérience utilisateur, des méthodes d'évaluation, de l'architecture de l'information, du design d'interaction, et d'analytique Web. On y raconte aussi un peu notre vie quotidienne en tant qu'entrepreneurs et consultants Web dans un contexte québécois.
- Articles par auteurs:
- Jean-François Petit
- Nathalie Berger
- Suivre Nathalie

- Suivre Jean-François

- Articles récents:
- Archives par mois:
