Survol Ihm 2 0 M1 M2

interaction homme-machine :
un (presque) rapide survol

“The best way to predict the future is to invent it.”
Alan Kay (XEROX PARC)
http://www.irit.fr/~Philippe.Truillet
08 août 2006 v. 2.0
Université Paul Sabatier – Toulouse III

remerciements
Ce support est inspiré plus ou moins

largement de supports provenant de :
Sylvie Athènes
Michel Beaudoin-Lafon
Stéphane Chatty
Emmanuel Dubois
Jean-Daniel Fekete
Philippe Palanque
Jean-Luc Vinot
et sans doûte bien d’autres personnes ...
une réflexion pour commencer
« J’ai toujours rêvé d’un ordinateur qui soit

aussi facile à utiliser qu’un téléphone. Mon
rêve s’est réalisé : je ne sais plus comment
utiliser mon téléphone. »
Bjarne Stroustrup (concepteur du C++)

pourquoi les IHMs ?
les disparités d’interfaces sont très grandes

en raison :
des utilisateurs
des domaines d’application
des contextes d’utilisation
des contraintes (informatiques, économiques
voire politiques)
en perpétuelle évolution …

pourquoi les IHMs ?
3 évolutions
évolution des interfaces …

mode texte, WIMP, post-WIMP, multi-média,
multimodales, tangible, embodied, …
Ex : modèle BRETAM de Gaines

pourquoi les IHMs ?
3 évolutions
évolution des domaines d’application

calcul scientifique, informatique de gestion,
informatique de bureau, web, jeux,
informatique médicales, système de commande
et de contrôle, …

pourquoi les IHMs ?
3 évolutions
évolution des besoins
informatique
fonction, fiabilité, tolérance aux fautes
matériel
systèmes d’entrée, de sortie, performances, …
« FH » (facteurs humains)
utilisabilité, « user experience », « emotional interfaces »
réseaux
systèmes multi-utilisateurs, sans fils, ad hoc, massivement
multi-utilisateurs

interaction homme machine …
des raisons de s’y intéresser

Machintosh iMac Duo Core

1984 2006
2000 € x 0,9 1800 €
CPU 68000 0,7 MiPS x 6400 CPU Intel 4500 MiPs
128 kB RAM x 4000 512 MB
Disquette 400 KB x 650000 DD 250 GB
Ecran 9 pouces, N&B, x2 Ecran 20 pouces, couleur
512 x 342 x 10 1680 x 1050
Souris, clavier = Souris, clavier
Interface WIMP = InterfaceWIMP
qu’est-ce qui ne vas pas ?
la puissance des machines n’a pas permis
d’augmenter la productivité des utilisateurs
la recherche en IHM a avancé mais finalement
très peu de transferts vers l’utilisateur
le seul « vrai changement » n’est même pas dû
à la recherche …

définition
interaction homme-machine
discipline consacrée à la conception, la
mise en œuvre et à l’évaluation de systèmes
informatiques interactifs destinés à des
utilisateurs humains ainsi qu’à l’étude des
principaux phénomènes qui les entourent.

domaines abordés
tous et même plus

applications de bureau
systèmes temps réel critiques (ATC, spatial, …)
systèmes E/S
périphériques standards (clavier, souris, écrans)
périphériques exotiques (touchpad, PDA,
tangible, …)

introduction
émergence du domaine
dans les années 1980 aux USA (démocratisation
de l’informatique)
dans les années 1990 en France (Coutaz /

Caelen)

introduction
étude des phénomènes ...

cognitifs
matériels
logiciels
sociaux
mis en jeu dans l’accomplissement de tâches

sur support informatique

conférences
CHI (ACM)
Interact (IFIP)
HCI
IHM (AFIHM)
HCI International
…

des associations et ML
http://www.acm.org
http://www.ieee.org
http://www.ifip.or.at
http://www.afihm.org
http://www.irit.fr/SIGCHI

bibliographie
The Design of Everyday Things, Norman, MIT

Press, 4th printing, 2001
The Psychology of HCI, Card, Moran &
Newell, Lawrence Erlbaum, 1983
Usability Engineering, Rosson, Carroll,
Morgan Kaufmann Publishers, 2002
Designing the user interface, Shneiderman,
Plaisant, Pearson Eds, 4th edition, 2005

système interactif
interface noyau
utilisateur fonctionnel
Système interactif
Interface  communication (Canal, Langage, Sens)

Homme  tâche (facteurs humains)
Ordinateur  processus (logiciels)

historique de l’IHM
points de repère 1/7
Memex (Bush, 1945) : “as we may think”
définition du système hypertexte

Sketchpad (Sutherland, 1963)
manipulation directe de formes géométriques
avec le stylo optique (MIT)

NLS/Augment (Engelbart, 1968)
travail collaboratif, visio-conférence, partage
de documents, intuition d’internet, …
mais aussi invention de la souris (1963) !

Star (Xerox PARC, 1981)
station de travail et environnement de
programmation graphique
système fonctionnant en
réseau
interface graphique basée
sur la métaphore du
bureau
mais un échec commercial !

Macintosh (Apple, 1984)
barre de menu
boîtes de dialogue modales
un succès patent

X-Window (MIT, 1985)
modèle client/serveur
séparation quoi/comment
utilisation transparente du
réseau

World-Wide Web (Berners-Lee, CERN, 1990)
modèle hypertexte
en réseau
mais
des protocoles figés
des possibilités
d’interaction
(très) réduites

pourquoi s’intéresser à l’IHM ?
1/2
(Buxton)
le matériel progresse vite (loi de Moore)
les fonctionnalités aussi ! (Buxton)
mais pas l’humain …
 On arrive bientôt à la limite de perception

et d’action i.e. de la frustration pour
l’humain …
pourquoi s’intéresser à l’IHM ?
2/2
un sentiment de frustration, non ?

objectifs d’une interface
utilisateur
améliorer la communication
communication naturelle
cohérence inter et intra applications
choix d’une bonne métaphore
communication efficace
choix des styles d’interaction
structures de tâches et sous-tâches
étude de la fréquence des commandes
méta-communication

caractéristiques d’une bonne IHM
adaptée aux besoins

facile à apprendre
intuitive (prédictive)
rassurante (apprentissage par
essais/erreurs)
agréable (esthétique, dynamique, ludique)
performante (tâches rapides à exécuter,
réactions immédiates)
 utilité et utilisabilité
U&U
basique options
utilité
= adéquation aux besoins
utilisabilité
= adéquation aux capacités de l’utilisateur
Acceptabilité sociale
Utilité
Facilité d’apprentissage
Serviabilité
Acceptabilité dusystème Utilisabilité

Facilité d’appropriation
Coût Efficacité à l’usage
Acceptabilité Fiabilité Robustesse aux erreurs

pratique
Compatibilité /
existant Plaisir
etc.
U&U
Concepteur Utilisateur
Modèle de l'utilisateur Modèle du système
Modèle du système
modèle
représentation mentale conception interaction
dépend de la connaissance acquise

évolue dans le temps
modèles
du concepteur à propos de l’outil attendu
Système interactif
du concepteur à propos de l’utilisateur

de l’utilisateur à propos de l’outil attendu
de l’outil à propos de l’utilisateur
 L’IHM est l’unique passerelle entre l’utilisateur et
l’outil

U&U
dérives
60% des fonctions inutilisées - Apprentissage trop
long  logiciels administratifs : technopathie
Utiles mais inutilisables : domotique
Utilisables mais inutiles : nouvelles technologies ?

enjeux socio-économiques
l’IHM, sujet “à la mode”

presse, médias
industrie
recherche
a changé l’aspect du développement informatique
(80% du code est consacré à l’interface)
change le marché
informatique
non-informatique

exigences du marché
de plus en plus de produits efficaces

se tenir à jour avec la concurrence
garder la compétitivité de l’entreprise
impossibilité de revenir en arrière

il faut concevoir pour les NTIC ou savoir le
faire

dangers d’une mauvaise IHM
rejet (“technopathie”) par les utilisateurs

coût d’apprentissage (formation)
perte de productivité des utilisateurs
utilisation incomplète : manque à gagner
coûts de maintenance
perte de crédibilité

exemples de mauvaise conception
libellés non clairs ou ambigus

fonctionnalités inutiles
écrans trop denses, mal structurés
écrans trop nombreux
contexte inconnu ou oublié
…

modèle(s) de l’humain
quelle(s) capacité(s) de perception ?
quelle(s) capacité(s) de traitement ?
quelle(s) capacité(s) d’action ?

notion de perception
définition
Ensemble des mécanismes psychologiques et
physiologiques dont la fonction est de
prendre de l’information et de l’interpréter
pour élaborer un diagnostic
pour prendre une décision
pour construire un plan d’actions
pour emmagasiner des connaissances

le rôle du contexte
tâche de Stroop [1935] : énoncer les
couleurs de chaque mot
vert vert
rouge rouge
bleu bleu
orange orange
noir noir
violet violet
traitement automatique et non-intentionnel
des mots
effet d’interférence
le temps requis pour nommer la couleur de l’encre des
mots colorés est plus long aux essais incongruents
(rouge) qu’aux essais neutres (corbeille)
ou effet de facilitation
le temps de nomination de la couleur est plus court
aux essais congruents (bleu) qu’aux essais neutres

importance du contexte dans lequel se situe
l’objet perçu
A C D
2 4 5
possible ou pas ?

compréhension
nous percevons mieux ce qui a une
signification pour nous …
SCNDLXEAAU
SNDEACUAXL
SCANDALEUX

redondance
importance de la redondance
Aixsi, xoux poxvoxs rxmpxacxr cxaqxe

txoixièxe lxttxe pxe ux x, ex voxs vxus xn
txrex asxez xiex.
omettre beaucoup mots rend texte plus court.

Vous avez pas difficulté comprendre.
La chse deient u pe pls dffcie orqu nos

sppimns arémnt es etre.

sensations erronées
figures de Luckiesh (1965)
illusion de Müeller-Lyer (1889)

illusion correctrice
effets d’optique et correction d’optique

contraste de couleurs
contraste simultané
interaction de la couleur
instabilité optique et vibration
de la couleur

conception
modèle humain : processeur … 1/11
(Card, Moran, Newell, 1983)

l’humain est considéré comme un système
de traitement de l’information composé de
système :
sensoriel
moteur
et cognitif

conception
chaque sous-système possède :

une mémoire caractérisée par :
une capacité
une persistance
et un processeur caractérisé par :
un cycle

conception
le processeur humain : système sensoriel
Système sensoriel visuel Système sensoriel auditif
≤ 17 lettres ≤ 1500 ms
≥ 100 ms et ≤ 200 ms

conception
le processeur humain : système moteur
un mouvement est une suite de micro-
mouvements
L
plusieurs formulations
Mathématiques ! D
icône menu
D = 10 cm D = 30 cm
L = 1 cm L = 0,5 cm
T = 0,4 s T = 0,7 s
temps de pointage typique : entre 0,5 et 1 s

conception
expérience de Fitts (1954)

« tapping » alterné
loi déduite de l’expérience
Loi de Fitts
(reformulée par Mc Kenzie)
T=a + b log2(D/L + 1)

conception
le processeur humain : système cognitif

cycle reconnaissance/action
mémoire à court terme mémoire à long terme
 capacité limitée (mnèmes)  capacité illimitée
le stockage et la recherche dans la MLT sont

réalisés de manière associative

conception
loi de Hick-Hyman (1952-1953)

temps prévu lié au repérage d’un item parmi n
Loi de Hick-Hyman
T = b log2(n+1)
en cas de probabilités pi non égales
T = b ∑pi log2(1/pi+1)

conception
quelques résultats appliqués :

temps de réaffichage
effet d’animation si réaffichage < 1/10 s
suivi de la souris
vitesse maximale de la main : 1 à 1,5 m/s
le chiffre magique 7 +/- 2 (Loi de Miller, 1956)
ex : nombre de commandes maximales dans un menu
pour qu’elles soient mémorisables
autre exemple :
6, 4, 3, 1, 7, 1, 5, 9, 6, 7, 0, 1, 5, 3, 5, 8, 7, 6
conception
des modèles (Card, Moran, Newell)
GOMS (Goal Operator Method Selection)
cadre pour les méthodes de conception d’interfaces
évaluation prédictive des performances
Keystroke
décomposition en tâches élémentaires pour prédire le
temps d’exécution
opérateurs : K (frappe), P (désignation), H (retour de
la main), D (dessin), M (activité mentale), R (temps de
réponse du système)

conception
Keystroke : évaluation des temps des
différents opérateurs
K : 0,2 s
P : (entre 0,8 et 1,5 s) [Loi de Fitts]
H : 0,4 s
D : 0,9n + 0,16i (n : segments / i : longueur)
M : 1,35 ms
R : max(0,n-t) s (n : traitement du système / t :
temps exploité par l’utilisateur)

conception
Keystroke : déplacement d’un curseur d’un
traitement de texte
méthode : prendre la souris, la déplacer au point
désiré et sélectionner
Meth = H(souris)P(pointer)K(clic)H(retour)
ajout de l’activité mentale
Meth = HMPMKH
prise en compte de l’anticipation
Meth= HMPKH  Temps : 3,45 s

conception
applications :
claviers optimisés
pointage sémantique

conception
où l’on reparle de la loi de Fitts
l’importance de l’acquisition de cible est
incontestable : menus, boîtes de dialogue,
boutons, … et même le clavier
comprendre le processus d’acquisition de cible,

c’est garantir que la conception d’interface à
manipulation directe ne sera pas faite sur la base
de l’intuition.

conception
théorie de l’action 1/9
modélise les processus psychologiques qui
conduisent à un comportement (Norman)
réalisation d’une tâche :
établissement du but
formation d’une intention
spécification d’une suite d’actions
exécution des actions
perception de l’état du système
interprétation de l’état du système
évaluation de l’état par rapport au but fixé

conception
but
distances
distance
distance sémantique
sémantique intention évaluation de sortie
d’entrée
distance spéc. distance

interprétation
d’exécution actions d’évaluation
distance exécution perception distance

articulatoire articulatoire
d’entrée de sortie
système
conception
modèles perceptuel et conceptuel
modèle perceptuel : modèle mental construit par
l’utilisateur
modèle conceptuel : description et fonctionnement du
système réponses
opérations objets
feedback
commandes
la distance entre les deux modèles détermine

l’utilisabilité du système

conception
un exemple :
de quoi est fait ce dessin ?
comment est fait ce dessin ?
un ensemble de points que l’on peut effacer ?

un rectangle et un cercle que l’on peut déplacer ?

conception
notion d’affordance (Gibson)
l’affordance fait référence aux propriétés
réelles et perçues d’une chose, et
particulièrement à celles qui déterminent les
actions pouvant être entreprises sur la chose

conception

conception
un mauvais exemple et des solutions
“affordantes”
http://www.baddesigns.com

conception
d’autres exemples …

conception
un exercice :
des pièces à monter
question :
qu’est-ce que c’est ?
analyse …

conception
affordance des pièces (cylindres et trous)
des contraintes
physiques
repose sur les propriétés du monde physique
sémantiques
repose sur notre connaissance de la situation et du monde
culturelles
repose sur des conventions culturelles (exemple : les phares)
logiques
exemple : toutes les pièces doivent être utilisées

conception
construction du modèle perceptuel
affordance du système
liens de causalité possibles
contraintes (physiques) du système
stéréotypes culturels
expérience
instructions d’usage
…

UCD : User Centered Design
Norme ISO 13407 (1999)

- en français : CCU (Conception Centrée Utilisateur) -
Constat : les utilisateurs finaux sont les
mieux placés pour évaluer et influencer le
développement d'un produit
Conséquence : La CCU impose que le
développement du produit doit être guidé
par les besoins des utilisateurs plutôt que
par les possibilités technologiques
méthode
IHM : vue de l’utilisateur sur le système

commencer le développement informatique
par l’IHM afin
d’éviter les phénomènes de rejet ou sous-
utilisation
favoriser l’appropriation rapide
processus itératif et participatif

méthode
conception centrée utilisateur
observation sur le terrain
scénarios
maquettage
évaluation centrée utilisateur
formative : régulière
prédictive : sans utilisateur
expérimentale : avec utilisateur
maquettes
prototypes
magicien d’Oz

scénarios et prototypage
complément au développement structuré
les concepteurs développent un ou plusieurs
modèles opérationnels pour démontrer une
idée
le prototype implémente des idées les
rendant :
concrètes
visibles
testables

scénarios et prototypage
les résultats permettent :

de guider les développements futurs
de valider ou rejeter des aspects de la
conception

conclusion
Une IHM, c’est comme une maison :

il faut de nombreuses compétences
pour la construire
il faut comprendre les besoins pour concevoir et

concevoir et maquetter pour comprendre les besoins
…
c’est aussi un cycle à adapter en fonction du temps,
du type d’applications, de la maturité des
technologies, …

ergonomie
définie en 1988 par la Société d'Ergonomie

de Langue Française
définition : “la mise en œuvre de
connaissances scientifiques relatives à
l’homme, et nécessaires pour concevoir des
outils, des machines et des dispositifs qui
puissent être utilisés avec le maximum de
confort, de sécurité et d’efficacité pour le
plus grand nombre”

ergonomie
puise ses fondements dans la diversité et la

variabilité des êtres humains et des
situations d'usage
dans ces diversité et variabilité, des
déviations peuvent apparaître entre tâches
prescrites et effectives. L’ergonomie vise à
réduire ces écarts par la proposition de
systèmes ajustés à l'homme

ergonomie
mais l’ergonomie ne s’arrête pas à cette

incorporation de connaissances
elle fournit des méthodes et outils
d’analyse de l’activité humaine au travail
observations et restitutions
établissement de groupes et de dynamiques de
travail
évaluation de maquettes
questionnaires et entretiens

ergonomie
Sciences Humaines Terrain
Sociologie
Physiologie Psychologie
ERGONOMIE
Sélection / Contextualisation Observation / Analyse / Recueil
Informatique
Ingénierie anthropocentrée

ergonomie
dans sa quête de compatibilité homme-machine,

l'ergonomie travaille à trois niveaux :
au niveau physique, pour une adéquation entre
l’homme d’un point de vue morphologique et son poste
de travail
au niveau social, pour un environnement de travail
compatible des attentes des utilisateurs
au niveau cognitif, pour un traitement et une
représentation des informations conformes aux attentes
et capacités des utilisateurs
= Ergonomie des logiciels

ergonomie des logiciels
pour chaque niveau : des recommandations

ergonomiques
recensées dans des guides ergonomiques
mais, volume et généralité dissuadant ...
 critères ergonomiques organisant ces

recommandations

critères ergonomiques
Scapin/Bastien, INRIA Rocquencourt

consensus établi autour de ces critères
8 critères :
guidage
charge de travail
contrôle explicite
adaptabilité
gestion des erreurs
homogénéité/cohérence
signifiance des codes et dénominations
compatibilité

nouveaux paradigmes de l’IHM
Bande passante système pervasif
Bande passante système Interactif
Bande passante d’interaction
Utilisateur Système

applications tangibles
pick and drop
itsy

multimodalité en situation de mobilité

réalité mixte
symbiose entre les mondes réel et virtuel
Monde Monde
Réalité Mixte
Numérique Réel

réalité mixte
Monde Monde
Virtualité Augmentée
Numérique Réel
IHM clavier IHM gestuelle IHM vestimentaire
IHM graphique IHM tangible

réalité mixte
Monde Monde
Numérique Réalité Augmentée
Réel
2D 3D Son Force ... Action

réalité mixte
symbiose entre les mondes réel et virtuel
Monde Monde
Numérique Réalité Mixte Réel
Virtualité Réalité
augmentée augmentée
L’homme L’homme
devant la autour de
machine la
machine

aller plus loin que WIMP … 1/6
de nouveaux interacteurs apparaissent :
pie menus (Don Hopkins)
marking menus

fish-eye view
(Univ. Grenoble)
hyperbolic
view
(Star Tree
Studio)
http://www.inxight.com

Tree Map (GUIR Berkeley)
http://www.cs.umd.edu/hcil/treemap

mais aussi d’autres façons d’interagir !
interaction gestuelle, bi-manuelle, tactile, …
digistrips
(CENA Toulouse)

interaction multimodale
réalité augmentée, mixte, …
Réalité Augmentée
(AR Toolkit)
http://www.hitl.washington.edu
/research/shared_space

pour des interfaces
“humaines”
coopératives
écologiques voire “invisibles”

question d’éthique …
création de nouvelles formes d’interaction

éthiquement correct ?
démarche conséquentialiste (ex : mediaspace)
conception, mise en oeuvre
en entrée : instrumente l’environnement
caméras ?
exploitation (détournement) ?
en sortie : information située
contexte multi-utilisateurs ?
respect de la vie privée ?
évaluation
Magicien d’Oz
conclusions
beaucoup de problèmes, on a
des solutions à certains problèmes
des problèmes pour certaines solutions
des problèmes sans solutions
des solutions mais sans problèmes …
des contraintes fortes
des enjeux importants

conclusions
on sait faire beaucoup de choses mais il

reste :
beaucoup à apprendre
beaucoup à inventer …

Survol Ihm 2 0 M1 M2

Încărcat de

Informații document

Titlu original

Drepturi de autor

Formate disponibile

Partajați acest document

Partajați sau inserați document

Opțiuni de partajare

Vi se pare util acest document?

Este necorespunzător acest conținut?

Drepturi de autor:

Formate disponibile

Survol Ihm 2 0 M1 M2

Încărcat de

Drepturi de autor:

Formate disponibile

interaction homme-machine :

un (presque) rapide survol

Université Paul Sabatier – Toulouse III

Ce support est inspiré plus ou moins

« J’ai toujours rêvé d’un ordinateur qui soit

Bjarne Stroustrup (concepteur du C++)

Université Paul Sabatier – Toulouse III

les disparités d’interfaces sont très grandes

Université Paul Sabatier – Toulouse III

évolution des interfaces …

Ex : modèle BRETAM de Gaines

Université Paul Sabatier – Toulouse III

évolution des domaines d’application

Université Paul Sabatier – Toulouse III

Université Paul Sabatier – Toulouse III

Université Paul Sabatier – Toulouse III

Machintosh iMac Duo Core

Université Paul Sabatier – Toulouse III

Université Paul Sabatier – Toulouse III

tous et même plus

Université Paul Sabatier – Toulouse III

dans les années 1990 en France (Coutaz /

Université Paul Sabatier – Toulouse III

étude des phénomènes ...

mis en jeu dans l’accomplissement de tâches

Université Paul Sabatier – Toulouse III

Université Paul Sabatier – Toulouse III

Université Paul Sabatier – Toulouse III

The Design of Everyday Things, Norman, MIT

Université Paul Sabatier – Toulouse III

Interface  communication (Canal, Langage, Sens)

Université Paul Sabatier – Toulouse III

Université Paul Sabatier – Toulouse III

Université Paul Sabatier – Toulouse III

Université Paul Sabatier – Toulouse III

Université Paul Sabatier – Toulouse III

Université Paul Sabatier – Toulouse III

Université Paul Sabatier – Toulouse III

Université Paul Sabatier – Toulouse III

 On arrive bientôt à la limite de perception

un sentiment de frustration, non ?

Université Paul Sabatier – Toulouse III

Université Paul Sabatier – Toulouse III

adaptée aux besoins

Acceptabilité dusystème Utilisabilité

Coût Efficacité à l’usage

Acceptabilité Fiabilité Robustesse aux erreurs

dépend de la connaissance acquise

du concepteur à propos de l’utilisateur

Université Paul Sabatier – Toulouse III

Utiles mais inutilisables : domotique

Utilisables mais inutiles : nouvelles technologies ?

Université Paul Sabatier – Toulouse III

l’IHM, sujet “à la mode”

Université Paul Sabatier – Toulouse III

de plus en plus de produits efficaces

impossibilité de revenir en arrière

Université Paul Sabatier – Toulouse III

rejet (“technopathie”) par les utilisateurs

Université Paul Sabatier – Toulouse III

libellés non clairs ou ambigus

Université Paul Sabatier – Toulouse III

quelle(s) capacité(s) de perception ?