Directives (Guidelines) Ergonomie des IHM Module IHM, ESSI Alain GIBOIN (INRIA) Directives (Guidelines)

Directives (Guidelines) Terminologie Directive, indication d'une politique à suivre. [Harrap's Shorter] Ligne directrice Principe directeur Recommandation Norme Propriété Critère ... Directive (1890) Surtout plur. Indication, ligne de conduite donnée par une autorité (politique, militaire, religieuse). V. instruction, ordre. [Petit Robert] (v. 1974) Plur. Techn. Marche à suivre comportant souvent des indications chiffrées. [Petit Robert]

Directives Exemples nombreux Rappel (cf. cours L. Nigay) : Propriétés de Coutaz Directives « moralisatrices » Guides de style des constructeurs Normes ISO, etc. Heuristiques de Nielsen Critères ergonomiques de Scapin et Bastien Principes ergonomiques de Crampes Directives de Dumas Directives de C. Marlin Brown

Directives Propriétés de Coutaz Utilisabilité = Souplesse + Robustesse Atteignabilité Non-préemption Préemption globale Préemption locale Préemption par un utilisateur de ressources partagées entre utilisateurs Interaction multifilaire Interaction multifilaire parallèle Interaction multifilaire entrelacée Multiplicité du rendu (représentation multiple d’un même concept) Réutilisabilité des données d ’entrée et de sortie Adaptabilité Adaptivité Plasticité Migrabilité de tâche CARE1 (multimodalité) CARE (collecticiel) Appliqué aux rôles des acteurs d’un collecticiel Appliqué aux moyens technologiques pour collaborer Observabilité Observabilité publiée Réciprocité Réflexivité Insistance Honnêteté / Honnêteté sociale Curabilité Prévisibilité Tolérance du rythme Viscosité Rejouabilité Révisabilité 1 CARE = Complémentarité / Assignation / Redondance / Équivalence

Directives Directives « moralisatrices » Bad Human Factors Designs Interface Hall of Shame

Directives Guides de style des constructeurs Directives Macintosh/Microsoft/IBM/OSF… OSF = Open Science Foundation

Directives Normes ISO d’utilisabilité Normes relatives à : 1. L’utilisation du produit (dans un certain contexte d’usage) Efficacité (effectiveness) Efficience (efficiency) Satisfaction 2. L’interface utilisateur et l’interaction 3. Le processus utilisé pour développer le produit 4. La capacité d’une organisation à appliquer la conception centrée utilisateur http://www.usability.serco.com/trump/resources/standards.htm

Directives Normes ISO d’utilisabilité ISO/IEC FDIS 9126-1 : Software Engineering - Product quality - Part 1: Quality model

Directives Normes ISO d’utilisabilité ISO 13407: Human-centred design processes for interactive systems

Directives Critères ergonomiques de Bastien et Scapin Guidage Charge de travail Contrôle explicite Adaptabilité Gestion des erreurs Homogénéité/Cohérence Signifiance des Codes et Dénominations Compatibilité http://www.inria.fr/RRRT/RT-0156.html www.webmaestro.gouv.qc.ca/ress/ Webeduc/2000nov/criteres.pdf http://www.ergoweb.ca/criteres.html

Directives Critères ergonomiques de Bastien et Scapin 1. Guidage L'ensemble des moyens mis en oeuvre pour conseiller, orienter, informer et conduire l'utilisateur lors de ses interactions avec l'ordinateur. 1.1 Incitation Inciter l'utilisateur à effectuer des actions spécifiques en lui fournissant des indices. Par exemple, guider les entrées de données en indiquant le format adéquat et les valeurs acceptables : Date (jj/mm/aa) _ _ / _ _ / _ _ Exemple d'incitation ratée Exemple d'incitation réussie

Directives Critères ergonomiques de Bastien et Scapin 1. Guidage : 1.1 Incitation - Exemple d’incitation ratée … au lieu de « Quebec » (« Québec », ou « QC ») Il fallait taper « PQ » (« Province de Québec »)

Directives Critères ergonomiques de Bastien et Scapin 1. Guidage : 1.1 Incitation - Exemple d’incitation réussie Tâche : saisir un numéro d'abonné et un mot de passe a) Le numéro d'abonné est divisé en trois blocs de trois chiffres (champs de saisie) b) Le curseur se déplace automatiquement au bloc suivant

Directives Principes ergonomiques de Crampes Principes mis en valeur par les ergonomes Cohérence Concision Retour d'informations Structuration des activités Flexibilité Gestion des erreurs Principes généraux de conception Employer des métaphores Favoriser l'approche objet-action Étudier les activités des utilisateurs Rendre l'interface cohérente Rendre l'interface transparente

Directives Directives de Dumas Incitations (prompts) Des incitations efficaces aident l’utilisateur à se rappeler comment exécuter des procédures Utilisez des incitations pour demander à l’utilisateur d’effectuer un choix simple, de saisir des données ou de taper une commande. Soyez aussi précis que possible (8-8)

Directives Guides de recommandations de Ratier Guide de recommandations ergonomiques pour la conception et l’évaluation d’interfaces graphiques L’apparence des fenêtres Les principes de navigation Les principes de saisie Choix des actions de l’application par menu ou par bouton de commande Les actions du système L’aide en ligne (Corinne Ratier, CNRS)

Directives Heuristiques de Nielsen Visibilité du statut du système Compatibilité entre système et monde réel Contrôle par l’utilisateur et liberté de l’utilisateur Cohérence et normes Prévention des erreurs Reconnaissance plutôt que rappel Flexibilité et efficacité d ’utilisation Esthétique et conception minimaliste Aider les utilisateurs a reconnaître, diagnostiquer et réparer les erreurs Aide et documentation Jacob Nielsen www.useit.com

Directives Directives de Brown A. Formats d'affichage B. Langage C. Couleur D. Graphiques E. Dialogue F. Entrée des données G. Dispositifs de contrôle et d'affichage H. Messages d'erreurs et aide en ligne I. Implémentation de l’interface (C. Marlin “Lin” Brown (1988), “Human-Computer Interface Design Guidelines”, Xerox Corporation)

Directives Directives de Brown Plan de la présentation des directives Définition des « directives » D'où viennent les directives ? Concepts sous-jacents Conseils d'utilisation Types de directives

Directives Directives de Brown Définition Ensemble de suggestions pratiques et de lignes directrices pour les concepteurs de l'interface entre des systèmes informatiques et leurs utilisateurs Exemple Utiliser des icônes à la signification claire.

Directives Directives de Brown D’où viennent les directives ? Résultats expérimentaux Prédictions issues de théories de l'activité humaine Principes de psychologie cognitive Principes d'ergonomie Expérience en génie logiciel Jugements d'experts Sens commun Expérience pratique

Directives Directives de Brown Concepts sous-jacents Exigences du traitement mental Allocation de fonctions Modèles mentaux Cohérence Analogies physiques Attentes et stéréotypes Compatibilité stimulus-réponse Facilité d'apprentissage, facilité d'usage et fonctionnalité Novices, experts et utilisateurs occasionnels Éviter l'excès de fonctionnalités Fournir de chemins multiples Divulgation progressive et évolution élégante

Directives Directives de Brown Conseils d’utilisation Mise en garde : Les directives ne doivent pas être considérées comme définitives ni comme une panacée garantissant une interface optimale Conséquences : Se tenir au courant des nouvelles données expérimentales pouvant valider, étendre, nuancer ou invalider les directives Considérer chaque directive à la lumière des exigences particulières et des contraintes relatives aux utilisateurs, à l'équipement et à l'environnement de développement Utiliser le prototypage, les tests pilotes et les tests d'acceptation par les utilisateurs à toutes les étapes du développement du produit pour évaluer et raffiner les concepts avant leur intégration finale

Directives Directives de Brown Types de directives A. Formats d'affichage B. Langage C. Couleur D. Graphiques E. Dialogue F. Entrée des données G. Dispositifs de contrôle et d'affichage H. Messages d'erreurs et aide en ligne I. Implémentation de l’interface

Directives Directives de Brown : A. Formats d’affichage Texte en prose Utilisez à la fois les majuscules et les minuscules pour composer un texte Chaque fois que le dispositif d'affichage autorise les majuscules et les minuscules, présentez vos textes dans les deux casses. Engel & Granda, 1975; Galitz, 1981, 1985; Hinsley & Hanes, 1977; Marcus, 1980, 1984; Seibel, 1972 N’utilisez pas LES LONGS PASSAGES SONT TRÈS DIFFICILES À LIRE S'ILS SONT COMPOSÉS UNIQUEMENT EN LETTRES MAJUSCULES PLUTÔT QU'EN MAJUSCULES ET EN MINUSCULES. Utilisez Les longs passages sont très difficiles à lire s'ils sont composés uniquement en lettres majuscules plutôt qu'en majuscules et en minuscules. Exceptions.- On peut utiliser les majuscules : 1/ Quand la visibilité des caractères est limitée par leur taille réduite ou par une dégradation de la vue. 2/ Dans un tableau, pour distinguer les titres des données

Directives Directives de Brown : B. Langage Terminologie familière Utilisez des termes familiers Évitez les mots difficiles, les abréviations et les acronymes qui ne sont pas utilisés communément par les utilisateurs. Utilisez Ces données exigent un code spécial d'accès. Merci d'appeler le Centre de calcul, poste 2985. N’utilisez pas IMS/VS DBMS CLASS IV DATA. SEE DBSA, W75B37-59

Directives Directives de Brown : C. Couleur Code des couleurs Utilisez les codes de couleurs admis communément Utilisez Blanc / Noir Couleur fondamentale Rouge Alarmes ou erreurs; Stop Jaune Avertissements ou données exigeant de l'attention Vert Normal ou OK; Allez; Couleur de base si blanc trop clair Bleu saturé Mise en retrait. Ne pas utiliser pour les données critiques Bleu dé-saturé Température froide ou eau Rose (Magenta) Couleur d'alarme secondaire, différenciation de données Turquoise (Cyan) Différenciation de types de données Autres couleurs Différenciation de types de données

Directives Directives de Brown : D. Graphiques Icônes Utilisez des icônes à la signification claire Des icônes bien conçues s'expliquent d'elles-mêmes, tout au moins dans le contexte dans lequel elles sont utilisées. Il existe plusieurs astuces pour concevoir des icônes claires Utilisez (Signification claire = icône d’imprimante) N’utilisez pas (Signification obscure = icône d’imprimante)

Directives Directives de Brown : E. Dialogue Commandes cohérentes Utilisez des couples de commandes cohérents Pour les opérations ayant leur inverse ou leur contrepartie, comme ouvrir et fermer un fichier, utilisez des couples cohérents de commandes. Les couples cohérents sont habituellement formés d'opposés ou d'inverses. Utilisez Lire / Écrire Ouvrir / Fermer Haut / Bas Oui / Non N’utilisez pas Lire / Fermer Ouvrir / Sauvegarder Précédent / Bas Oui / Off

Directives Directives de Brown : F. Entrée des données Spécification de formats Indiquez le format correct d’entrée Afficher le format requis pour entrer les données. Ce format apparaîtra comme élément de l'intitulé d'entrée ou comme incitation (« prompt »). Galitz, 1981 Utilisez DATE DE DÉPART (JJMMAA) : - - - - - - N’utilisez pas DATE DE DÉPART

Directives Directives de Brown : G Directives Directives de Brown : G. Dispositifs de contrôle et d’affichage Touches vitesse curseur Fournir un mode vitesse curseur

Directives Directives de Brown : H Directives Directives de Brown : H. Messages d’erreurs et aide en ligne (1) Messages d’erreurs utiles Rendez instructifs les messages d’erreurs Les messages d'erreurs doivent toujours énoncer (ou impliquer clairement) au moins : quelle erreur a été détectée; quel champ d'entrée contient l'erreur; quelle action correctrice doit être effectuée. Engel & Granda, 1975; Pew & Rollins, 1975; Shneiderman, 1979 Utilisez Le format du nombre de parties doit comporter deux lettres puis trois chiffres. N’utilisez pas Entrée invalide.

Directives Directives de Brown : H Directives Directives de Brown : H. Messages d’erreurs et aide en ligne (2) Contenu de l’aide en ligne L'aide en ligne explique les écrans, les champs, les codes et les messages. Catégories d'assistance pouvant être utiles : explication brève de la fonction de l'écran ou de la transaction; descriptions des champs d'entrée (définitions, unités, formats, entrées valides; descriptions des champs de données de sorties (définitions, unités, formats, mode de calcul des valeurs); définition des codes, des commandes et des abréviations utilisés; explication des messages d'erreurs et conseils pour corriger les erreurs; allocation des touches fonction; exemples de procédures, de commandes et de syntaxe correctes, Brown, 1982; Limanowski, 1983

Directives Directives de Brown : H Directives Directives de Brown : H. Messages d’erreurs et aide en ligne (3) Aide en ligne (HELP) pertinente Fournir une aide en ligne spécifique à la situation [ou contextuelle] Quand les utilisateurs font appel à l'aide en ligne, leur problème est souvent lié à la transaction en cours lorsque la fonction HELP a été appelée; aussi est-il souvent désirable d'afficher automatiquement l'écran ou la fenêtre d'aide associée à la transaction courante; cette aide [contextuelle] permet d'éviter à l'utilisateur des recherches longues ou infructueuses dans les pages d'aide; des systèmes plus sophistiqués permettent de « pointer » un objet ou un item de l'interface et d'obtenir une aide spécifique sur cet objet ou cet item.

Directives Directives de Brown : I. Implémentation de l’interface (1) Stratégies et suggestions pour intégrer les directives dans le processus de conception du système entier Déterminer le rôle de l'interface dans le développement du système (*) Connaître les utilisateurs (*) Définir les tâches (*) Inclure les directives Former les concepteurs de logiciels à la conception d'interfaces Développer les outils logiciels d'interfaçage Prototyper, et « tester » l'utilisateur (*) Concevoir par raffinements itératifs (*) Points développés par la suite

Directives Directives de Brown : I. Implémentation de l’interface (2) Déterminer le rôle de l'interface dans le développement du système Participation à l'équipe de conception Le concepteur de l'interface est un membre à part entière de l'équipe de conception du système.   Choix de conception Le concepteur doit accepter la nécessité d'envisager et de faire des choix de conception

Directives Directives de Brown : I. Implémentation de l’interface (3) Connaître les utilisateurs Analyse des fonctions Analyser et définir les fonctions du système   Analyse de la tâche Analyser les tâches de l'utilisateur Analyse des tâches existantes Analyse des tâches nécessaires pour manipuler le système

Directives Directives de Brown : I. Implémentation de l’interface (4) Prototyper et « tester » l’utilisateur Test utilisateur Faire des tests sur des utilisateurs réels Mesure du comportement Mesurer le comportement de l'utilisateur et non seulement ses opinions Tests papier Les premiers tests peuvent être des tests sur papier Tests de simulation Les tests pré-opérationnels peuvent simuler les systèmes planifiés Tests par prototype Utiliser des prototypes du système pour effectuer les tests

Quelques sites UsernoMics : http://www.usernomics.com/ Usable Web : http://www.usableweb.com/ HCI Bibliography : http://www.hcibib.org/ L’ergonome : http://www.lergonome.org/pages/accueil.php Ergoweb : http://www.ergoweb.ca/

Plan du cours Introduction Panorama des méthodes Méthode des scénarios Directrices (Guidelines) Evaluation coopérative Évaluation heuristique et Cognitive Walkthrough