le design centré utilisateur

Le Design Centré Utilisateur

User centred desing

Technologies Technologies transparentes et UCDtransparentes et UCD

The most profound technologies are those that The most profound technologies are those that disappear. They weave themselves into the fabric disappear. They weave themselves into the fabric

of everyday life until they are indistinguishable of everyday life until they are indistinguishable from it.from it.

Weiser (1991)Weiser (1991)

Un produit ERGONOMIQUE est Un produit ERGONOMIQUE est “TRANSPARENT” comme une paire de lunettes“TRANSPARENT” comme une paire de lunettes

L’ergonome des NTIC joue un rôle L’ergonome des NTIC joue un rôle essentiel dans la réalisation de produits essentiel dans la réalisation de produits “CENTRES sur les UTILISATEURS”“CENTRES sur les UTILISATEURS”

UCD et UtilisabilitéUCD et Utilisabilité

Norme ISO 9241 (international standard Norme ISO 9241 (international standard for the ergonomic requirements for office for the ergonomic requirements for office work with visual display terminals)work with visual display terminals)

Définition d’utilisabilité:Définition d’utilisabilité:

"the extent to which a product can be "the extent to which a product can be used by used by specified usersspecified users to achieve to achieve specified goalsspecified goals with with effectivenesseffectiveness, , efficiencyefficiency and and satisfactionsatisfaction in a in a specified specified contextcontext of use." of use."

Contexte Contexte environnementalenvironnemental

Contexte Contexte cognitifcognitif

USAGERUSAGER

CaractéristiquesCaractéristiques ObjectifsObjectifs

PRODUITPRODUIT

FormeForme ContenuContenuASPECTS ASPECTS

GRAPHIQUESGRAPHIQUESSÉQUENCESÉQUENCE

ASP. ASP. SÉMANTIQUESSÉMANTIQUES

DIALOGUE DIALOGUE H/MH/MCONTEXTECONTEXTE

COMMANDES, COMMANDES, MODALITE MODALITE

D’EXPLORATIOND’EXPLORATION

PRINCIPES DE BASE PRINCIPES DE BASE

SIMPLICITÉSIMPLICITÉ

INTUITIVITÉINTUITIVITÉ

CONSISTENCECONSISTENCE

SENSATION DE SENSATION DE CONTRÔLECONTRÔLE

Moindre Moindre ÉtonnementÉtonnement Re-traitementRe-traitementÉquitéÉquité

Maudits soient mes sabots ! J’ai appuyé une autre fois sur la mauvaise touche ! Qui diantre a conçu ces commandes, un raton laveur ?

< 1 1-2 3-5

+ 5 DONNEES NON DISPO.

??

< 1 1-2 3-5

+ 5 DONNEES NON DISPO.?

FORME : FORME : aspects graphiquesaspects graphiques

FORME : aspects graphiquesFORME : aspects graphiquesl’organisation visuellel’organisation visuelle

Densité des éléments : ne pas dépasser le Densité des éléments : ne pas dépasser le 30% de la page sur le web30% de la page sur le web

Organisation du contenu sur la base des lois Organisation du contenu sur la base des lois de lade la Gestalt Gestalt

proximitéproximité similaritésimilarité fermeturefermeture continuationcontinuation symétriesymétrie

Les LOIS de la GESTALT peuvent être Les LOIS de la GESTALT peuvent être utiles pour l’organisation spatiale des utiles pour l’organisation spatiale des éléments affichés à l’écranéléments affichés à l’écran

1. Chapitre1.1 Paragraphe1.2 Paragraphe2. Chapitre2.1 Paragraphe

1. Chapitre1.1 Paragraphe1.2 Paragraphe

2. Chapitre2.1 Paragraphe

Grâce au principe de proximité dans le Grâce au principe de proximité dans le deuxième cas il est plus facile de deuxième cas il est plus facile de comprendre la structurecomprendre la structure

OriginalBasé sur Gestalt

Avec séparateursSans séparateurs

LA PERCEPTION structure la LA PERCEPTION structure la compréhensioncompréhension

BOUTONS OU TITRES ? ?

Il est important de respecter les correspondances logico-spatiales entre ce que la personne VEUT FAIRE et ce qui lui semble FAISABLE et PERMIS

Le MAPPING est une projection cartographique des rapports spatiaux et, par extension, il

indique les correspondances conceptuelles entre les commandes et les fonctions

FORME : aspects graphiquesFORME : aspects graphiquesle concept de MAPPINGle concept de MAPPING

Taille et Taille et policepolice des caractères des caractères

Distance Taille caract. 50 cm 0,25 cm50-90 cm 0,5 cm90-180 cm 0,9 cm180-360 cm 1,8 cm360-600 cm 3 cm

La lecture sur écran est 25% plus LENTE que La lecture sur écran est 25% plus LENTE que sur papier ?sur papier ?

Attention au contraste Texte/FondAttention au contraste Texte/Fond

FORME : aspects graphiquesFORME : aspects graphiquesla lisibilitéla lisibilité

FORME : aspects graphiquesFORME : aspects graphiquesLes CouleursLes Couleurs

Avantages: aider à grouper les infosAvantages: aider à grouper les infos montrer les relations entre élémentsmontrer les relations entre éléments captiver l’attentioncaptiver l’attention

•Limiter le nombre de couleurs, maintenir cohérence, éviter la Limiter le nombre de couleurs, maintenir cohérence, éviter la “Chromostéreopsie”“Chromostéreopsie”

• Couleurs PERTINENTES à situation, usager, contexte…Couleurs PERTINENTES à situation, usager, contexte…

Inconvénients : perturber l’exploration visuelleInconvénients : perturber l’exploration visuelle créer confusion créer confusion perte d’info pour certains usagersperte d’info pour certains usagers

• Le problème du bleuLe problème du bleu

Problème “technique”: la couleur des boutons Problème “technique”: la couleur des boutons dépend de la configuration de Windows. Si dépend de la configuration de Windows. Si Windows utilise un fond vert ou rouge les 2 textes Windows utilise un fond vert ou rouge les 2 textes disparaissent! disparaissent!

Problème d’“associations” dues à la culture: vert = Problème d’“associations” dues à la culture: vert = ok (comme pour les feux). Est-on SURS que dans ok (comme pour les feux). Est-on SURS que dans ce cas “yes” soit la réponse “ok”?ce cas “yes” soit la réponse “ok”?

Problème d’“arrogance culturelle”: on impose des Problème d’“arrogance culturelle”: on impose des standards occidentaux!standards occidentaux!

Problème “physique” : les personnes daltoniennes Problème “physique” : les personnes daltoniennes auront du mal à lire les boutonsauront du mal à lire les boutons

FORME : aspects graphiquesFORME : aspects graphiquesLes CouleursLes Couleurs

• Faire Prototypes en NOIR et BLANC (sect. Faire Prototypes en NOIR et BLANC (sect. 508 Rehabilitation Act)508 Rehabilitation Act)

• Limiter le nombre de couleurs :Limiter le nombre de couleurs :

•4 par page écran 4 par page écran

•7 au total7 au total

FORME : aspects graphiquesFORME : aspects graphiquesImages et icônesImages et icônes

Avantages: Avantages: elles sont perçues plus vite que elles sont perçues plus vite que le texte le texte

elles sont plus facilement elles sont plus facilement mémorisés mémorisés

elles disent “plus” avec “moins”elles disent “plus” avec “moins”

elles ne posent pas de elles ne posent pas de problèmes linguistiques problèmes linguistiques

Inconvénients : problèmes Inconvénients : problèmes affichage/téléchargement affichage/téléchargement elles sont inaccessibles au elles sont inaccessibles au non voyants non voyants (Sect. 508)(Sect. 508)

elles ne sont pas toujours elles ne sont pas toujours claires claires

FORME : aspects graphiquesFORME : aspects graphiquesImages et icônesImages et icônes

Problèmes Culturels (flag problem)Problèmes Culturels (flag problem)

L’importance des expériences personnellesL’importance des expériences personnelles

Les trois types d’icônesLes trois types d’icônes

Ressemblance Référence ArbitraireRessemblance Référence Arbitraire

Au moment du choix des icônes, il Au moment du choix des icônes, il faut en évaluer (Barrier, 2000): faut en évaluer (Barrier, 2000): l’iconicité l’iconicité la saillancela saillancel’économie visuellel’économie visuellel’univocitél’univocitéla familiaritéla familiaritél’esthétiquel’esthétique

Le phénomène dit «banner Le phénomène dit «banner blindness»blindness»

Toutes les images non sont pas VUES !Toutes les images non sont pas VUES ! Les images colorées, clignotantes et séparées Les images colorées, clignotantes et séparées du reste de la page Ne sont PAS regardées, du reste de la page Ne sont PAS regardées, notamment dans le cas où le sujet est en train notamment dans le cas où le sujet est en train de rechercher une information précisede rechercher une information précise

L’accessibilité au contenu

• De plus en plus de Pays l’imposent par Lois (Section 508 USA, lois Stanca en Italie)

• Outils simples pour valider le code (ex. HTML Validator du W3C)

• Souvent il s’agit de modifications minimes du code (ex.: tag <ALT> pour les images)

Les quatre buts d’une imageLes quatre buts d’une image

L'image comme élément d'information L'image comme élément d'information

L'image comme élément de navigation L'image comme élément de navigation

L'image comme élément de mise en page L'image comme élément de mise en page

L'image comme élément de décoration L'image comme élément de décoration

L'image comme élément L'image comme élément d'informationd'information

L'image comme élément de L'image comme élément de navigationnavigation

L'image comme élément de L'image comme élément de mise en pagemise en page

L'image comme élément de L'image comme élément de décorationdécoration

Une 5ème fonction…Une 5ème fonction…Les LOGOSLes LOGOS

Ce sont les outils marketing les plus Ce sont les outils marketing les plus efficaces efficaces (reconnus + vite que texte)(reconnus + vite que texte)Représentent l’image de marqueReprésentent l’image de marqueVéhiculent des valeursVéhiculent des valeursRappellent des souvenirsRappellent des souvenirsMettent l’utilisateur en confianceMettent l’utilisateur en confianceEsthétique et designEsthétique et design

La BARRE des COMMANDESLa BARRE des COMMANDES

WINDOWSWINDOWS

Les MENUSLes MENUS

Les LIENS HYPERTEXTESLes LIENS HYPERTEXTES

Comment l’organiser ?

Combien? En quelle relation ?

Depth or Breadth?

Graphiques ou textuels ? Où les placer ?

Les POINTEURSLes POINTEURSQuel comportement ? Quelle taille ?

FORME : COMMANDES, FORME : COMMANDES, MODALITE D’EXPLORATIONMODALITE D’EXPLORATION

Windows :Windows : • On ne peut pas en gérer au même On ne peut pas en gérer au même temps plus que 7temps plus que 7• Conventions d’ouverture/fermeture Conventions d’ouverture/fermeture (apple/win) (apple/win) • Les ouvrir près de l’aire cliquéeLes ouvrir près de l’aire cliquée• Stratégies : Stratégies : -““overlapping strategy” pour les novicesoverlapping strategy” pour les novices-““tiled strategy” pour les expertstiled strategy” pour les experts


Menus :Menus : • 4 façons de les ranger, selon les besoins:4 façons de les ranger, selon les besoins:- AlphabétiqueAlphabétique- Par thèmePar thème- Par fréquence d’usagePar fréquence d’usage- Par importance relativePar importance relative

• Possibilité de “pie menu” (ok pour “fitts’ Possibilité de “pie menu” (ok pour “fitts’ law”: law”: MTMT = = aa + + bb log2(2 log2(2AA//WW)) ))• Attention aux habitudes !Attention aux habitudes !


Widgets :Widgets :

Eviter aux utilisateurs de taper du texte (erreurs!)Eviter aux utilisateurs de taper du texte (erreurs!)

Mettre des étiquettes claires aux champs de saisieMettre des étiquettes claires aux champs de saisie

Utiliser les Radio Buttons pour options mutuellement Utiliser les Radio Buttons pour options mutuellement

exclusives (exclusives ( plutôt que plutôt que ))

Utiliser 1 seul système d’entrée des donnéesUtiliser 1 seul système d’entrée des données

Utiliser l’autotabbingUtiliser l’autotabbing

Eviter le scrolling dans les listes déroulantesEviter le scrolling dans les listes déroulantes

Attention à conventions culturelles…Attention à conventions culturelles…


Widgets Usability :Widgets Usability :


A propos de boutons...A propos de boutons...

USER CENTRED DESIGNUSER CENTRED DESIGNUSAGERUSAGER

CaractéristiquesCaractéristiques ObjectifsObjectifs

PRODUITPRODUIT

FormeForme ContenuContenuASPECTS ASPECTS

GRAPHIQUESGRAPHIQUES

SÉQUENCESÉQUENCE

ASP. ASP. SÉMANTIQUESSÉMANTIQUES

DIALOGUE DIALOGUE H/MH/M

CONTEXTECONTEXTECOMMANDES, COMMANDES,

MODALITE MODALITE D’EXPLORATIOND’EXPLORATION

Contexte environnementalContexte environnemental Contexte cognitifContexte cognitif

Le CONTENULe CONTENU

LA SÉQUENCE DES INFOSLA SÉQUENCE DES INFOS

Comment les informations se structurent-Comment les informations se structurent-elles dans la tête des utilisateurs ?elles dans la tête des utilisateurs ?

LES ASPECTS SÉMANTIQUESLES ASPECTS SÉMANTIQUES

Quelle langue? Quel langage ?Quelle langue? Quel langage ?

LE DIALOGUE H/MLE DIALOGUE H/M

Qu’est ce que l’ordinateur peut-il Qu’est ce que l’ordinateur peut-il comprendre ?comprendre ?

Respecte-t-il les maximes de GRICE ?Respecte-t-il les maximes de GRICE ?

Le Contenu : la SéquenceLe Contenu : la Séquence

Eviter le phénomène dit “lost in

hyperspace”, qui témoigne une surcharge

cognitive : l’utilisateur doit toujours savoir

où il se trouve, d’où il vient et où il peut

aller

Utiliser le Scrolling si les informations

sont interdépendantes, le Paging si moins

connexes

LES HYPERTEXTES et l’ergonomie des liensLES HYPERTEXTES et l’ergonomie des liens

LES HYPERTEXTESLES HYPERTEXTES

Changement de la relation auteur/lecteurChangement de la relation auteur/lecteur

Incroyables avantages théoriquesIncroyables avantages théoriques

Mais concrètement…Mais concrètement…

- perte d’orientation (Otter & Johnson, 2000)- perte d’orientation (Otter & Johnson, 2000)

- surcharge cognitive (Tricot et al. 2001)- surcharge cognitive (Tricot et al. 2001)

- vision “par le trou de la serrure” (Woods, 1984)- vision “par le trou de la serrure” (Woods, 1984)

Différences texte/hypertexteDifférences texte/hypertexte

Présence d’Eléments GRAPHIQUESPrésence d’Eléments GRAPHIQUES

Augmentation du MARQUAGE visuel du texteAugmentation du MARQUAGE visuel du texte

Présence de texte “simple” et de texte Présence de texte “simple” et de texte

constituant un lien hypertextuel (ACTION)constituant un lien hypertextuel (ACTION)

Perte de la linéarité intra-pagePerte de la linéarité intra-page

Perte de la linéarité inter-pages.Perte de la linéarité inter-pages.

Présence d’éléments Présence d’éléments graphiquesgraphiques

Les enseignants doutent profondément de la capacité du système scolaire à réduire les inégalités sociales et à assurer l'insertion professionnelle des élèves. Leurs désillusions apparaissent même plus fortes que celles exprimées par les élèves et les parents dans une enquête réalisée par la Fédération syndicale unitaire (FSU), première force syndicale de l'éducation nationale.

Augmentation du MARQUAGE Augmentation du MARQUAGE visuel du textevisuel du texte


Les enseignants pour la fin du collège unique

Présence de texte “simple” et de texte Présence de texte “simple” et de texte constituant un lien hypertextuelconstituant un lien hypertextuel


Les enseignants pour la fin du collège unique

Perte de linéarité intra-pagePerte de linéarité intra-page


Les enseignants pour la fin du collège unique A la UNE

Rubriques :- politique- économie- faits divers- météo

Perte de la linéarité inter-pagesPerte de la linéarité inter-pages

page actuelle

A la UNE

RubriquesArchive

s

Approfondissements

FSU (autre site)

Pub

Un cas particulier : la page d’accueil

• Créer une 1ère impression positive• Faire en sorte qu’elle ressemble à

un page d’accueil (organisation, peu de contenu, bcp de liens) !

• Accès à partir de toutes les pages sauf elle-même

• Annoncer les mises à jour• Communiquer clairement le but du

site

Ergonomie des liens hypertextesErgonomie des liens hypertextes•Problème de la couleur conventionnelleProblème de la couleur conventionnelle

•The “Scent of information” : les liens doivent :The “Scent of information” : les liens doivent :

- bien prédire la page d’arrivée- bien prédire la page d’arrivée

- ne pas être ambigus entre eux- ne pas être ambigus entre eux

•Choisir un texte “parlant”Choisir un texte “parlant”Pour plus de détails sur Pour plus de détails sur nos produits, nos produits, cliquez icicliquez ici

Vous pouvez obtenir plus Vous pouvez obtenir plus d’infos sur d’infos sur nos produitsnos produits

•Si possible ne pas imbriquer le lien Si possible ne pas imbriquer le lien

dans le textedans le texte

• Faire attention aux retours à la ligneFaire attention aux retours à la ligne

Toto ElectroménagerToto Electroménager

Division InformatiqueDivision Informatique

• Attention à l’aire cliquableAttention à l’aire cliquable

Le Contenu: les aspects Le Contenu: les aspects sémantiquessémantiques

Respecter le STYLE pour le Web: Respecter le STYLE pour le Web: concise, scannable, objectiveconcise, scannable, objective

Expérience Morkes & Nielsen 1997 :

5 version du site Travel Nebraska : marketese, scannable, concise, objective, or combined

51 sujets

VDs: temps de recherche, nombre d’erreurs, score de mémoire, temps de réalisation du plan du site et satisfaction subjective (facilité perçue + qualité perçue, intérêt + look and feel)


Résultats : Résultats :

Condition Task Time

Task Errors Memory Sitemap

TimeSubjective Satisfaction

Promotional (control)

359 0.82 0.41 185 5.7

(194) (0.60) (0.14) (43) (1.5)

Concise209* 0.40 0.65** 130*** 7.1*

(88) (0.70) (0.21) (41) (1.9)

Scannable229* 0.30* 0.55* 198 7.4*

(86) (0.48) (0.19) (93) (1.8)

Objective 280 0.50 0.47 159 6.9*

(163) (0.53) (0.13) (69) (1.7)

Combined 149** 0.10** 0.67*** 130** 7.0*

(57) (0.32) (0.10) (25) (1.6)

Version Task Time

Task Errors Memory Sitemap

TimeSubjective Satisfaction

Overall Usability

Promotional (control) 100 100 100 100 100 100

Concise 172 205 142 124 156 158

Scannable 157 273 94 130 133 147

Objective 128 164 116 121 112 127

Combined 242 818 162 142 122 224


Utiliser la “pyramide inversée”Utiliser la “pyramide inversée”

Faire attention aux problèmes de Langue et Langage Faire attention aux problèmes de Langue et Langage globalisation and localisationglobalisation and localisation

Bastien ajoute que le texte doit être “«balayable» (Bastien ajoute que le texte doit être “«balayable» (scanabilityscanability) ) et lisible (et lisible (readabilityreadability):):- Utiliser titres et sous-titresUtiliser titres et sous-titres- Un concept par paragraphe Un concept par paragraphe - Information importante en début des phrases Information importante en début des phrases - Phrases importantes en début de paragraphesPhrases importantes en début de paragraphes- Utiliser les termes les plus courts possibleUtiliser les termes les plus courts possible- Éviter les périphrasesÉviter les périphrases- Utiliser la forme active (et non passive) des verbesUtiliser la forme active (et non passive) des verbes- Éviter doubles négationsÉviter doubles négations

Le Contenu : le dialogue Le Contenu : le dialogue homme-machinehomme-machine

Consistency: cohérence parmi les règles Consistency: cohérence parmi les règles qui gèrent les commandesqui gèrent les commandes

Feedback et transparence de l’état du Feedback et transparence de l’état du système (gestion du temps)système (gestion du temps)

Anticipation des attentesAnticipation des attentes

Possibilité de raccourcisPossibilité de raccourcis

Respect du principe de COOPERATION Respect du principe de COOPERATION de Grice et des maximes dede Grice et des maximes de

- qualité- qualité

- quantité- quantité

- relationrelation

- manière- manière

Gestion du temps et feedbackGestion du temps et feedback

0.1 sec. = réaction instantanée0.1 sec. = réaction instantanée

1 sec. = limite de l’attention du sujet1 sec. = limite de l’attention du sujet

> 6 sec. = limite pour l’envoi d’un feedback> 6 sec. = limite pour l’envoi d’un feedback

Sablier/montre si délai limité

Barre d’avancement si délai plus important

+ signal sonore pour indiquer la fin

Les indications sur le temps de téléchargement sont Les indications sur le temps de téléchargement sont particulièrement importantesparticulièrement importantes

Le principe de cooperation de GriceLe principe de cooperation de Grice

L’interprétation d’une phrase dépasse la L’interprétation d’une phrase dépasse la signification qui lui est conventionnellement signification qui lui est conventionnellement attribuée.attribuée.

Les interlocuteurs qui participent à une Les interlocuteurs qui participent à une conversation commune normalement respectent le conversation commune normalement respectent le Principe de Coopération et ses maximes.Principe de Coopération et ses maximes.La violation des maximes peut répondre à deux La violation des maximes peut répondre à deux mécanismes et entraîner deux types de mécanismes et entraîner deux types de conséquences :conséquences :- l’interlocuteur ne coopère plus - l’interlocuteur ne coopère plus désinvestissement dans la conversation (rupture)désinvestissement dans la conversation (rupture)- l’interlocuteur coopère toujours - l’interlocuteur coopère toujours déclenchement déclenchement d’interprétations (sous-entendus, sens « caché », d’interprétations (sous-entendus, sens « caché », ironie, etc.)ironie, etc.)

Le principe de cooperation de GriceLe principe de cooperation de Grice

La maxime de La maxime de quantitéquantité

ne pas donner plus d’information que ne pas donner plus d’information que nécessairenécessaire

Toutes les informations sur les cotations de la Toutes les informations sur les cotations de la Bourse de Paris sont on-line dans cette pageBourse de Paris sont on-line dans cette page

La maxime de La maxime de qualitéqualité

ne pas énoncer des propos faux et ne pas ne pas énoncer des propos faux et ne pas énoncer des propos pour lesquels il n’existe énoncer des propos pour lesquels il n’existe

pas de preuves adéquatespas de preuves adéquatescliquez ici et gagnez 10.000 euroscliquez ici et gagnez 10.000 euros

Le principe de cooperation de Grice

La maxime de La maxime de relationrelation

être pertinentêtre pertinent

La maxime de La maxime de ManièreManière

éviter l’obscurité et éviter l’obscurité et l’ambiguïtél’ambiguïtéerror 404error 404

Une communication ratée dans le Une communication ratée dans le dialogue h-mdialogue h-m

A l’aéroportA l’aéroport

Voyageur : sait-tu me dire quand il part le Voyageur : sait-tu me dire quand il part le prochain avion pour Londres ?prochain avion pour Londres ?

Ordinateur : ouiOrdinateur : oui

Voyageur : et quand il part ?Voyageur : et quand il part ?

Ordinateur : qui?Ordinateur : qui?

Voyageur : le prochain avion !Voyageur : le prochain avion !

Ordinateur : quel avion ?Ordinateur : quel avion ?

Le principe de cooperation de Grice

Le but de l’acte communicatifLe but de l’acte communicatif

Se poser la question «quel est le BUT de Se poser la question «quel est le BUT de ce message ?»ce message ?»Les sites Internet peuvent avoir 4 buts Les sites Internet peuvent avoir 4 buts différents:différents:

• informer informer (news…)(news…)

• vendre vendre (e-commerce)(e-commerce)

• enseigner enseigner (e-learning)(e-learning)

• amuser/divertir amuser/divertir (jeux en ligne…)(jeux en ligne…)

Visibility of system statusVisibility of system status

Les HEURISTIQUES de NIELSENLes HEURISTIQUES de NIELSEN

Match between system and Match between system and the real world the real world

User control and freedomUser control and freedom Consistency and standardsConsistency and standards

Error preventionError prevention Recognition rather than recallRecognition rather than recall

Flexibility and efficiency of useFlexibility and efficiency of use Aesthetic and minimalist designAesthetic and minimalist design

Help users recognize, diagnose, Help users recognize, diagnose, and recover from errorsand recover from errors

Help and documentationHelp and documentation

Des Principes Généraux aux Des Principes Généraux aux Lignes GuidesLignes Guides

Les PRINCIPES rajoutés Les PRINCIPES rajoutés par TOGNAZZINIpar TOGNAZZINI

Anticipation of needsAnticipation of needs LearnabilityLearnability

Track stateTrack state ReadabilityReadability


Use of MetaphorsUse of Metaphors


L’organisation proposée par Scapin et al.L’organisation proposée par Scapin et al.

1. Guidance 1. Guidance 1.1. Prompting (PROM) 1.1. Prompting (PROM) 1.2. Grouping / Distinction between 1.2. Grouping / Distinction between items items 1.2.1. Grouping / Distinction by location 1.2.1. Grouping / Distinction by location (GDLO) (GDLO) 1.2.2. Grouping / Distinction by format 1.2.2. Grouping / Distinction by format (GDFO) (GDFO) 1.3. Immediate feedback (FEED) 1.3. Immediate feedback (FEED) 1.4. Legibility (LEGY) 1.4. Legibility (LEGY) 2. Work load2. Work load 2.1.Brevity 2.1.Brevity 2.1.1.Concision (CONC )2.1.1.Concision (CONC )2.1.2.Minimal actions (MIAC) 2.1.2.Minimal actions (MIAC) 2.2.Information density (INDE) 2.2.Information density (INDE) 3. Explicit control 3. Explicit control

3.1.Explicit actions (EXUA)3.1.Explicit actions (EXUA)3.2.User control (USCO) 3.2.User control (USCO) 4. Adaptability 4. Adaptability 4.1.Flexibility (FLEX) 4.1.Flexibility (FLEX) 4.2.User experience (USEX) 4.2.User experience (USEX) 5. Error management 5. Error management 5.1. Protection to errors 5.1. Protection to errors (ERPR) (ERPR) 5.2. Quality of error messages 5.2. Quality of error messages (QUEM) (QUEM) 5.3. Error correction (ERCO) 5.3. Error correction (ERCO) 6. Homogeneousness / 6. Homogeneousness / Consistency (CONS) Consistency (CONS) 7. Significance of codes (SICO) 7. Significance of codes (SICO)

8. Compatibility (COMP)8. Compatibility (COMP)


La grille XEROXLa grille XEROX

1. Visibility of System Status

1.1 Does every display begin with a title or header that describes screen contents?

1.10 Is there visual feedback in menus or dialog boxes about which choices are selectable?

1.26 Does the system provide visibility: that is, by looking, can the user tell the state of the system and the alternatives for action?



2. Match Between System and the Real World

2.1 Are icons concrete and familiar?

2.11 For question and answer interfaces, are questions stated in clear, simple language?

2.14 Does the command language employ user jargon and avoid computer jargon?



3. User Control and Freedom

3.2 In systems that use overlapping windows, is it easy for users to rearrange windows on the screen?

3.8 Can users cancel out of operations in progress?

3.14 Are menus broad (many items on a menu) rather than deep (many menu levels)?

3.22 If the system allows users to reverse their actions, is there a retracing mechanism to allow for multiple undos?



4. Consistency and Standards

4.8 Does each window have a title?

4.10 Does the menu structure match the task structure?

4.19 Are field labels consistent from one data entry screen to another?

4.39 Are menu choice names consistent, both within each menu and across the system, in grammatical style and terminology?

4.50 Does the system follow industry or company standards for function key assignments?



5. Help Users Recognize, Diagnose, and Recover From Errors

5.2 Are prompts stated constructively, without overt or implied criticism of the user?

5.4 Are prompts brief and unambiguous?

5.15 If an error is detected in a data entry field, does the system place the cursor in that field or highlight the error?

5.16 Do error messages inform the user of the error's severity?

5.17 Do error messages suggest the cause of the problem?



6. Error Prevention

6.4 Are menu choices logical, distinctive, and mutually exclusive?

6.12 Does the system warn users if they are about to make a potentially serious error?

6.14 Do data entry screens and dialog boxes indicate the number of character spaces available in a field?

6.15 Do fields in data entry screens and dialog boxes contain default values when appropriate?



7. Recognition Rather Than Recall

7.1 For question and answer interfaces, are visual cues and white space used to distinguish questions, prompts, instructions, and user input?

7.4 Are all data a user needs on display at each step in a transaction sequence?

7.10 Does the system gray out or delete labels of currently inactive soft function keys?

7.21 Are size, boldface, underlining, color, shading, or typography used to show relative quantity or importance of different screen items?

7.36 Do GUI menus offer affordance: that is, make obvious where selection is possible?



8. Flexibility and Minimalist Design

8.4 Does the system allow novice users to enter the simplest, most common form of each command, and allow expert users to add parameters?

8.6 Does the system provide function keys for high-frequency commands?

8.14 On menus, do users have the option of either clicking directly on a menu item or using a keyboard shortcut?



9. Aesthetic and Minimalist Design

9.1 Is only (and all) information essential to decision making displayed on the screen?

9.4 Does each icon stand out from its background?

9.11 Are menu titles brief, yet long enough to communicate?



10. Help and Documentation

10.3 Do the instructions follow the sequence of user actions?

10.5 Are data entry screens and dialog boxes supported by navigation and completion instructions?

10.8 Is the help function visible; for example, a key labeled HELP or a special menu?

10.10 Navigation: Is information easy to find?

10.19 Is there context-sensitive help?

10.21 Can users easily switch between help and their work?



11. Skills

11.1 Can users choose between iconic and text display of information?

11.2 Are window operations easy to learn and use?

11.12 When the user enters a screen or dialog box, is the cursor already positioned in the field users are most likely to need?

11.18 Are important keys (for example, ENTER , TAB) larger than other keys?

11.19 Are there enough function keys to support functionality, but not so many that scanning and finding are difficult?



12. Pleasurable and Respectful Interaction with the User

12.1 Is each individual icon a harmonious member of a family of icons?

12.3 Has color been used with discretion?

12.7 Can users turn off automatic color coding if necessary?

12.13 If the system uses multiple input devices, has hand and eye movement between input devices been minimized?



13. Privacy

13.1 Are protected areas completely inaccessible?

13.2 Can protected or confidential areas be accessed with certain passwords?

13.3 Is this feature effective and successful?

Conclusion sur les Lignes-guideConclusion sur les Lignes-guide

The application of such guidelines has The application of such guidelines has already been proved to have a already been proved to have a positive positive impact on usabilityimpact on usability (Com ber, 1995; (Com ber, 1995; Grose, Forsythe & Ratner, 1998). For Grose, Forsythe & Ratner, 1998). For instance, Borges instance, Borges et al.et al. showed that the showed that the average time to carry out 5 tasks on a average time to carry out 5 tasks on a web site respecting 17 guidelines has web site respecting 17 guidelines has been reduced by at least by been reduced by at least by 16%16% (Borges, Morales & Rodríguez, 1996). (Borges, Morales & Rodríguez, 1996).

Conclusion sur les Lignes-guideConclusion sur les Lignes-guide

But this does not necessarily imply that a But this does not necessarily imply that a web site that does not consider guidelines web site that does not consider guidelines is unusable. is unusable. Nor it is proved that a web site addressing Nor it is proved that a web site addressing all guidelines is the most usable site. In all guidelines is the most usable site. In other words,other words, guidelines are necessary, but guidelines are necessary, but insufficientinsufficient. . They should not be considered in isolation: They should not be considered in isolation: often guidelines need to be supplemented often guidelines need to be supplemented by a suitable method and a clear process by a suitable method and a clear process that leads them to unambiguous that leads them to unambiguous interpretation. interpretation.

Evaluation HeuristiqueEvaluation Heuristique

PHASE : RÉALISATION, TESTPHASE : RÉALISATION, TEST

COÛTS : COÛTS : - EXPERIMENTATEURS : ~ 3- EXPERIMENTATEURS : ~ 3

- SUJETS : ~ 3 (expérim.)- SUJETS : ~ 3 (expérim.)

- APPAREILLAGE : produit fonctionnant- APPAREILLAGE : produit fonctionnant

DONNÉES : DONNÉES : qualitativesqualitatives

Cette technique consiste en faire évaluer le SW/site par un Cette technique consiste en faire évaluer le SW/site par un groupe de personnes formées qui doivent le juger sur la groupe de personnes formées qui doivent le juger sur la base des paramètres qu’on a défini “heuristiques”.base des paramètres qu’on a défini “heuristiques”.

+ : cela permet d’éliminer “le gros” des problèmes + : cela permet d’éliminer “le gros” des problèmes d’utilisabilité, pas chère et facile à appliquerd’utilisabilité, pas chère et facile à appliquer

- : il faut des sujets qui sachent reconnaître les problèmes - : il faut des sujets qui sachent reconnaître les problèmes dus à un manque de respect des heuristiquesdus à un manque de respect des heuristiques

Evaluation HeuristiqueEvaluation Heuristique

ETAPES :- Choix et mise au point de la grille- Assignation de tâches de familiarisation- Remplissage individuel- Discussion en groupe- Rédaction du rapport

Problème de groupement des réponses

Problème d’espace entre les résultats

Séparateurs

Re-groupement des réponses

le design centré utilisateur

Documents

aspects graphiquesforme

aspects graphiquesle

problme physique

problme dassociations

specified context

base des lois

nombre de couleurs

problme darrogance culturelle