Styles Interaction

Interface Homme-
Machine
Interfaces graphiques (GUI)
 Dans la majorité des applications, la partie la plus importante de l'interaction homme-
machine fait appel aux périphériques de base qui sont : l'écran, le clavier et la souris.
 Progressivement, les interfaces en mode caractères (lignes de commandes entrées au

clavier) ont été substituées par des interfaces utilisant le mode graphique (Graphical
User Interface ou GUI).
 Les interfaces graphiques utilisent différents éléments visuels appelés Composants

graphiques ou Widgets ou Controls et qui, en combinaison avec l'utilisation de la
souris rendent les choses plus simples et plus intuitives pour l'utilisateur.
Parmi ces éléments visuels on peut citer :
 Les boutons (cases à cocher, bouton radio, etc)

 Les menus (menus déroulants, menus contextuels, etc)
 Les listes à choix (listes simples,…)
 Les champs de texte (champs simples, champ multilignes, éditeurs, etc)
 Les barres de défilement (ascenseurs)
 …
Styles d'interaction
 Les styles d'interaction (ou paradigmes d'interaction)
caractérisent différentes manières de dialoguer entre un
humain et une machine.
Quelques styles d'interaction :
1) Menus
Ce style d'interaction est conseillé quand le nombre de commandes
dépasse la capacité mémoire à court terme des utilisateurs.
L'utilisateur choisit dans une liste d'options l'objet plus adapté pour la
tâche. Si la terminologie et la signification des objets dans la liste sont
claires, les utilisateurs peuvent accomplir leur tâche avec peu
d'apprentissage.
 L'avantage principal est la structuration claire du
processus de décision, car seulement un nombre
limité de choix est présenté à la fois.
 Ce style d'interaction est approprié pour des

utilisateurs novices et occasionnels; il peut être mal
adapté aux utilisateurs expérimentés car les menus
sont à l'initiative de l'ordinateur et le dialogue est
plutôt lourd.
2) Styles en langage de commandes:
Ils permettent d'exprimer vite des commandes complexes.
Par contre,
 les erreurs sont très fréquentes,
 un long temps d'apprentissage est nécessaire pour apprendre
la syntaxe du langage et la mémorisation est difficile.
Ce style d'interaction est intéressant pour des utilisateurs
spécialistes qui aiment maîtriser l'interaction avec l'ordinateur et
avoir une expression plus rapide de l'interaction.
3) Interaction par formulaires (formfill-in) ou tableurs
Ce style d'interaction est utilisé principalement pour saisir des
données. Un formulaire donne une représentation visuelle
structurée des données. Le temps d'apprentissage est plutôt
modeste, car l'utilisateur doit seulement connaître les valeurs
permises et les méthodes d'entrée des données.
4) Langage naturel écrit ou parlé (query language, commande
vocale)
l'interface impose à l'utilisateur un dialogue de type
question/réponse.
 en théorie : le moyen le plus simple pour communique
 en pratique : peu utilisé pour la transmission de commandes
(simples)
La mise au point de ce style d'interaction

demande encore beaucoup d'efforts
de la part des chercheurs et
des développeurs de systèmes.
5) Navigation hypertextuelle (point-and-click)
6) Interaction gestuelle
7) Manipulation directe (édition WYSIWYG, interaction iconique)
 Ce style d'interaction (défini par Ben Schneidermanen 1983) donne à
l'utilisateur le sentiment d'un engagement direct dans l'action qu'il
effectue.
 L'interaction directe est particulièrement bien adaptée aux interfaces
avec écrans tactiles (smartphones, tablettes, …)
 La manipulation directe est caractérisée par trois principes directeurs :

 Représentation permanente des objets (généralement des icônes qui
ont un sens pour l'utilisateur)
 Utilisation d'actions physiques pour effectuer les opérations (soit
directement sur l'interface ou via un dispositif de pointage comme la
souris)
 Opérations incrémentales, réversibles et à effet visible
Interfaces orientées à la manipulation directe
 Les interfaces utilisateur qui intègrent des éléments graphiques

(composants visuels /Widgets/Controls) sont parfois désignées par
l'acronyme WIMP qui est l'abréviation de :
 Window: Notion de "fenêtre" (zone d'interaction indépendante) (c'est
une notion importante même si elle paraît évidente)
 Icon
 Menu: Choix d'actions parmi une liste proposée(barres de menu,
menus déroulants, menus contextuels, rubans, etc.)
 Menus pop-up: ils sont affichés quand l'utilisateur clique sur l'écran
avec la souris
 Menus pull-down: ils sont affichés en déplaçant le curseur sur une
barre de menu, qui contient un ensemble de titres. Quand
l'utilisateur clique sur un titre, un menu est affiché. Des raccourcis
peuvent être associés aux éléments des menus.
 Pointer: Curseur/Pointeur manipulé par un dispositif de pointage et
qui permet d'interagir avec les composants (pointage, sélection,
drag & drop)
Icônes
 Les icônes sont des représentations symboliques plus ou moins

abstraites (des graphismes) auxquelles on associe une
signification dans l'interface utilisateur .
 L'utilisation d'icônes présente différents avantages :
 Les icônes sont indépendantes de la langue
 Sur une même surface, les icônes peuvent contenir plus
d'informations que du texte
 Les icônes sont interprétées plus rapidement que du texte (pas
de lecture, reconnaissance globale)
 Lors du choix (ou de la conception) des icônes, il faut être attentif
à la connotation culturelle associée à certains graphismes (afin
d'assurer la compréhension auprès de tous les utilisateurs cibles).
Interprétation des icônes
 Différentes enquêtes montrent que les utilisateurs préfèrent les

interfaces comportant des icônes. Elles leur semblent plus faciles
à utiliser, plus conviviales et plus ludiques (attitude positive).
 Cependant, plusieurs expériences ont prouvé qu'avec les
icônes, les erreurs sont plus nombreuses qu'avec l'utilisation de
commandes identifiées par des textes (notamment durant la
phase d'apprentissage et chez les utilisateurs occasionnels).
Interprétation des icônes
 Les icônes peuvent jouer différents rôles :

 Objets avec lesquels l'utilisateur peut interagir
(bouton, barre d'outils)
 Compléter, renforcer l'importance d'une
information (icône d'avertissement dans une boîte
de dialogue par exemple)
Look-and-Feel
 La notion de look-and-feel(L&F) que l'on nomme parfois

style, skin, thème, …
 caractérise l'ensemble des aspects visuels de l'interface
graphique et de ses composants (graphisme, formes,
icônes, couleurs, textures, ombres, polices de caractères,
espacements, …).
 La manière dont les composants réagissent
(comportement) : Sélection, Exécution , Déplacement,
Menus contextuels, Bulles d'aides, Sons

Styles Interaction

Transféré par

Droits d'auteur :

Formats disponibles

Styles Interaction

Transféré par

Informations du document

Titre original

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

Styles Interaction

Transféré par

Droits d'auteur :

Formats disponibles

Interface Homme-

 Progressivement, les interfaces en mode caractères (lignes de commandes entrées au

 Les interfaces graphiques utilisent différents éléments visuels appelés Composants

 Les boutons (cases à cocher, bouton radio, etc)

 Ce style d'interaction est approprié pour des

La mise au point de ce style d'interaction

 La manipulation directe est caractérisée par trois principes directeurs :

 Les interfaces utilisateur qui intègrent des éléments graphiques

 Les icônes sont des représentations symboliques plus ou moins

 Différentes enquêtes montrent que les utilisateurs préfèrent les

 Les icônes peuvent jouer différents rôles :

 La notion de look-and-feel(L&F) que l'on nomme parfois

Vous aimerez peut-être aussi