Évaluation des logiciels interactifs (1) Cours 3 (partie 1) Méthodes d’Inspection (évaluation sans utilisateur) M2-EIAH/DU-TICE, Paris 6 Elisabeth.Delozanne@upmc.fr http://www.lutes.upmc.fr/delozanne/2008-2009/M2-P6-EIAH-Accueil.htm

Plan du cours Vos questions Cours 3: évaluation des logiciels interactifs (partie 1) Évaluer ? Méthodes d’inspection ? Critères ergonomiques ? Retour sur vos questions Le projet Évaluation de projets existants Préparations des entretiens et des interviews Cours 3 : évaluation des logiciels interactifs (partie 2) Méthodes des tests utilisateurs Quelles méthodes choisir ?

(Rappel) Cours 1 : Facteurs de succès Cycle de conception Conception centrée usager L’analyse des tâches et les analyses en contexte de travail usuel Le prototypage rapide L’évaluation constante Conception itérative La qualité de la programmation

Évaluer ? Qu'est-ce que l'évaluation ? Définition : évaluer = juger Objectivité ??? Référence ? Plusieurs approches : Critères raisonnés, modéles Évaluer quand ? pourquoi ? Moments d'évaluation Objectifs Évaluer quoi ? Variables cibles Évaluer comment ? à quel coût ? Méthodes, techniques Temps, argent Documents préparatoires : E. Brangier, J. Barcenilla, Concevoir un produit facile à utiliser, Ed. organisation, 2003, ch. 5 Références : [Bastien et al 2001] Christian Bastien, Dominique SCAPIN, évaluation des systèmes d’information et critères ergonomiques, in Christophe KOLSKI (Ed.), Environnements évolués et évaluation de l'IHM, Interaction homme-machine pour les systèmes d'information Vol 2, Hermès, 2001, 53-113 OFTA: Michael NAEL, L'évaluation des nouvelles interfaces homme-machine interactives, in Nouvelles Interfaces Homme-Machine, Observatoire Français des Techniques Avancées, Diffusion Lavoisier, Paris Décembre 1996, ISBN 2-906028-04-5, p. 323-340 [Hu et al 2001] Olivier Hu, Philippe Trigano, Stéphane Crozat , Une aide à l’évaluation des logiciels multimédias de formation, in élisabeth delozanne, Pierre Jacoboni (ed), Interaction Homme Machine pour la formation et l’apprentissage humain, numéro spécial de la Revue Sciences et Techniques éducatives, vol 8-n°3-4/2001, Hermès Elisabeth Delozanne, Brigitte Grugeon, Pierre Jacoboni, " Analyses de l’activité et IHM pour l’éducation ", Actes IHM’2002. Références Cf. le cours précédent + • Christelle FARENC, ERGOVAL : une méthode de structuration des règles ergonomiques permettant l’évaluation automatique d’interfaces graphique, Thèse de l’université TOULOUSE 1, Janvier 1997, Chapitre 1, Les méthodes d'évaluation • J. M. Christian BASTIEN, Techniques d'évaluation des systèmes interactifs, cours à l'école d'été Interaction Homme-Machine du GDR-PRC Communication Homme-Machine du CNRS, Marseille-Luminy, juillet 1997 • J. M. BASTIEN, D. SCAPIN, Ergonomic Criteria for the Evaluation of Human-Computer Interaction , rapport technique N°156 de l'INRIA, 81p., Juin 93 • T. Baudel, Limites de l'évaluation Ergonomique pour la Conception de Nouveaux paradigmes d'interface, Journées IHM 96. Texte provocateur. Sujet d'examen de 96. • Stéphanie JEAN, Élisabeth DELOZANNE, Pierre JACOBONI, Brigitte GRUGEON, Conception, réalisation et évaluation d'interfaces en EIAO : l'exemple de PÉPITE, in Environnement Interactifs d'Apprentissage avec Ordinateur, coordonné par M. Baron, P. Mendelsohn, J.-F. Nicaud, Hermès, pp. 37-48, 1997 • B. Senach, Évaluation ergonomique des interfaces Homme-Machine, une revue de la littérature, rapport de recherche N°1180 de l'INRIA, 70 p, 1990 ou Évaluation ergonomique des interfaces Homme-Machine, une revue de la littérature, in J.-C. Sperandio, L'ergonomie dans la conception des projets informatiques, Octares éditions, 1993, p 69-122. •  les chapitres sur l'évaluation et Usability Engeneering dans Caroll, Schneiderman, Preece, Kolski, A Guide to usability Lire le chapitre sur sur GOMS dans Raskin • M. GRISLIN, C. KOLSKI, Évaluation des interfaces homme-machine lors du développement des systèmes interactifs, TSI, vol. 15 n°3/1996, p. 265-296 • H. Van Eylen, G. Hiraclides, GRAAL en quête d'une démarche de développement d'interface utilisateur, Édition Angkor, 1996, 468 p, 290 F • Thése de Sandrine Balbo 1994 (en particulier les chapitres 1, 2, 3 pour un état de l'art en français),

Définitions (début) évaluation en Génie Logiciel système = solution logicielle et matérielle les plans qualité fournissent des métriques pour le respect des normes de programmation (portabilité, maintenance etc.) ne fournissent aucune méthode pour s'assurer de l'utilisabilité évaluation ergonomique système interactif = { utilisateur(s), artefact(s) } s'intéresse à l'efficacité des systèmes humains-machines à l'utilisabilité/utilité du système interactif en GL : évaluer c'est • vérifier un logiciel (s'assurer qu'il correspond aux spécifications issues de la définition des besoins) • valider le logiciel (s'assurer qu'il correspond aux besoins en respectant les contraintes du domaine) ; ici le GL rejoint l'ergonomie en ergonomie : évaluer c'est s'intéresser • à la santé physique, sociale et mentale des utilisateurs de systèmes interactifs • à l'efficacité du couple homme-machine et plus généralement des systèmes hommes-machines (Naël, p. 324) ; ici on rejoint le GL Évaluation très liée à la conception • en GL : documents, plans qualités, méthodes (Merise, OMT, Booch etc.) • en IHM : approche exploratoire (Cf. thèse de Balbo) ou approche ingénierie (prédire, construire, observer). Des tentatives pour définir des méthodes de conception tenant compte des exigences de l'ergonomie. Je ne mentionne pas les évaluations marketing, commerciales etc. qui sortent des préoccupations de ce cours mais peuvent avoir une importance considérable dans certains contextes Evaluer les coûts et bénéfices en termes économiques et sociaux : c’est très difficile de parler en général. Cela dépend de l’application, du contexte institutionnel voir politique. Cela nécessite souvent une étude sur la durée. Efficacité du système humains-machines ? souvent déclinée en utilité du logiciel et son utilisabilité (Senach)

Utilisabilité (rappel) norme ISO 9241-11 (1998) : l’utilisabilité « est le degré selon lequel un produit peut-être utilisé par des utilisateurs identifiés, pour atteindre des buts définis avec efficacité, efficience et satisfaction dans un contexte d’utilisation spécifié ». Bastien Utilisabilité/utilité : qualité ergonomique de l'interface Efficacité : résultats/objectifs Efficience : résultats/moyens

Définitions (fin) Évaluation : processus pour étudier les rapports entre la conception et l'utilisation Évaluation a priori, formative (conception) pour identifier ou prévoir les besoins, les scénarios d’utilisation et les difficultés potentielles ou réelles des utilisateurs pour donner des idées et les évlauer Évaluation a posteriori, sommative (usage) pour caractériser les points forts et les points faibles d'un système interactif pour préparer les évolutions

Moments & Objectifs d'évaluation en cours de conception analyse de besoins, compréhension des situations, étude de l’existant sélection d'alternatives de conception conception itérative de maquettes/prototypes faisabilité et acceptabilité en cours de réalisation détection et correction de défauts, contrôle qualité, test de performance avant diffusion tests de déverminage, d'acceptabilité, vérification des performances intégration dans l’activité en cours de diffusion satisfaction, améliorations, incidents, support à l'utilisateur, maintenance, image du produit avant d'acheter comparaison de logiciels : technique/utilisabilité Pourquoi ? Quand ? •  De nombreuses classifications des méthodes d'évaluation sont discutées dans la littérature - moments de l'évaluation - évaluation formative (en cours de conception) et sommative (en phase d'exploitation) - objectifs : détecter des erreurs, certifier, choisir entre des alternatives de conception, entre des produits - discipline d'origine de la méthode (psychologie cognitive, psychologie sociale, ingénierie, marketing) - pays d'origine (Amérique du Nord, Europe, autres ???) - présence ou non d'un système (en conception ou déjà existant), - présence ou non d'utilisateurs, utilisation réelle (in the Nature, in the field) ou en laboratoire (in the zoo, in the lab) etc... Lire la présentation de C. Farenc (chapitre 1) qui montre des schémas qui résument cela très bien Dans ce cours nous nous intéressons surtout à l’évaluation comme support à l'équipe de conception, donc en cours de conception.

Évaluation et cycle de conception Landay 2002

Évaluer quoi ? Les dimensions d'évaluation dépendent des objectifs et du contexte utilité la fiabilité, la qualité technique les temps de réponse utilisabilité la facilité d'apprentissage, la flexibilité, la robustesse l’utilisation des fonctions la tolérance aux erreurs la qualité de la documentation et de l’assistance la logique du travail les opinions ou les attitudes - objet de l'évaluation : les caractéristiques du système (fiabilité, qualité technique), interaction, influence de l'interaction sur l'usager, les coûts et bénéfices En cours de conception, l'évaluation est souvent multidimensionnelle. On s'intéressera aussi bien - au niveau conceptuel à la cohérence des fonctions et de l'interaction avec les habitudes de l'utilisateur - au niveau physique : étude des gestes nécessaires pour réaliser une tâche donnée.

Évaluer comment ? Sans utilisateurs : approche analytique a priori, ne nécessitant pas un système fondée sur des modèles implicites (méthodes d’inspection, « low  cost ») explicites (formels, approches automatiques) Avec utilisateurs : approche expérimentale (empirique) nécessitant un système (ou un prototype) recueil de données comportementales auprès d'utilisateurs (en situation réelle ou en laboratoire) Méthode d'évaluation coopérative (cours 3.2) Tests d'utilisabilité Évaluation automatique : Cf. Kolski, Farenc - discipline d'origine de la méthode (psychologie cognitive, psychologie sociale, ingénierie, marketing) - pays d'origine (Amérique du Nord, Europe, autres ???) - présence ou non d'un système (en conception ou déjà existant), - présence ou non d'utilisateurs, utilisation réelle (in the Nature, in the field) ou en laboratoire (in the zoo, in the lab) etc... Nael 1996, p. 327 “Prendre l’avis des utilisateurs peut sembler la méthode la plus simple, la plus rapide et la moins coûteuse pour évaluer une interface homme-machine. Quelques difficultés en limitent néamoins la portée : Les avis sont marqués par la subjectivité et l’histoire personnelle ; cela n’enlève rien à leur intérêt ou à leur signification, mais il faut les prendre en tant que tels et relativement à la population d’ensemble des utilisateurs. Ils sont influencés par des facteurs extrinsèques aux caractéristiques ergonomiques, tels que la mode ou des motivations d’achats d’équipements stimulés par la publicité etc. (…) Ces avis ne sont réellement pertinents que s’ils sont exprimés à l’occasion d’une mise en situation d’utilisation d’une interface fiable et don’t l’interactivité est complète pour les fonctions à évaluer, ce qui implique que le système est en partie réalisé ou maquetté de façon très réaliste (High Fidelity Protypes).”

Évaluer à quel prix ? Temps, argent, compétences Méthodes « low cost » Culture de l’évaluation chez les informaticiens Évitent les gros problèmes, pas les problèmes subtils Informelles, qualitatives, évaluation formative Méthodes scientifiques et rigoureuses Gros projets, projets à risques, recherche Informations fiables, quantitatives Quel retour sur investissement pour les études d’utilisabilité ? (ROI)

Plan Rappels Évaluer ? Méthodes d’inspection Critères d’évaluation heuristique/ergonomique Tests utilisateurs (cours 3.2) Choisir une méthode (cours 3.2)

Approches analytiques l'évaluation de l'IHM se fait a priori par comparaison avec un "modèle de référence" modèle qui n'est pas souvent formalisé ni explicité on distingue des approches informelles Méthodes d’inspection (présentées ici) Méthodes « low cost » des approches formelles (ou semi-formelles) (non étudiées ici) modèles prédictifs analyse de tâches (KLM et GOMS) modèle linguistique (ALG et CLG) modèle de complexité cognitive (Kieras et Polson) modèles de qualité de l'interface approche cognitive recherche des qualités optimales approches informelles : intégrées au cycle de vie du logiciel Très utilisées par les praticiens Méthodes d’inspection : étudier le logiciel à l’aide des guides de style, normes et heuristiques. Cf prix sourire pris citron en O2 et le cours 2 Cf aussi cours 5 sur les techniques de conceptions approches formelles recherche pour concevoir des systèmes d'évaluation automatique d'interfaces de conception automatique Surtout utilisées dans les centres de recherches

Les méthodes d’inspection Inventaire Les jugements d’experts Les grilles d’évaluation Les revues de conception (design walkthrough) S’appuient sur Des scénarios Des heuristiques, des recommandations ou des critères Avantages Pas cher et rapides (de l’ordre d’une journée) Faciles à utiliser (détecter les erreurs flagrantes en 2 à 4 h) Inconvénients Ne permettent pas de détecter des erreurs subtiles (liées à l'annalyse du travail, au contexte)

Jugements d'experts Diagnostic a priori ou a posteriori un ou des experts donnent leur avis sur l'interface (ou le projet) sous la forme d'un rapport ou d'un formulaire Fondements Modèle de l'interface non formalisé (ni même explicité) Heuristiques, recommandations ou critères ergonomiques Résultats Points positifs et négatifs et leur pondération Prévision de difficultés d’utilisation probables Informations sur les fonctionnements humains insuffisamment pris en compte Propositions d’améliorations argumentées et pondérées • Peut être utilisé aussi a posteriori (moins fréquent) • Notre expérience sur des projets sans gros moyens : les étudiants (ou les collègues) ont une approche cassez moi-ça très efficace pour détecter tous les petits problèmes qui ont échappé à la vigilance du concepteur solitaire qui n'a pas les moyens de se payer une équipe. Efficace et pas cher. Pensez y. Exercez-vous à devenir expert en évaluation d ’interface : d'où l'intérêt d'une séance collective évaluation - étude de logiciels et de leur utilisabilité - rédaction d ’un rapport d ’évaluation - présentation au groupe des conclusions

Jugement d’experts (Inspection heuristique) choisir au moins deux experts (domaine et utilisabilité) technique 1: fondée sur des scénarios jouer un des scénarios technique 2 : fondée sur des critères ou des guides étude systématique de tous les critères sur chaque écran Procédure commune noter tous les problèmes rencontrés analyser les causes proposer des solutions rédiger un rapport Heuristic review avec deux experts on trouve 90 % des problèmes d ’utilisabilité (Poulain et Valot 1996)

Jugements d’experts : ++/-- Biais : Experts : vue plus générale, sources potentielles de dysfonctionnement Novices : difficultés matérielles et conceptuelles de bas niveau Biais de focalisation fonctionnement particulier ( e.g. d'utilisateurs novices), sur les "marottes" de l'expert domaine d'expertise (domaine, IHM, graphisme) Intérêt Pas cher, rapide et efficace, peut intervenir très tôt dans le cycle de conception Plusieurs experts

Pourquoi plusieurs experts ? Un expert ne détecte pas tous les problèmes Les bons évaluateurs trouvent les problèmes faciles et les problèmes difficiles Canny 04

Jugements d’experts : études % Problèmes détectés 100 100 100                                              90 90 90                   80 80 80       70 70 70                      60 60 60             50 50 50 % moyen des problèmes ergonomiques détectés en fonction du nombre d’évaluateurs et de leur qualification Étude menée par Nielsen 1993, citée par Nael 1996  D'après M. Naël dans l'OFTA (p. 329) pour détecter 80 % des problèmes il faut - au moins 3 experts qui donnent leur avis d'abord de façon indépendante, puis contradictoire ou coordonnée (si possible) - ergonomes qualifiés (qui comprend les novices du domaine) et experts du domaine d'application (au moins 3 années d'expérience ! étudiants s'abstenir) - disposant du système (ou d ’une maquette) ou de descriptions détaillées de scénarios d'utilisation du système       40 40 40    Évaluateurs spécialistes du domaine  Évaluateurs généralistes  Évaluateurs novices Évaluateurs spécialistes du domaine  Évaluateurs généralistes  Évaluateurs novices Évaluateurs spécialistes du domaine  Évaluateurs généralistes  Évaluateurs novices    30 30 30 20 20 20    Nombre d ’évaluateurs 10 10 10 1 1 1 2 2 2 3 3 3 4 4 4 5 5 5 6 6 6 7 7 7 8 8 8 9 9 9 10 10 10 11 11 11 12 12 12 13 13 13 20 20 20

ROI (Return on investment) problems found benefits / cost Canny 2004

Organiser des expertises Conseils : Au moins trois experts : avis indépendants puis coordonnés, voir contradictoires Ergonomes qualifiés d’au moins trois ans d’expérience Leur donner des scénarios d’utilisation et une description de la population des futurs utilisateurs Attention Ne remplacent pas les utilisateurs Notre expérience sur des projets sans gros moyens : les étudiants (ou les collègues) ont une approche cassez moi-ça très efficace pour détecter tous les petits problèmes qui ont échappé à la vigilance du concepteur solitaire qui n'a pas les moyens de se payer une équipe d’ergonome. Efficace et pas cher. Pensez y. Comme toutes les méthodes discount : cela a ses limites mais cela dépanne et évite un certains nombre de difficultés. Mieux vaut une méthodes discount que pas de méthodes du tout. En fonction des moyens dont on dispose et en l’absence d’ergonome patenté on peut se comprter en acteur ergonomique (Rabardel 1998) Exercez-vous à devenir expert en évaluation d ’interface, cette expérience vous sera utile dans votre carrière de concepteur ou de chercheur

Grilles d'évaluation principes Évaluation d'après une liste des propriétés d'une bonne interface Notation systématique sur une échelle de valeur (3 à 7 points) problèmes état de l'art en ergonomie, diversité des systèmes => grille spécifique à une application ? interprétation, niveau d'expertise de l'évaluateur, cohérence des réponses notation hétérogénéité de ce qui est noté : règle des 80/20 (ou 90/10) ne permet pas de comprendre la nature du problème rencontré de hiérarchiser les difficultés Avantages : utile pour faire des comparaisons Gros problème: écrasement des choses importantes et non importantes Méthode sommaire (à mon avis) Permet cependant de détacher des points forts et des points faibles Ex : la méthode EMPI (Hu et al.) pour l’évaluation de logiciels éducatifs La grille d’évaluation RIP du ministère de l’éducation nationale De nombreuses grilles d’évaluation des sites web

Revue de conception (Design Walkthrough ) Examen du produit par des pairs (entre 3 et 7) en cours de conception objectif : identifier des problèmes (pas les résoudre) durée : limitée à 1 h (fatigue) 4 rôles : Présentateur : déroule un scénario Scribe : note tous les commentaires Modérateur : centre la discussion sur l'utilisation veille au respect de l'horaire Observateurs : prennent le rôle de l'utilisateur, posent des questions, font des remarques ou critiques (constructives) sur l'utilisation surtout un outil de conception (évaluation formative) vient du génie logiciel (Yourdon 79) important que les gens aient la même position hiérarchique Très très utile en conception Cf. le polycopié de Wendy MacKay à l'école d'été IHM 97 et cours 2 et 8

Plan Rappels Évaluer ? Méthodes d’inspection Critères d’évaluation heuristique/ergonomique Tests utilisateurs

Critères de l’INRIA (Bastien et Scapin) Structuration des activités et guidage Minimiser la charge de travail Contrôle entre les mains de l'utilisateur Adaptabilité Prévision et récupération des erreurs Compatibilité Signifiance des codes et dénomination Cohérence et homogénéité À l’origine de la norme Z67-133-1, Décembre 1991, Evaluation des produits logiciels : Partie 1, Définition des critères ergonomiques de conception et d’évaluation des interfaces utilisateurs. http://www.ergolab.net/articles/les-criteres-ergonomiques-partie1.html#4 Inscrire dans le plan qualité, dans les dossiers de conception les critères que l'on adopte pour la conception; servent à la conception et à l'évaluation en France sont très souvent utilisés - les 7 règles d'or (Joëlle Coutaz, 1990) - les critères de l'INRIA (Scapin, Bastien) et leur adaptation aux sites web (http://www.lergonome.org/ ) - les propriétés ergonomiques des interfaces (Coutaz 1998) - les 10 critères de l'OFTA (p 18) Références : Je choisis les critères de l'INRIA (Bastien et Scapin 1993] Voir aussi sur le web tout un tas de guides de style Par exemple : Le site d’IBM : http://www.ibm.com/IBM/HCI/guidelines Un autre celui du célèbre Nielsen : http://www.useit.com Yale C/AIM Web Style Guide Lynch & Horton) : http://info.med.yale.edu/caim/manual/contents.html Sun’s Guide to Web Style : http://www.sun.com/styleguide/ Un dernier en français et avec des exemples en plus : http://www.auditweb.net/conseils/fondamentaux.html Vous avez aussi des études rédigées sur le site http://www.lergonome.org/ Normes et standards : Norme ISO, Norme AFNOR

Utilisation des critères Pour l’évaluation Évaluation heuristique Pour la conception Inscrire les critères d’évaluation dans les dossiers de conception Guide pour l’équipe de conception Foultitude de critères normes et recommandations Parfois contradictoires Pour éveiller votre attention

Structuration des activités et guidage objectif : faciliter l'apprentissage par l'action, l'orientation, les prises de décisions techniques des roulettes de sécurité (étayage, scaffolding), incitation (prompting, affordance) structure de contexte déterminée par les actions possibles granularité des commandes format d'écran organisation spatiale des données importantes groupement format de présentation (titre, courbe, couleur, encadrés, justification) structuration des menus (préférez la largeur) To afford : inciter, suciter Définition : c’est l’ensemble des moyens mis en œuvre pour conseiller, orienter, informer et conduire l’utilisateur lors de ses interactions avec l’ordinateur (messages, alarmes, labels, etc.) 4 sous-critères participent au guidage Incitation fournir le format adéquat et les valeurs acceptables afficher les unités de mesures fournir un label pour chaque champ de données Groupement/Distinction des items (organisation visuelle) grouper les options de menus en fonction des objets sur lesquels elles s'appliquent distinguer visuellement les aires ayant des fonctions différentes distinguer visuellement entre les labels et les champs d'entrée Feedback immédiat en cas d'interruption, fournir un message indiquant le retour à l'état précédent en cas de traitement long, informer que les traitements sont en cours Lisibilité centrer les titres Exemples et contre exemples

Guidage : étayage Deux aspects Aider l'utilisateur débutant à se repérer et à se construire une logique d'utilisation Permettre à un utilisateur expérimenter de gagner du temps Exemples : Les informations au survol Les assistants d'installation Installation recommandée Installation personnalisée Le compagnon office (masquer) Les accès rapides et raccourcis clavier

Guidage - incitation Exemples Contre-exemple certains jeux d’aventures

Guidage - groupement/distinction entre items Contre-exemple Exemple

Retours d'informations Objectif : informer pour permettre à l'utilisateur d'évaluer son action (modèle de Norman) pour rassurer (temps de réponse long) pour réduire la charge cognitive indication du contexte de travail (fenêtre courante, états, curseurs actifs) représentation des déplacements présentation des options (menus fantômes, surgissant, pop-up) Toute action de l'utilisateur doit être suivie d'une modification perceptible de l'interface Élémentaire non ? Mais super important

Guidage – retour d’information Contre-exemple À faire De 2 à 6 secondes : icône d'attente De 6 à 30 secondes : barre d'avancement Plus de 30 secondes : Barre d'avancement + affichage de l'opération en cours

Guidage - lisibilité À faire Objectif : informer pour permettre à l'utilisateur d'évaluer son action pour rassurer (temps de réponse long) À ne pas faire Définition du guidage : c’est l’ensemble des moyens mis en œuvre pour conseiller, o, Objectif : informer pour permettre à l'utilisateur d'évaluer son action (modèle de Norman) pour rassurer (temps de réponse long) pour réduire la charge cognitive indication du contexte de travail (fenêtre courante, états, curseurs actifs) OBJECTIF : INFORMER POUR PERMETTRE À L'UTILISATEUR D'ÉVALUER SON ACTION POUR RASSURER (TEMPS DE RÉPONSE LONG)

Lisibilité : Polices et style Jamais de souligné : exemple exemple Pas de textes longs en majuscules ni en italique : les majuscules rendent le texte plus difficile à lire mais facilitent l'identification d'un élément EXEMPLE EXEMPLE exemple exemple Affichage à l'écran : Police sans sérif (sans empattement) Exemples : Arial, Helvetica, Verdana, Comic Contre-exemple : Times

Lisibilité : Format d'affichage Les nombres : Aligner les entiers à droite Aligner les valeurs décimales sur la virgule Découper les nombres par groupe de 3 ou 4 chiffres Les listes alphabétiques alignées à gauche Labels et champs alignés à gauche Quand les labels sont de même longueur Labels alignés à droite et champs alignés à gauche Quand longueurs différentes

Lisibilité : Format

Lisibilité : Les couleurs Les couleurs sont codées par trois attributs (HSV Hue, Saturation, Value) Teinte : Longueur d’onde principale Saturation : Spectre de la couleur Bande étroite : couleur saturée Bande large : pastels Intensité : Degré de réflexion de la lumière ou clarté

Lisibilité : couleurs Tout le monde ne perçoit pas les couleurs de la même façon Utiliser la couleur et un autre attribut pour coder une information ou pour mettre en évidence Respecter le sens habituel donné aux couleurs dépend des pays des domaines Ex : le rouge signifie Finance : perte Chimie : chaud Signalisation : interdiction Cartographie : nationale Sécurité : danger Electricité : marche Circulation : arrêt

Les couleurs : recommandations Codage couleur Associer à chaque couleur une signification précise et uniforme Minimiser le nombre de couleurs Pour un objet donné, le nombre de couleurs utilisés doit être nettement inférieur au nombre de ses attributs Utiliser la couleur pour mettre en valeur telle ou telle partie de l’écran (en particulier une information importante) une neutre et claire pour le fond d’écran des couleurs très contrastées pour exprimer une différence (et inversement) Principe du double codage : couleur et autre 8% des hommes sont daltoniens On

Couleurs à éviter Caractères : Bleu, rouge, violet (peu importe la couleur du fond). Couples : Fond/caractères Ne jamais utiliser ensemble Noir et bleu Rouge avec bleu Jaune avec violet Jaune avec vert Ces couples sont reconnus comme causant une sollicitation excessive de la rétine provoquant de l'inconfort qui peut s'aggraver avec le vieillissement. Fond : Les teintes de rouge et de jaune et ses dérivés (par ex. : le vert, l'orange...) Lisez-moi Lisez-moi Lisez-moi Lisez-moi Lisez-moi Lisez-moi Lisez-moi Lisez-moi Lisez-moi Lisez-moi

Couleurs conseillées Choix 1 Fond : gris pâle, beige mais pas blanc Caractères : noir, magenta, vert Choix 2: Fond bleu Caractères : Blanc, or, vert Cyan, jaune, lavande Or, magenta Faites des tests !!!

Méthode de choix des couleurs Composer votre interface sans couleur La couleur est un plus Un codage coloré ne se suffit pas à lui-même Choix des couleurs Identifier les objets à afficher Regrouper ces objets par niveau de visibilité Choisir les composantes de la couleur Teinte : connotation Saturation et intensité : visibilité Vérifier les compatibilités Prototyper le résultat obtenu

Couleurs 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 Noël Cours en ligne sur les couleurs http://membres.lycos.fr/interaction/ http://www.vrrh.ulaval.ca/sante/couleurs.html http://interface.free.fr/Interface/Couleur.html http://www.arnaudfrichphoto.com/gestion-de-la-couleur/couleurs.htm On

Charge de travail Définition : Le critère charge de travail concerne l’ensemble des éléments de l’interface qui ont un rôle dans la réduction de la charge perceptive ou mnésique (mnème = unité d’information) des utilisateurs et dans l’augmentation de l’efficacité du dialogue 2 sous-critères brièveté concision actions minimales densité informationnelle Brièveté utiliser des abréviations ou des codes mnémotechiques pour entrer des codes supérieurs à 4 ou 5 caractères minimiser le nombre d'étapes dans la sélection des menus afficher des valeurs par défaut ne jamais demander à l'utilisateur des données qui peuvent être déduites par l'ordinateur Densité informationnelle éviter à l'utilisateur d'avoir à se rappeler des données d'une page écran à l'autre afficher seulement les informations nécessaires utiliser le minimum de quantificateurs

Règle de concision objectif : limiter la charge de travail compromis entre le bref et l'expressif pas de gadgets inutiles, limiter les fonctionnalités éviter les surcharges d'informations (limiter la densité) réduire la charge mnésique et le nombre d'actions physiques abréviations (utilisateurs expérimentés) compréhensibles dérivables selon des règles précises (commande I ou P) macro-commandes flexibilité abstraction minimiser les entrées et plus généralement les actions couper-coller valeurs par défaut (dynamiques ou préférences) défaire-repéter abréviations pour les entrées: - caractère spécial (pomme, commande, crtl, alt, escape) suivi de la première lettre de la commande - suppression des voyelles - troncature maximale, troncature deux lettres non ambiguës importance des valeurs par défaut qui sont très rarement modifiées par les utilisateurs minimiser les frappes de l'utilisateur Exemple dans les questionnaires : choix multiple, dans des listes etc. conte exemple : les logiciels d’enseignement ne peuvent se contenter de QCM important travail sur la visualisation d'informations

Charge de travail - brièveté À faire À ne pas faire

Charge de travail - actions minimales À ne pas faire

Charge de travail - densité informationnelle À faire À ne pas faire

Charge de travail-densité

Règle du contrôle à l'utilisateur Objectif : l'interface doit apparaître comme étant sous le contrôle de l'utilisateur le système n'exécute des opérations qu'à la suite d'actions explicites de l'utilisateur Exemple : ne pas changer d'écran sans demande explicite prévenir si changement de contrôle prévoir pour les experts la possibilité d'anticiper, de sauter des étapes L'utilisateur contrôle l'interaction mais aussi le rythme de l'interaction et aussi l'activité -Attention aux analyses de tâche qui contraignent l'utilisateur dans une démarche : contre exemple : obliger les utilisateurs à saisir des données dans un certain ordre (des logiciels de saisie de notes) - attention aux actions automatiques (par exemple enregistrement automatique)

Contrôle explicite Définition : ce critère regroupe 2 aspects différents la prise en compte par le système des actions des utilisateurs le contrôle des utilisateurs sur le traitement de leurs actions 2 sous-critères actions explicites contrôle utilisateur Actions explicites requérir une action explicite de validation des données entrées par l'utilisateur aucun traitement ne doit être la conséquence d'une autre action prévoir une action de validation de la sélection d'un item par pointage Contrôle utilisateur autoriser les utilisateurs à contrôler le rythme de leurs entrées ne pas passer d'une page écran à une autre sans contrôle utilisateur autoriser l'utilisateur à interrompre un traitement à tout moment fournir la possibilité de revenir en arrière

Contrôle explicite - actions explicites À faire Indiquer les champs obligatoires dans un formulaire À ne pas faire 

Contrôle explicite - contrôle utilisateur À faire À ne pas faire Impossibilité d’ annuler Prise de contrôle intempestive

Adaptabilité Définition : Un système est adaptatif quand il est capable de réagir selon le contexte, et selon les besoins et préférences des utilisateurs Un système est adaptable quand il permet à l'utilisateur de le paramétrer 2 sous-critères Flexibilité (adaptabilité) Prise en compte de l’expérience de l’utilisateur (adaptativité) Flexibilité permettre à l'utilisateur de désactiver temporairement des affichages inutiles laisser l'utilisateur donner des noms aux champs de données qu'ils créent ne pas surcontraindre l'ordre d'entrées des données Prise en compte de l'expérience de l'utilisateur fournir des raccourcis claviers et la possibilité d'en créer autoriser des entrées pas à pas ou multiple fournir plusieurs niveaux de détails dans l'explication des erreurs

Flexibilité Objectif : prendre en compte la diversité des utilisateurs et des situations Exemples : préférences, options, tableaux de bord prendre en compte les niveaux différents d'expertise Au moins : première utilisation, utilisations occasionnelles, utilisation répètées correction d’orthographe valeurs par défaut parmi une liste à sélectionner représentation multiple des concepts associer plusieurs objets de présentation à un concept donné variations sur une forme de base unique possibilité de résoudre un problème de plusieurs manières respect du rythme de l'utilisateur éviter d'imposer un ordre pour les entrées d'informations Exemple de système adaptatif : le système détecte des séquences de tâches répétitives et propose à l'utilisateur de les prendre en charge (migration de tâches répétitives) Attention : les interfaces adaptatives sont quelques fois utiles mais souvent très mal perçues par les utilisateurs par ce que l'utilisateur ne peut plus : - ni prévoir le comportement du système - ni contrôler l'interaction Interface adaptative : planche savonneuse ; faire des tests d'utilisabilité Structuration de la tâche : les utilisateurs surtout expérimentés supportent très mal qu'on les contraignent à résoudre un problème d'une façon qui n'est pas la leur Représentation multiple : donner un exemple dans son contexte

Adaptabilité - flexibilité Plusieurs façons d ’effectuer la même action Exemple copie de fichiers vers une disquette dans l’explorateur glisser - lâcher copier - coller (menu, raccourcis clavier, boutons) menu, envoyer vers

Adaptabilité - expérience de l’utilisateur

Adaptativité Exemples : Menus partiels qui se déploient complètement au bout de quelques secondes Complétion automatique Contre-exemple : Le trombone L'adaptativité peut être problèmatique : il faut être très vigilant

Prévisions et récupérations des erreurs Principes : Ll'utilisateur a le droit à l'essai/ erreur L'utilisateur n'est pas l'idiot du village Sources principales d'anxièté dans l'utilisation de logiciels interactifs 3 sous-critères Prévention/ protection messages d'erreurs récupération Attention à "l'approche défensive de la conception" - les concepteurs pensent que le système sait mieux que l'utilisateur ce qu'il faut faire et essaie de lui imposer ses solutions, de l'empêcher de faire des fautes - l'utilisateur n'est pas l'idiot du village Prévenir l'utilisateur au fur et à mesure que des problèmes sont détectés mais ni plus ni moins Laisser la possibilité à l'utilisateur de corriger, d'infléchir, d'adapter sa stratégie à l'état courant (évidemment on ne parle pas ici de procédure d'urgence dans des situations à haut risque)

Protection contre les erreurs Exemple message d'alerte (quitter sans sauver) protéger en écriture ce qui n'est pas accessible à l'utilisateur (label des formulaires...) éviter les erreurs dès la saisie (listes déroulantes, complétion automatique) détecter les erreurs dès la saisie lors des saisies minimiser la frappe griser les menus non accessibles

Messages d'erreurs Immédiat Compréhensibles Précis et spécifiques Pas de double négation, de forme nominale, ni de forme passive Aimables Pas d'injure, ni de termes techniques Constructifs Éviter les impasses et proposer une sortie Visibles

Messages d'erreurs Mauvais exemples

Correction des erreurs À faire La commande annuler Expliquer comment réparer À ne pas faire D’après Jean-yves Antoine, Université de Tours

Règle de cohérence et d'homogénéité objectif : rendre l'interface prédictible, même interface dans le même contexte facilité l'apprentissage, le repèrage Rassurer et diminuer le nombre d'erreurs choix d'une métaphore d'interaction : unité de cohérence générale monde réel (manipulation directe) conversation (langage de commandes et LN) pour une même tâche : suite d'actions identiques stabilité de l'écran : charte graphique titres, messages, informations localisés au même endroit d'un écran à l'autre choix et prises de décisions se font de manière identique Objet/action terminologie constante q, logout, ., quitter, fermer construction de phrases constantes Prédictibilité : l'utilisateur prévoit pour un état donné, l'effet d'une action ou d'une suite d'actions ; facilite la mémorisation, l'apprentissage, la planification car cela diminue la distance d'exécution et la distance d'évaluation (au niveau articulatoire) (modèle de Norman) Métaphore d'interaction Toutes les interfaces graphiques mélangent les deux métaphores. Une heuristique de choix : je sais faire : je fais (manipulation directe) je ne sais pas faire : je fais faire (langage de commande, menu) Le choix dépend donc du savoir-faire de l'utilisateur Charte graphique l'aspect général des fenêtres et de leur décoration est dessiné par un graphiste et les développeurs doivent utiliser uniquement ces widgets (exemple des cédéroms) Cohérence : interne : lexicale, syntaxique, sémantique externe : conformité aux normes, à l'expérience de l'utilisateur (ex. utilisation du rouge) Exemples et Contre-exemples de cohérence et d'homogéneité :

Homogéneité

Homogénéité/cohérence - entre logiciels

Signifiance des codes et dénominations codage : codes numériques unanimité contre eux, décomposables en unités significatives codes mnémoniques : plus faciles à retenir codes chromatiques à n'utiliser que pour renforcer un codage code iconique facile à mémoriser évocateur ? codes graphiques dénominations se conformer aux usages des opérateurs, de l'entreprise précision : afficher, voir, imprimer préférer les verbes aux noms verbaux pour les actions Cf. Kolski Utilisation des couleurs - codage : Cf. la feuille polycopiée jointe sur l'utilisation des couleurs - attention à l'"effet arbre de Noël" : les débutants ont tendance à mettre beaucoup trop de couleurs qui flashent Sur ce point faire appel à des graphistes : c'est aussi un métier, et on voit la différence

Signifiance des codes et dénominations À ne pas faire

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

Compatibilité - expérience de l’utilisateur Métaphores usuelles loupe symbolise : fonction de recherche enveloppe signale : contacter le webmaster par courriel point d’interrogation : aide en ligne  maison : lien vers la page d'accueil  drapeau : langue de la page en cours ou possibilité de changer de langue Célèbres contre-exemples Éjecter la disquette (vieux Mac) Menu démarrer pour quitter Windows

Conclusion sur les critères En évaluation Art délicat de l’évaluation heuristique Évaluateurs moyens : subtiles Permet d’établir des rapports évaluation sur l’aspect utilisabilité En conception : Très utile de les avoir en tête lors de la conception faire des compromis entre différentes recommandations contradictoires en fonction de la tâche, de l'activité ou du public cible mais ne pas introduire de gadget ni multiplier les fonctions étudier de nombreuses interfaces d'un regard critique et piquer les bonnes idées regarder de nombreux guides et critères (Cf. le web)

Sitographie (1) Critères : http://www.ergolab.net http://www.lergonome.org http://www.univ-pau.fr/~lompre/ http://www.useit.com/ http://www.usableweb.com/ http://www.auditweb.net/conseils/ http://www.iw.com Guides de style http://www.dsi.cnrs.fr/bureau_qualite/ergonomie/documentation/Guidergoweb2005.pdf

Références & Bibliographie (1) Ce cours s’inspire principalement : Du cours et des TP sur la conception participative de Wendy Mackay à la conférence IHM’2002, Poitiers, Novembre 2002 Du cours de John Canny (Berkeley), Alain Giboin(Sophia-Antipolis), Jean-yves Antoine (Blois) Des tutoriels « Design and Rapid Evaluation of usable Web sites » organisé par Gene Lynch et «Scenario Based Usability Engineering » organisé par John M. Caroll et Mary B. Rosson à la conférence CHI’2000 en avril 2000 à la Haye [Bastien et al. 2001] Christian Bastien, Dominique SCAPIN, évaluation des systèmes d’information et critères ergonomiques, in Christophe KOLSKI (Ed.), Environnements évolués et évaluation de l'IHM, Interaction homme-machine pour les systèmes d'information Vol 2, Hermès, 2001, 53-113 [Drouin et al. 2001] Annie Drouin, Annette Valentin, Jean Vanderdonckt, Les apports de l’ergonomie à l’analyse et à la conception des systèmes d’information, in Christophe KOLSKI, (ed.), Analyse et conception de l'IHM, Interaction homme-machine pour les systèmes d'information Vol 1, chapitre 2, Hermès, 2001, 250 p, ISBN 2-7462-0239-5, p. 51-83

Références & Bibliographie (2) [Hu et al 2001] Olivier Hu, Philippe Trigano, Stéphane Crozat , Une aide à l’évaluation des logiciels multimédias de formation, in Elisabeth delozanne, Pierre Jacoboni (ed), Interaction Homme Machine pour la formation et l’apprentissage humain, numéro spécial de la Revue Sciences et Techniques éducatives, vol 8-n°3-4/2001, Hermès [Nielsen 2000], Jakob Nielsen, Conception de sites Web, l'art de la simplicité, Campus Press France, 2000, 385 p., 249 F, ISBN 2-7440-0887-7 [Bastien 1993] J. M. BASTIEN, D. SCAPIN, Ergonomic Criteria for the Evaluation of Human-Computer Interaction , rapport technique N°156 de l'INRIA, 81p., Juin 93 OFTA: Michael NAEL, L'évaluation des nouvelles interfaces homme-machine interactives, in Nouvelles Interfaces Homme-Machine, Observatoire Français des Techniques Avancées, Diffusion Lavoisier, Paris Décembre 1996, ISBN 2-906028-04-5, p. 323-340 B. Senach, Évaluation ergonomique des interfaces Homme-Machine, une revue de la littérature, rapport de recherche N°1180 de l'INRIA, 70 p, 1990 ou Évaluation ergonomique des interfaces Homme-Machine, une revue de la littérature, in J.-C. Sperandio, L'ergonomie dans la conception des projets informatiques, Octares éditions, 1993, p 69-122.

Orientation « professionnels » Design Patterns http://www.designofsites.com/pb/register.html http://www.welie.com/patterns/ Brangier E., Barcenilla J., Concevoir un produit facile à utiliser : Adapter les technologies à l’homme, Editions d’organisation, 2003. (chapitre 5)

Retenir Les différentes méthodes d’évaluation sans utilisateurs Jugement d’experts Inspection heuristique (critères) Revue de conception (scénarios) Au moins un jeu de critères ergonomiques Par exemple ceux de l’INRIA Exercez-vous à étudier les interfaces que vous utilisez du point de vue utilisabilité et faites-vous des catalogues

Take home messages Méthodes d’évaluation sans utilisateurs Indispensables en cours de conception évaluer les maquettes et prototypes Rapides, pas chères et efficaces Permettent d’éliminer les erreurs de conception de type « amateur » En projet Évaluation heuristique (inspection avec un jeu de critères) Revue de conception (scénarios) Méthodes d’évaluation avec utilisateurs Indispensables pour les problèmes liés au domaine, à l’activité, aux usages