Cours Ergonomie des Interactions Personne- Machine 13 dcembre
2011 Lergonomie des documents Prsentation ralise par Mireille
BtrancourtMireille Btrancourt TECFA Technologies pour la Formation
et lApprentissage Facult de Psychologie et de Sciences de
lEducation
Page 2
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 2 Plan de la sance Rappel projet : o vous devez tre
Design de document centr utilisateur : activit de conception
daffiche dinformation Debriefing Modle de conception de documents
centr utilisateur et recommandations Elments complmentaires sur les
docuemnts multimdia consulter si le sujet vous intresse
Page 3
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 3 Rappel rapide sur le test utilisateur
Page 4
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 4 Analyse de lactivit Test utilisateurs Analyse du
systme Contenu, organisation, fonctionnalits, outils daide Pb
dutilisabilit supposs Scnario dutilisation Contexte global
dutilisation Un ou plusieurs exemples de tches authentiques
Problmes rencontrs Pb dutilisabilit observs : Diagnostic,
propositions de remdiation 1 entretien 5 utilisateurs / -trices dun
mme public cible Vous tes ici
Page 5
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 5 Le scnario Est lensemble des tches proposes aux
utilisateurs dune mme population cible Dtermin selon lanalyse de
lactivit et lanalyse pralable du site Recommandations : Voir dans
le site du cours
http://tecfa.unige.ch/tecfa/teaching/LMRI41/projet_phase2.html#scenario
Ou suivre Description du projet > Fin de la section II analyse
de lactivit
Page 6
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 6 Le test utilisateur Permet de tester le site, pas les
utilisateurs ! Mthode de verbalisation concurrente : inciter
lutilisateur penser tout haut pendant quil excute les tches.
Recommandations : Voir dans le site du cours
http://tecfa.unige.ch/tecfa/teaching/LMRI41/projet_phase4.html Ou
suivre Description du projet > IV Test utilisateurs, lien dans
partie A
Page 7
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 7 Prsentation en tableau (exemple) Recommandations :
Voir dans le site du cours
http://tecfa.unige.ch/tecfa/teaching/LMRI41/projet_phase4.html#Diagnostic
Page 8
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 8 Design de documents techniques Activit de conception
daffiche Rfrences : Dillon, A. (2004) Designing Usable Electronic
Text. 2nd Edition, London: CRC Press (1st edition, 1994).Designing
Usable Electronic Text. Caro, S. & Btrancourt, M. (sous
presse). Ergonomie des documents numriques. in Trait Informatique,
H7 220, Techniques pour lIngnieur (TPI) : Paris (1 re dition
2000).
Page 9
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 9 Quel enjeu ? Le format de prsentation participe la
construction d une reprsentation de ce que dit le texte Attention
Produit corrosif Eviter le contact avec la peau et les yeux.
ATTENTION Produit corrosif Eviter le contact avec la peau et les
yeux. Un document = un contenu + sa mise en forme (disposition,
lisibilit, interactivit)
Page 10
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 10 Les actes de langage Searle, Austin locutoire
illocutoire perlocutoire L demande si j ai lheure L veut savoir
lheure L souhaite que je lui donne lheure Vous avez lheure ?
Interagir avec un document, cest comme interagir avec une
interface.
Page 11
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 11 Les actes de langage Searle, Austin locutoire
illocutoire perlocutoire Vous avez lheure ? 16h25 ! L demande si j
ai lheure L veut savoir lheure L souhaite que je lui donne
lheure
Page 12
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 12 Les actes de langage Searle, Austin locutoire
illocutoire perlocutoire Vous avez lheure ? Oui. L demande si j ai
lheure
Page 13
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 13 La mise en forme du document M + K => S M = mise
en forme du message K = connaissances des lecteurs sur le domaine S
= signification que l auteur veut transmettre David (1985)
Page 14
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 14 Mthodologie dinvestigation Etude exprimentale de
performances Exploration de mouvements oculaires Etude
dutilisabilit sur panel dutilisateurs
Page 15
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 15 Les dispositifs non linguistiques de mise en forme du
texte
Page 16
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 16 Quelle police choisir ? Sur cran choisir des polices
sans srif (Arial, Helvetica, Geneva par exemple) Elles sont plus
lisibles que les polices avec srif. Gras, italique : ralentissent
la lecture MAJUSCULES : MOINS LISIBLES QUE MINUSCULES Majuscules :
moins lisibles que minuscules
Page 17
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 17 Quelle police choisir (2) ? L il lit le haut des
lettres. L OEIL LIT LE HAUT DES LETTRES
Page 18
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 18 Attention l utilisation de couleurs ! Quelle couleur
de fond / police ? viter les combinaisons rouge/bleu effet de
battement insupportable Lisibilit maximale : caractres noirs sur
fond blanc, ou en tout cas foncs sur fond clair. Au niveau
physiologique : C est plus lisible que blanc sur fond noir. Pour
tester :
http://tecfa.unige.ch/perso/lombardf/CPTIC/couleurs/bleu-noir.htmll
http://tecfa.unige.ch/perso/lombardf/CPTIC/couleurs/bleu-noir.htmll
Page 19
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 19 Attention l utilisation de couleurs ! Quelle couleur
de fond / police ? Ressources sur le Web : Au niveau physiologique
: Appli interactive ColortesterColortester Pour tester :
http://tecfa.unige.ch/perso/lombardf/CPTIC/couleurs/bleu-noir.htmll
Page 20
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 20 Quelle utilisation des couleurs ? Se limiter un
nombre rduit de couleurs (7 maximum), faciles distinguer Utiliser
la couleur pour coder de l information Consistance du choix de
couleur sur tout le document Le choix des couleurs doit tre
consistant avec leur signification commune. Au niveau cognitif
:
Page 21
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 21 Mise en page et densit dinformation Quantit d espace
: 20 40% sur papier, 40 60% sur cran Longueur des lignes : 50 70
caractres Ce produit est trs irritant, vitez de l inhaler. Ce
produit est trs irritant, vitez de l inhaler.
Page 22
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 22 Comment mettre une information en avant ? ajouter un
cadre de couleur diffrente augmenter l interlignage enrichissement
typographique : taille > gras > italique ajouter une icne
simple ou une animation L'crit est particulirement touch par les
bouleversements induits par les technologies de l'information dans
tous les domaines de l'activit humaine, qu'il s'agisse du travail,
de la vie sociale, de la recherche ou de la cration artistique.
L'criture est l'une des plus anciennes technologies culturelles.
Ses interrelations avec les structures sociales. Ses incidences sur
le dveloppement de la pense abstraite, ses effets sur le
fonctionnement de la mmoire ont t tudis depuis longtemps. Images
fixes et animes Certains vont jusqu' prdire la disparition courte
chance de l'crit par obsolescence complte de l'criture et de la
lecture ; d'autres, d'une manire moins radicale, anticipent son
cantonnement la seule lecture, la prise en charge de la production
de la trace matrielle tant entirement dvolue des dispositifs
techniques. Appel propositions L'appel propositions est plus
particulirement centr sur deux thmatiques complmentaires. Rfrences
: http://edutechwiki.unige.ch/en/Font_readability
Page 23
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 23 Comment mettre une information en avant ? Young &
Wogalter, 1990 Risque d explosion : tenir loign des flammes. Risque
d explosion : tenir loigner des flammes. 1 2 3 4
Page 24
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 24 Principes gnraux Utiliser un codage redondant
Prserver lhomognit Deux rgles d or Toute variation de mise en forme
sera interprte ! On ne pense pas le document sur cran comme sur
papier Deux rgles d or
Page 25
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 25 Pour aller plus loin Elments complmentaires sur les
documents informatiss et multimdia
Page 26
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 26 Les fentres ponctuelles Ceci est une fentre
ponctuelle qui s active dynamiquement lorsque la souris entre dans
une zone sensible
Page 27
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 27 Les fentres ponctuelles Les atouts diminution de la
charge prsente sur l cran introduit plusieurs niveaux de lecture
flexibilit par rapport au niveau d expertise
Page 28
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 28 Les attributs vido Effet de flash Inverse vido Effet
de flash clignotement
Page 29
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 29 poigne piston valve d entre valve de sortie
Fonctionnement dune pompe vlo. Lorsque lon tire la poigne, le
piston monte, la valve dentre souvre, la valve de sortie se ferme
et lair entre dans la partie basse du cylindre. L effet
multimdia
Page 30
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 30 L effet positif de lajout d illustrations graphiques
un texte : amliore la mmorisation d environ 36% amliore la
comprhension et le transfert apparat dans plus de 80% des tudes
Denis, 1984; Levie & Lentz, 1982 Leffet multimdia
Page 31
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 31 Fonction des graphiques Utiliser lespace comme
mtaphore dautres relations identifier un objet, un scne Organiser
des informations spatial ou temporelles Rle esthtique, attractif et
motivant
Page 32
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 32 Deux cas o lintgration est dfavorable : si les deux
sources dinformation sont redondantes si les deux sources
dinformation ne sont pas complmentaires Lintgration spatiale des
informations verbales et graphiques facilite la mmorisation et la
comprhension Sweller & collgues Leffet de contigut
temporelle
Page 33
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 33 Animation et commentaires audio (ou crits)
doivent-ils tre prsents simultanment Ou sparment ? Leffet de
contigut temporelle
Page 34
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 34 Effet de contigut temporelle blabla rtentiontransfert
rtentiontransfert blabla rtentiontransfert
Page 35
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 35 Le principe de contigut
Page 36
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 36 Mayer & Anderson, 1992 Le principe de
contigut
Page 37
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 37 Effet de modalit Le commentaire qui accompagne un
graphique ou une animation doit-il tre prsent sous une modalit
crite ou orale ? Mayer et Moreno, 1998
Page 38
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 38 Effet de modalit codage pictural codage verbal Modle
mental R verbale blabla D aprs Mayer (2001) slectionorganisation
intgration
Page 39
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 39 Effet de redondance Faut-il prsenter les commentaires
la fois loral et lcrit ? Ou uniquement loral ou uniquement lcrit
?
Page 40
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 40 Effet de redondance blabla Oral seul Lampoule doit
tre connecte la pile selon deux directions: lun des fils va au ple
positif, lautre au ple ngatif. Ecrit seul blabla Lampoule doit tre
connecte la pile selon deux directions: lun des fils va au ple
positif, lautre au ple ngatif. Oral et crit
Page 41
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 41 Effet de cohrence Quel effet de l ajout d
informations attractives (illustrations, exemples, sons, vidos...)
? Hypothse motivationnelle Hypothse de la charge cognitive Ex de
site Web : http://www.lesurbanophiles.com/
http://www.lesurbanophiles.com/
Page 42
Cours Ergonomie des Interactions Personne-Machine - M.
Btrancourt 42 Le design de document multimedia Un principe de base
: diminuer la charge cognitive inutile lie au traitement des
informations : - Perception, attention - Mise en relation entre
diffrentes sources - Informations et relations implicites