of 59 /59
1 Évaluation des logiciels interactifs (1) M2-IFL/DU-TICE, UPMC [email protected] Évaluation heuristique Critères d’utilisabilité Cours 1 (partie 2)

1 Évaluation des logiciels interactifs (1) M2-IFL/DU-TICE, UPMC [email protected] Évaluation heuristique Critères dutilisabilité Cours 1 (partie

Embed Size (px)

Text of 1 Évaluation des logiciels interactifs (1) M2-IFL/DU-TICE, UPMC [email protected]

  • Page 1
  • 1 valuation des logiciels interactifs (1) M2-IFL/DU-TICE, UPMC [email protected] valuation heuristique Critres dutilisabilit Cours 1 (partie 2)
  • Page 2
  • 2 Plan du cours Le projet tape 1 : dfinition du problme Sous-tape 1 : tude de lexistant Sous-tape 2 (prochaine sance) : comprendre les utilisateurs Utilisabilit Mthodes dinspection (Cf. cours 5) Introspection valuation heuristique Critres ergonomiques
  • Page 3
  • 3 Utilisabilit norme ISO 9241-11 (1998) : lutilisabilit est le degr selon lequel un produit peut-tre utilis par des utilisateurs identifis, pour atteindre des buts dfinis avec efficacit, efficience et satisfaction dans un contexte dutilisation spcifi . Bastien Utilisabilit/utilit : qualit ergonomique de l'interface Exprience utilisateur
  • Page 4
  • Dfinitions valuation en Gnie Logiciel systme = solution logicielle et matrielle plans qualit mesurent utilit du systme conformit des fonctionnalits avec le cahier des charges valuation ergonomique systme interactif = { utilisateur(s), artefact(s) } s'intresse utilisabilit du systme efficacit des systmes humains-machines interaction
  • Page 5
  • Mthodes dvaluation Sans utilisateur (pour tudier lexistant) Introspection Mthodes dinspection Critres ergonomiques valuation heuristique Avec utilisateur Cours 5 et atelier de fin janvier 5
  • Page 6
  • Introspection Le concepteur essaie le systme Procdure Se donner une tche relle Se donner un temps limit S assurer quon ne sera pas interrompu Parler voix haute et senregistrer Analyser chaud ce que lon vient dobserver Point positifs, ngatifs Surprises Ide damlioration 6
  • Page 7
  • Utilisation Technique trs utilise pour dmarrer et aborder un sujet Limites Trs subjective Employe seule : dangereuse conception gocentrique conception technocentrique appele : technique du fauteuil -Je ne bouge pas de ma chaise -Je conois pour moi-mme Conseils Suivez un protocole Les utilisateurs ne vous ressemblent pas 7
  • Page 8
  • Conception techno-centrique 8 Danger Conception ego-centrique ( cours Landay)
  • Page 9
  • 9 Inspection heuristique But Faire une tude systmatique de tous les crans dune application Sappuyer sur un ensemble de critres ou heuristiques Procdure 1.noter tous les problmes rencontrs 2.analyser les causes 3.proposer des solutions 4.noter aussi les points positifs 5.rdiger un rapport
  • Page 10
  • TD A rendre pour le projet (phase 1) une inspection heuristique dau moins deux applications voisines de votre projet pour la prochaine fois sur le site de votre projet Ensemble de critres : les critres de lINRIA Appels aussi critres de Bastien et Scapin lorigine de la norme Z67-133-1, Dcembre 1991 Prsentation sur le site ergolab : http://www.ergolab.net/articles/criteres-ergonomiques- 1.php http://www.ergolab.net/articles/criteres-ergonomiques- 1.php http://www.ergolab.net/articles/criteres-ergonomiques- 2.php http://www.ergolab.net/articles/criteres-ergonomiques- 2.php 10
  • Page 11
  • 1.Structuration des activits et guidage 2.Minimiser la charge de travail de lutilisateur 3.Contrle entre les mains de l'utilisateur 4.Adaptabilit 5.Prvision et rcupration des erreurs 6.Compatibilit 7.Signifiance des codes et dnomination 8.Cohrence et homognit Critres de lINRIA (Bastien et Scapin)
  • Page 12
  • 12 Utilisation des critres Pour lvaluation valuation heuristique Pour la conception Liste des erreurs de dbutant viter pour avoir lair professionnel Inscrire les critres dvaluation dans les dossiers de conception Guide pour lquipe de conception Foultitude de critres normes et recommandations Parfois contradictoires Pour veiller votre attention
  • Page 13
  • Structuration des activits et guidage objectif : faciliter l'apprentissage par l'action, l'orientation, les prises de dcisions techniques des roulettes de scurit (tayage, scaffolding), incitation (prompting, affordance) structure de contexte dtermine par les actions possibles granularit des commandes format d'cran organisation spatiale des donnes importantes groupement format de prsentation (titre, courbe, couleur, encadrs, justification) structuration des menus (prfrez la largeur)
  • Page 14
  • 14 Guidage : tayage Deux aspects Aider l'utilisateur dbutant se reprer et se construire une logique d'utilisation Permettre un utilisateur expriment de gagner du temps Exemples : Les informations au survol Les assistants d'installation Installation recommande Installation personnalise Le compagnon office (masquer) Les accs rapides et raccourcis clavier
  • Page 15
  • 15 Guidage - incitation Exemples Contre-exemple certains jeux daventures
  • Page 16
  • 16 Guidage - groupement/distinction entre items Exemple Contre-exemple
  • Page 17
  • Retours d'informations Objectif : informer pour permettre l'utilisateur d'valuer son action (modle de Norman) pour rassurer (temps de rponse long) pour rduire la charge cognitive indication du contexte de travail (fentre courante, tats, curseurs actifs) reprsentation des dplacements prsentation des options (menus fantmes, surgissant, pop-up)
  • Page 18
  • 18 Guidage retour dinformation faire De 2 6 secondes : icne d'attente De 6 30 secondes : barre d'avancement Plus de 30 secondes : Barre d'avancement + affichage de l'opration en cours Contre-exemple
  • Page 19
  • 19 Guidage - lisibilit faire Objectif : informer pour permettre l'utilisateur d'valuer son action pour rassurer (temps de rponse long) Dfinition du guidage : cest lensemble des moyens mis en uvre pour conseiller, o, Objectif : informer pour permettre l'utilisateur d'valuer son action (modle de Norman) pour rassurer (temps de rponse long) pour rduire la charge cognitive indication du contexte de travail (fentre courante, tats, curseurs actifs) ne pas faire OBJECTIF : INFORMER OBJECTIF : INFORMER POUR PERMETTRE L'UTILISATEUR D'VALUER SON ACTION POUR PERMETTRE L'UTILISATEUR D'VALUER SON ACTION POUR RASSURER (TEMPS DE RPONSE LONG) POUR RASSURER (TEMPS DE RPONSE LONG)
  • Page 20
  • 20 Lisibilit : Polices et style Jamais de soulign : exemple exemple Pas de textes longs en majuscules ni en italique : majuscules rendent le - texte plus difficile lire lment plus facile identifier EXEMPLE EXEMPLE exemple exemple Affichage l'cran : Police sans srif (sans empattement) Exemples : Arial, Helvetica, Verdana, Comic Contre-exemple : Times
  • Page 21
  • 21 Lisibilit : Format d'affichage Les nombres : Aligner les entiers droite Aligner les valeurs dcimales sur la virgule Dcouper les nombres par groupe de 3 ou 4 chiffres Les listes alphabtiques alignes gauche Labels et champs aligns gauche Quand les labels sont de mme longueur Labels aligns droite et champs aligns gauche Quand longueurs diffrentes
  • Page 22
  • 22 Lisibilit : Format
  • Page 23
  • 23 Lisibilit : couleurs Tout le monde ne peroit pas les couleurs de la mme faon Utiliser la couleur et un autre attribut pour coder une information ou pour mettre en vidence Respecter le sens habituel donn aux couleurs dpend des cultures, des domaines Ex : le rouge signifie Finance : perte Chimie : chaud Signalisation : interdiction Cartographie : nationale Scurit : danger lectricit : marche Circulation : arrt
  • Page 24
  • 24 Les couleurs : recommandations Codage couleur Associer chaque couleur une signification prcise et uniforme Principe du double codage : couleur + autre chose 8% des hommes sont daltoniens Minimiser le nombre de couleurs Utiliser pour mettre en valeur une partie de lcran neutre et claire pour le fond dcran trs contrastes pour exprimer une diffrence (et inversement) On
  • Page 25
  • 25 Couleurs viter Caractres : Bleu, rouge, violet (peu importe la couleur du fond). Couples : Fond/caractres Ne jamais utiliser ensemble Noir et bleu Rouge et bleu Jaune et violet, Jaune et vert Ces couples sont reconnus comme causant une sollicitation excessive de la rtine provoquant de l'inconfort qui peut s'aggraver avec le vieillissement. Fond : Les teintes de rouge et de jaune et ses drivs (par ex. : le vert, l'orange...) Lisez-moi
  • Page 26
  • 26 Couleurs conseilles Choix 1 Fond : gris ple, beige mais pas blanc Caractres : noir, magenta, vert Choix 2: Fond bleu Caractres : Blanc, or, vert Cyan, jaune, lavande Or, magenta Faites des tests !!!
  • Page 27
  • 27 Mthode de choix des couleurs Composer votre interface sans couleur La couleur est un plus Un codage color ne se suffit pas lui-mme Choix des couleurs 1.Identifier les objets afficher 2.Regrouper ces objets par niveau de visibilit 3.Choisir les composantes de la couleur Teinte : connotation Saturation et intensit : visibilit 4.Vrifier les compatibilits 5.Prototyper le rsultat obtenu
  • Page 28
  • 28 Utiliser les services de graphistes, faites des tests Penser au daltonisme 8 % des hommes Double codage : couleur + autre Respecter les conventions culturelles sur les couleurs Pas d'effet arbre de Nol Cours en ligne sur les couleurs http://interaction2.free.fr/ http://developpeur.journaldunet.com/tutoriel/theo/0607 08-accessibilite-couleur-daltonisme.shtml http://developpeur.journaldunet.com/tutoriel/theo/0607 08-accessibilite-couleur-daltonisme.shtml Accessibilit : http://www.braillenet.org/http://www.braillenet.org/ On Couleurs
  • Page 29
  • 29 Charge de travail Dfinition : Le critre charge de travail concerne lensemble des lments de linterface qui ont un rle dans la rduction de la charge perceptive ou mnsique (mnme = unit dinformation) des utilisateurs et dans laugmentation de lefficacit du dialogue 2 sous-critres brivet concision actions minimales densit informationnelle
  • Page 30
  • Rgle de concision limiter la charge de travail compromis entre le bref et l'expressif pas de gadgets inutiles, limiter les fonctionnalits limiter la densit d'informations rduire la charge mnsique abrviations (utilisateurs expriments) comprhensibles drivables selon des rgles prcises (commande I ou P)
  • Page 31
  • 31 Charge de travail - brivet faire ne pas faire
  • Page 32
  • Charge de travail - actions minimales Rduire le nombre d'actions physiques macro-commandes flexibilit abstraction Minimiser les entres couper-coller valeurs par dfaut (dynamiques ou prfrences) proposer des listes droulantes (pas trop longue) compltion automatique dfaire-repter 32
  • Page 33
  • 33 Charge de travail - actions minimales ne pas faire
  • Page 34
  • 34 Charge de travail - densit informationnelle faire ne pas faire
  • Page 35
  • 35 Charge de travail-densit
  • Page 36
  • Rgle du contrle l'utilisateur Objectif : l'interface doit apparatre comme tant sous le contrle de l'utilisateur le systme n'excute des oprations qu' la suite d'actions explicites de l'utilisateur Exemple : ne pas changer d'cran sans demande explicite prvenir si changement de contrle prvoir pour les experts la possibilit d'anticiper, de sauter des tapes (ne pas trop guider)
  • Page 37
  • 37 Contrle explicite Dfinition : ce critre regroupe 2 aspects diffrents la prise en compte par le systme des actions des utilisateurs le contrle des utilisateurs sur le traitement de leurs actions 2 sous-critres actions explicites contrle utilisateur
  • Page 38
  • 38 Contrle explicite - actions explicites faire Indiquer les champs obligatoires dans un formulaire Traquer les ambigits possibles ne pas faire
  • Page 39
  • 39 Contrle explicite - contrle utilisateur faire ne pas faire Impossibilit d annuler Prise de contrle intempestive
  • Page 40
  • 40 Adaptabilit Dfinition : Un systme est adaptatif quand il est capable de ragir selon le contexte, et selon les besoins et prfrences des utilisateurs Un systme est adaptable quand il permet l'utilisateur de le paramtrer 2 sous-critres Flexibilit (adaptabilit) Prise en compte de lexprience de lutilisateur (adaptativit)
  • Page 41
  • Flexibilit Objectif : prendre en compte la diversit des utilisateurs et des situations Exemples : paramtrages : prfrences, options, tableaux de bord prendre en compte les niveaux diffrents d'expertise Au moins : premire utilisation, utilisations occasionnelles, utilisations rptes correction dorthographe reprsentation multiple des concepts associer plusieurs objets de prsentation un concept donn variations sur une forme de base unique possibilit de rsoudre un problme de plusieurs manires respect du rythme de l'utilisateur viter d'imposer un ordre pour les entres d'informations
  • Page 42
  • 42 Adaptabilit - flexibilit Plusieurs faons d effectuer la mme action Exemple copie de fichiers vers une disquette dans lexplorateur glisser - lcher copier - coller (menu, raccourcis clavier, boutons) menu, envoyer vers
  • Page 43
  • 43 Adaptabilit - exprience de lutilisateur
  • Page 44
  • 44 Adaptativit Exemples : Menus partiels qui se dploient compltement au bout de quelques secondes Compltion automatique Contre-exemple : Le trombone L'adaptativit peut tre problmatique : il faut tre trs vigilant
  • Page 45
  • Prvision et rcupration des erreurs Principes : L'utilisateur a le droit l'essai/ erreur L'utilisateur n'est pas l'idiot du village Erreurs = sources principales d'anxit 3 sous-critres prvention/ protection messages d'erreurs rcupration
  • Page 46
  • 46 Protection contre les erreurs Exemple message d'alerte (quitter sans sauver) protger en criture ce qui n'est pas accessible l'utilisateur (label des formulaires...) viter les erreurs ds la saisie minimiser la frappe (listes droulantes, compltion automatique, calendrier) dtecter les erreurs ds la saisie griser les menus non accessibles
  • Page 47
  • 47 Messages d'erreurs Immdiats Comprhensibles Prcis et spcifiques Pas de double ngation, de forme nominale, ni de forme passive Aimables Pas d'injure, ni de termes techniques Constructifs viter les impasses et proposer une sortie Visibles
  • Page 48
  • 48 Messages d'erreurs Mauvais exemples
  • Page 49
  • 49 Correction des erreurs faire La commande annuler Expliquer comment rparer ne pas faire
  • Page 50
  • Rgle de cohrence et d'homognit objectif : rendre l'interface prdictible, mme interface dans le mme contexte facilit l'apprentissage, le reprage rassurer et diminuer le nombre d'erreurs unit de cohrence gnrale : mtaphore monde rel (manipulation directe) conversation (langage de commandes et langage plus ou moins naturel) stabilit de l'cran : charte graphique titres, messages, informations localiss au mme endroit d'un cran l'autre
  • Page 51
  • Homognit dans tout le logiciel mme tche mme suite d'actions identiques mme commande mmes effets choix et prises de dcisions se font de manire identique objet/action action /objet terminologie constante q, logout,., quitter, fermer construction de phrases constantes 51
  • Page 52
  • 52 Homognit
  • Page 53
  • 53 Homognit/cohrence - entre logiciels
  • Page 54
  • Signifiance des codes et dnominations codage : codes numriques unanimit contre eux, dcomposables en units significatives codes mnmoniques : plus faciles retenir codes chromatiques n'utiliser que pour renforcer un codage code iconique facile mmoriser vocateur ? codes graphiques : lgende dnominations se conformer aux usages des oprateurs, de l'entreprise prfrer les verbes aux noms verbaux pour les actions prcision : afficher, voir, imprimer
  • Page 55
  • 55 Signifiance des codes et dnominations ne pas faire
  • Page 56
  • Compatibilit avec les supports papier avec les habitudes des utilisateurs avec l'organisation de l'entreprise avec d'autres logiciels => se conformer aux normes et aux standards (ISO, AFNOR) Ou alors innover Mais radicalement
  • Page 57
  • 57 Compatibilit - exprience de lutilisateur Mtaphores usuelles loupe symbolise : fonction de recherche enveloppe signale : contacter le webmaster par courriel point dinterrogation : aide en ligne maison : lien vers la page d'accueil drapeau : langue de la page en cours ou possibilit de changer de langue Clbres contre-exemples jecter la disquette (vieux Mac) Menu dmarrer pour quitter Windows
  • Page 58
  • Conclusion sur les critres En valuation Art dlicat de lvaluation heuristique valuateurs moyens : subtiles Permet dtablir des rapports valuation sur laspect utilisabilit En conception : les avoir en tte lors de la conception faire des compromis en cas de contradictions en fonction de la tche, de l'activit ou du public cible ne pas introduire de gadget ni multiplier les fonctions tudier de nombreuses interfaces d'un regard critique et piquer les bonnes ides regarder de nombreux guides et critres (Cf. le web) Projet : Faire une inspection heuristiques de votre projet lvaluation
  • Page 59
  • 59 Retenir Les critres (par exemple ceux de lINRIA) Permettent dliminer les erreurs de conception de type amateur Police, soulign, utilisation des couleurs etc. En projet valuation heuristique (inspection avec un jeu de critres) pour ltude de lexistant