La présentation est en train de télécharger. S'il vous plaît, attendez

La présentation est en train de télécharger. S'il vous plaît, attendez

INTRODUCTION AUX INTERFACES HOMME-MACHINE

Présentations similaires


Présentation au sujet: "INTRODUCTION AUX INTERFACES HOMME-MACHINE"— Transcription de la présentation:

1 INTRODUCTION AUX INTERFACES HOMME-MACHINE

2 pdf de ces transparents disponibles sur :
rubrique Enseignement>Matières>ISTI

3 En bref… 1.Introduction 2.Eléments de psychologie appliqués aux systèmes interactifs 3.Historique de l'Interaction Homme-Machine 4. Styles de systèmes interactifs 5. Périphériques et interaction 6. Les tâches d’un système interactif 7. Conception d'une IHM 8. Réalisation d'une IHM 9. Evaluation d'une IHM 10. IHM et Réalité Virtuelle

4 Définition : interface
application informatique qui prend en compte, au cours de son exécution, des informations communiquées par le ou les utilisateurs du système, et qui produit, au cours de son exécution, une représentation perceptible de son état interne entrées fournies par l'utilisateur dépendent des sorties produites par le système, et inversement applications "batch"  systèmes interactifs Différentes des applications de type "batch" qui lisent, au début de leur exécution, des données prédéfinies, et produisent à la fin de leur exécution des résultats. Classiquement, on décompose un système interactif en 2 parties : l'interface utilisateur et le noyau fonctionnel. L'interface utilisateur contient les éléments logiciels et matériels dédiés à la capture des entrées de l'utilisateur et à la restitution des sorties du système. Le noyau fonctionnel contient le reste du système, càd ses composants de calcul et de stockage de l'information. Ces deux parties ne sont pas forcément des modules logiciels indépendants. Interface  Noyau fonctionnel

5 Perception sens principal = vue système visuel imparfait
présentation de l'information essentiellement visuelle système visuel imparfait peut facilement être trompé Chez l'humain, le sens principal est la vue. La présentation d'information dans les systèmes interactifs est donc aujourd'hui essentiellement visuelle. Mais la surcharge du canal visuel et la stagnation des technologies de présentation vont certainement conduire à une exploitation croissante des autres sens.

6 d'où provient ce trou ? Triangle vert = pente 2/5
Triangle rouge = pente 3/8 Donc les 2 grands triangles n’ont pas la même surface ……….. d'où provient ce trou ?

7 Perception caractéristiques de la vue : champ
proche de 180° acuité (taille minimale des objets observables) trait d'un pixel : épaisseur d'env. 0,3mm soit 10 fois l'acuité visuelle couleur complexe dépend souvent de la couleur de fond mouvement fusion entre percepts successifs profondeur combinaison de différentes visions (stéréoscopique, active, etc.) Champ : les caractéristiques de la vision sont différentes entre le centre et la périphérie. La vision périphérique est plus sensible aux mouvements et moins aux couleurs. Acuité : un trait noir de 0,04mm d'épaisseur sur un fond blanc peut être distingué par un individu à une distance de 50cm. Sur les écrans actuels, un trait a une épaisseur d'environ 0,3mm soit presque 10 fois l'acuité visuelle. Couleur : la perception de la couleur est très complexe et dépendante du contexte. Ainsi, une même couleur sera perçue différemment en fonction de la couleur de fond (voir transp. suivant). Mouvement : l'œil est capable de percevoir le mouvement grâce à des récepteurs spécialisés et grâce à la fusion entre percepts successifs. Profondeur : la perception de profondeur est possible par la combinaison de la vision stéréoscopique (courte distance) et de la vision active (plus loin, on bouge la tête et le corps + perspectives, etc.)

8

9 Couplage action-perception
difficile de séparer la perception de l'action boucle perception-action ex : saisie d'un objet met en jeu la vue puis le toucher trajectoire réajustée en fonction de la perception visuelle puis tactile

10 Action physique la main est la plus utilisée par les systèmes interactifs (presque unique) la main est guidée par la vue systèmes périphériques ne sont pas équivalents pour l'utilisateur : souris pour pointer et cliquer tablette + stylet pour signer ou dessiner etc. L'action manuelle est pratiquement le moyen d'action unique des systèmes interactifs actuels.

11 Loi de Fitts t = 0.1 log (2D/L)
exemples pour le pointage à la souris :  utilisation de raccourcis action D L temps icône 10 cm 1 cm 0.4 s trait 1 mm 0.8 s menu 5 mm 0.7 s Paul Fitts a découvert une loi empirique pour les tâches de pointage. Il s'agit de pointer avec le doigt, une cible circulaire de taille L à une distance D. Le temps de pointage est plus long si la cible est plus éloignée ou plus petite. Elle s'applique aussi au pointage avec une souris. Un temps de pointage typique est compris entre 1/2 et 1 seconde. Dans les logiciels actuels, l'utilisation d'équivalents claviers et accélérateurs divers (raccourcis) est souvent un moyen d'éviter des pointages longs et il est caractéristique d'observer que les utilisateurs experts expoitent au maximum ces raccourcis.

12 Rôle des mains Les deux mains coopèrent
rôles distincts : main non-dominante situe le contexte main dominante agit actuellement, les systèmes interactifs expoitent peu l'interaction bimanuelle actuellement, les systèmes interactifs expoitent peu l'interaction bimanuelle : la frappe au clavier est certes bimanuelle, mais les deux mains ont un rôle parfaitement symétrique. Les interfaces sont munies d'un seul dispositif de désignation (souris) manipulé par la main dominante. Une forme primitive d'interaction bimanuelle apparaît cependant dans certains cas, lorsque la main non-dominante sélectionne au clavier, par des raccourcis ou des touches de fonctions, un mode qui détermine les actions que peut réaliser la main dominante par l'intermédiaire de la souris.

13 Cognition : mémoire et apprentissage
mémoire sensorielle associée aux sens très court laps de temps (env. ¼ sec.) mémoire à court terme stocke un nombre limité de mnèmes (env. 7) durée limitée à quelques dizaines de secondes mémoire à long terme capacité infinie temps de stockage infini mnème : unité d'information de la mémoire (images, lettres, sons, …) La mémoire sensorielle est associée aux sens et stocke l'information sensorielle pendant un court laps de temps (de l'ordre de ¼ de seconde), probablement afin de l'encoder avant qu'elle ne soit stockée dans la mémoire à court terme. La mémoire à court terme permet de stocker un nombre limité de mnèmes pendant une durée de quelques dizaines de secondes au maximum. Ainsi lorsqu'on lit un numéro de téléphone dans un annuaire, on le mémorise suffisamment pour pouvoir le composer mais il est improbable qu'on s'en rappelle même 5 mn. après. La capacité de la mémoire à court terme est très faible, de l'ordre de 7 mnèmes. La mémoire à long terme est mal connue, mais on considère que sa capacité et son temps de stockage sont inifinis.L'un des mécanismes pour que des informations passent de la mémoire à court terme à la mémoire à long terme est la répétition : pour se rappeler un numéro de téléphone (par ex. s'il est occupé), on le répète pour être sûr de ne pas "le perdre".

14 Cognition : mémoire et apprentissage
tenir compte de ces propriétés de la mémoire dans la conception d'un système interactif mémoire à court terme limiter le nombre d'items d'un menu à 7 ne pas obliger à garder en mémoire l'état du système mémoire à long terme la répétition permet la mémorisation utilisateur régulier se sert de raccourcis pour les actions les plus utilisées La mémoire à court terme peut être vue comme une mémoire de travail. Sa faible capacité doit être prise en compte lorsque l'on conçoit un système interactif : par exemple, il est préférable de limiter le nombre d'items dans un menu à 7 environ, et il faut éviter d'obliger l'utilisateur à garder en mémoire des informations sur l'état du système (comme par exemple le mode courant), qui mobilisent inutilement sa mémoire à court terme. L'impact de la mémoire à long terme sur la conception de systèmes interactifs est lié à la répétition : un utilisateur régulier d'un logiciel mémorisera progressivement la liste des commandes des menus qu'il utilise le plus souvent. En présentant des équivalents clavier de ces commandes dans les menus eux-mêmes, l'utilisateur peut apprendre les raccourcis qui lui feront gagner du temps.

15 Cognition : résolution de problèmes
processus de la résolution de problèmes décomposition en sous-problèmes stratégie pour atteindre le but F depuis un état de départ D en passant par un but intermédiaire I : D I Ir F A défaire réparer poursuivre On cherche à atteindre un état final F à partir de l'état de départ D. Si l'on ne sait pas atteindre F par une action simple, on décompose le problème en sous-problèmes, c'est-à-dire que l'on se fixe un but intermédiaire I, que l'on cherche à atteindre depuis D. Supposons que l'on pense atteindre I depuis D par l'action A. On exécute l'action A, et l'on compare l'état obtenu Ir à l'état attendu I. S'il y a identité entre Ir et I, on peut poursuivre la résolution en essayant d'atteindre F à partir de I. Si Ir est différent de I, on peut essayer de défaire l'action A pour revenir à l'état initial D, ou l'on peut essayer de réparer l'erreur pour aller de Ir à I, ou enfin on peut se satisfaire de cet état et essayer d'aller à F depuis Ir.

16 Cognition : résolution de problèmes
Théorie de l'action (de Don Norman) déroulement du processus mental but intention évaluation distance d'évaluation spec. actions interprétation 1ère étape à partir du but : l'intention, càd le choix de la méthode d'action. L'avantage de cette description de l'activité de l'utilisateur est de mettre en évidence ce que Norman appelle des distances : distance d'exécution entre le But et le Système dans la branche descendante et distance d'évaluation entre le Système et le But dans la branche ascendante. L'évaluation de ces distances pour un système donné permet d'avoir une idée de sa difficulté d'utilisation. Supposons par exemple que l'utilisateur ait détruit un fichier avec un shell Unix. La réponse du système est de lui rendre la main, à moins qu'une erreur ne se soit produite. L'utilisateur doit donc interpréter l'apparition du "prompt" comme le fait que la commande s'est bien déroulée et que le fichier a bien été détruit. Beaucoup d'utilisateurs, même experts, préfèrent s'en assurer en exécutant la commande "ls" et en vérifiant que le fichier a bien disparu, c'est-à-dire en exécutant un nouveau cycle dont le but est "vérifier que le fichier a bien été détruit". Cela traduit à l'évidence le fait que la distance d'évaluation est trop grande. Dans une interface iconique comme le Finder du Macintosh, lorsque l'on détruit un fichier en l'amenant dans la poubelle, celle-ci change de forme, et l'icone du fichier a bel et bien disparu : la distance d'évaluation est plus faible. distance d'exécution exécution perception système

17 Cognition : résolution de problèmes
en réalité : adaptation constante de l'homme au contexte La résolution de problèmes est donc un processus incrémental et non pas une activité planifiée le comportement d'usagers, surtout dans des situations non standard (mais prévues), est très variable et se conforme rarement aux procédures chaque utilisateur invente ses propres méthodes de résolution de problème La Théorie de l'Action ne doit pas faire croire que l'utilisateur planifie ses actions longtemps à l'avance. En réalité, l'activité humaine s'adapte constamment au contexte de son exécution et à son propre déroulement : on parle d'action en situation ("situated action"). La résolution de problème est donc un processus incrémental et non pas une activité planifiée. Même dans les activités qui semblent extrêmement codifiées, comme par exemple le pilotage d'un avion, le contrôle du trafic aérien, la surveillance d'une centrale nucléaire, la construction d'un satellite, etc., où des milliers de pages de documentation décrivent toutes les procédures pas à pas, on constate que le comportement des usagers, surtout dans des situations non standard (mais prévues), est très variable et se conforme rarement aux procédures. L'utilisation d'un système informatique suit la même règle : chaque utilisateur, en fonction de son environnement, de ses habitudes, des modèles mentaux qu'il s'est construits en utilisant le système, mais aussi d'autres systèmes, invente ses propres méthodes de résolution de problème, avec le plus souvent pour seul guide l'efficacité immédiate plutôt que la compréhension profonde du fonctionnement réel du système. Cette caractéristique doit être prise en compte lors du développement du système, notamment en adaptant celui-ci aux utilisateurs visés, en conduisant des études d'utilisabilité avec des utilisateurs réels, et même si possible en impliquant les utilisateurs dès la conception du système. Si les utilisateurs sont par nature imprévisibles (et c'est la raison pour laquelle les systèmes interactifs sont des systèmes ouverts), il sont aussi beaucoup plus susceptibles d'adopter un système s'ils ont participé à sa mise en oeuvre (comme le montrent divers travaux de psychologie sociale).

18 Historique de l'IHM 1945 : Vannevar Bush, « As We May Think »
système imaginaire de navigation, indexation, annotation 1963 : Ivan Sutherland, « SketchPad » (outil de dessin) contraintes pour la construction de structures hiérarchiques écran = oscilloscope ; crayon optique 1968 : Douglas Engelbart, « NLS-Augment » traitement de texte hiérarchique, multimédia, hypertexte invention de la souris ; des fenêtres . 70's : Alto : première station à écran « graphique » + souris fenêtres, menus, barres de défilement, sélection directe à la souris 1981 : Star ( Macintosh) bureau, icônes, WYSIWYG Une « interface graphique », ou « Graphic User Interface », c’est un écran à plusieurs fenêtres ; c’est une représentation des objets de l’application par des icônes ; c’est le recours systématique aux menus et dialogues ; c'est leur manipulation par une souris. Ainsi, à partir de la métaphore du bureau, l’idée a été de séparer l’écran en fenêtres (ce qui structure l’information), de représenter les composants de l’application par des icônes, de guider l’utilisateur dans ses actions à l’aide de menus, et de lui permettre de manipuler tout ce petit monde de façon "directe", avec une souris (cf. théorie de l'action de D. Norman). La paternité de ces idées (comme de l’hypertexte) est semble-t-il attribuée à Engelbart. L’environnement de programmation de Smalltalk, développé au Xerox Park par Alan Kay et al., fut le premier à disposer de fenêtres qui pouvaient se chevaucher et être déplacées. Le premier système entièrement basé sur ces principes à avoir été largement commercialisé est le Macintosh d’Apple. WIMP (Windows, Icons, Menus and Pointing device) Alan Kay et al. at Xeroc PARC (Palo Alto Research Center) in the 1970s : Dynabook, Xerox Star.

19 Historique de l'IHM Années 70-80 : peu de code pour l’interface
Utilisateur expert (programmeur) → unique Ordinateur lent Entrées/sorties limitées Années 90 : l’interface atteint parfois 80% du code des applications Machines bien plus rapides, affichages graphiques Grand public → groupes, organisations Amélioration/diversification des dispositifs Dans les années 80, les utilisateurs d'ordinateurs sont des spécialistes expérimentés, ils travaillent sur des stations ou des gros systèmes, qui ne disposent pourtant pas de la puissance des PC actuels, notamment en matière de rapidité de calcul, de mémoire vive et d'affichage. La technologie des ordinateurs évolue très vite, l'IHM en profite : après l'étude de l'utilisateur, la proposition des principes d'utilisabilité, les IHM ont eu à intégrer la dimension multi-utilisateur, le travail coopératif, le travail à distance, etc. Par ailleurs, on est passé des saisies en ligne de commandes dans des langages proches des assembleurs, aux claviers, souris, et maintenant gant tactile, voix ou regard...

20 Mais… interface standard sous Unix => X-Window System
l'utilisation de l'informatique n'a pas augmenté la productivité des "cols blancs" n'a pas réduit la quantité de papier (au contraire…) systèmes interactifs pas encore au point… ! Malgré cette profusion d'inventions, qu'il faudrait compléter par tous les travaux, moins spectaculaires mais indispensables, de nombreux chercheurs et praticiens, il faut reconnaître que les systèmes interactifs actuels sont souvent loin des attentes des utilisateurs. Des études ont montré que l'utilisation de l'informatique n'a pas augmenté la productivité des "cols blancs", et il n'est pas besoin d'étude pour constater que l'informatique n'a pas réduit la quantité de papier que l'on est amené à manipuler, mais au contraire l'a fait augmenter. C'est la preuve que la conception de systèmes interactifs de qualité est encore un domaine mal maîtrisé et souvent sous-estimé.

21 Catégories de systèmes interactifs
styles d’interaction : méthodes, techniques, règles d’interaction des systèmes interactifs style conversationnel style par manipulation directe style par reconnaissance de traces

22 Catégories : style conversationnel
systèmes conversationnels simples le plus ancien, inspiré de la conversation taper du texte au clavier exécution après validation Dans un système conversationnel, les commandes sont fournies en tapant un texte au clavier, généralement une ligne terminée par un retour-chariot. Un feed-back permet à l'utilisateur de voir ce qu'il tape (et de le corriger), mais la commande n'est exécutée que lors de sa validation. A ce moment-là, la commande est interprétée et transformée en opérations sur les objets internes du systèmes (voir le modèle conceptuel générique de la figure 2). Le système fournit alors une réponse qui est soit un message d'erreur, soit le résultat, éventuellement vide, de la commande. L'utilisateur peut alors entrer une nouvelle commande, etc. Les shells de commandes comme ceux d'Unix sont des exemples de systèmes conversationnels.

23 Catégories : style conversationnel
systèmes conversationnels simples avantages possibilité de programmer ses propres commandes inconvénients l'utilisateur doit apprendre le langage de commande distances d'exécution et d'évaluation grandes séquencement strict actions / réponses difficile de mener plusieurs tâches simultanément

24 Catégories : style conversationnel
menus, formulaires extension du précédent langage de commande explicite les commandes sont stockées dans des listes il suffit de choisir la commande remplissage de formulaire puis validation  exécution applications : Minitel, applications de gestion

25 Catégories : style conversationnel
menus, formulaires avantages guidage des actions par menus l'utilisateur n'a plus besoin d'apprendre le langage noms des champs dans les formulaires pas d'ordre pour le remplissage, facilité de modification forme graphique, boutons OK, etc. inconvénients tâches prédéfinies (dans la liste) pas plusieurs tâches simultanément souvent pas programmables Les systèmes à base de menus et de formulaires imposent, comme les systèmes conversationnels, un dialogue strict entre l'utilisateur et le système. Cependant, ces systèmes assistent l'utilisateur en lui fournissant des informations permettant de guider ses actions : liste des commandes disponibles dans les menus, noms des champs dans les formulaires, etc. De plus l'interaction avec un formulaire n'impose pas d'ordre de remplissage et en cas d'erreur, il n'est en général pas nécessaire de tout re-saisir. Le fait de présenter les objets informatiques sous une forme graphique et la possibilité d'agir directement sur ces objets (cliquer dans un champ pour le remplir, sur un bouton OK pour valider) renforce la sensation d'engagement de l'utilisateur. L'inconvénient de ce style d'interaction est qu'il ne peut convenir qu'à des tâches prédéfinies. Comme pour le style conversationnel, il n'est en général pas possible de traiter plusieurs tâches en parallèle ou même hiérarchiquement. Par exemple, si l'un des champs à saisir est un numéro de client et que l'on ne connaît que son nom, il faudrait pouvoir utiliser le formulaire d'accès à la base de données des clients, sans avoir à abandonner le formulaire en cours. Enfin, les systèmes à base de menus et de formulaires ne sont en général pas programmables par l'utilisateur : si l'on utilise souvent le même formulaire avec les mêmes valeurs de champs, il est probable que l'on doive les entrer à chaque fois.

26 Catégories : style conversationnel
Navigation (hypertexte) ensemble de nœuds système de liens pour les relier actions : sélectionner un lien revenir en arrière / en avant wavigation directe par sélection d’un noeud WWW (Netscape, Mosaic, etc.), Emacs

27 Catégories : manipulation directe
idée : objets informatiques  objets physiques métaphore du bureau, icônes Actions sur ces icônes grâce à la souris commandes plus intuitives 4 principes de la manipulation directe : affichage permanent des objets d'intérêt action directe sur les objets d'intérêt actions incrémentales et réversibles dont l'effet est immédiatement visible structuration de l'interface en couches Le terme de manipulation directe a été inventée par Ben Shneiderman en 1983, inspiré par certains logiciels de l'époque, notamment les premiers tableurs et les jeux vidéo. Shneiderman caractérise les applications à manipulation directe par 4 principes : affichage permanent des objets d'intérêt (les objets d'intérêt sont les objets qui ont un sens pour l'utilisateur, qui appartiennent à son modèle mental : par exemple les mots, lignes et paragraphes d'un texte) ; action directe (via un dispositif de désignation comme la souris) sur les objets d'intérêt plutôt que syntaxe complexe ; actions incrémentales et réversibles dont l'effet sur les objets d'intérêt est immédiatement visible ; structuration de l'interface en couches afin de faciliter l'apprentissage.

28 Catégories : manipulation directe
avantages permet de traiter des tâches non prédéfinies édition de texte, dessins, schémas, partitions, etc. couplé avec le multi-fenêtrage plusieurs tâches de façon entrelacée transfert de données par cliquer-tirer ou couper-coller inconvénients programmation (automatisation de tâches) par l'utilisateur difficile souvent pas exploité correctement  manipulation indirecte

29 Catégories : manipulation directe
2 catégories répandues d'interfaces à manipulation directe : édition de documents principe du WYSIWYG forme du document à l'écran la plus proche possible de sa forme imprimée interaction iconique icône = représentation graphique d'un objet ou d'un concept aisément reconnaissable, mémorisable, différentiable Sélection, déplacement des icônes, etc.

30 Catégories : reconnaissance de traces
principe reconnaître les mouvements du périphérique de localisation par rapport à un vocabulaire gestuel prédéfini PDA

31 Autres styles adaptés à de nouvelles technologies réalité virtuelle
utilisation de matériel et système appropriés réalité augmentée ex : feuille de papier comme interface caméra capture le mouvement d'écriture projecteur affiche les traits sur la feuille interaction multimodale combinaison de modes d'interactions (parole/geste par ex.)

32 Périphériques de sortie
Écrans : CRT LCD autres (spécifiques) Caractéristiques : persistance cycle de rafraîchissement vitesse de balayage horizontale résolution CRT : Tube à Rayons Cathodiques LCD : Ecran à Cristaux Liquides (Liquid Cristal Display) - persistance : durée de l’intensité lumineuse des phosphores ~ 10 à 60 microsecondes - cycle de rafraîchissement : nombre de fois par seconde que l’image (c'est-à-dire tous les pixels de l’écran) est réaffichée ~ 60x par seconde = F fréquence de rafraîchissement. Si le cycle diminue, on observe un phénomène de papillotement. Plus le taux de rafraîchissement est élevé, moins les yeux fatiguent. - vitesse de balayage horizontale : nombre de lignes par seconde qu’il est possible d’afficher  balayage simple : toutes les lignes sont balayées par le faisceau de gauche à droite, de haut en bas, avec une fréquence F  balayage entrelacé : 1 premier balayage des lignes impaires, puis 1 deuxième balayage des lignes paires. La fréquence F est celle de chaque balayage. D’où l’impression de voir 2x plus d’image/seconde qu’avec un balayage simple. - résolution : distance entre les lignes extrêmes / nombre de lignes. Plus le faisceau est petit, plus on peut obtenir une haute résolution.

33 Périphériques d’entrée
tablette graphique souris trackball joystick touchpad écran tactile Les tablettes Les tablettes graphiques fonctionnent selon différents principes. Elles ont en commun l'utilisation d'un stylet ou d'un "puck", souvent muni de boutons. Leur bonne résolution les rendent particulièrement adaptées à des tâches précises ou d'arts graphiques. Certaines tablettes captent, en plus de la position, la pression, voire l'inclinaison du stylet. Les souris, trackball et joystick Les souris sont les périphériques d'entrée les plus répandus, grâce à leur faible coût, leur polyvalence et leur faible encombrement. Elles sont soit mécaniques, soit optiques (de plus en plus utilisé). Les trackballs peuvent être décrites comme des souris mécaniques inversées. Elles ont l'avantage d'un encombrement très faible et d'une position fixe. Cependant, la précision est en général moins bonne que celle d'une souris. Les joysticks sont munis de ressorts qui ramènent le manche à sa position de repos. Certains joysticks sont à jauge de contrainte : c'est l'effort sur le manche à balai qui est mesuré et non pas son déplacement. Les joysticks contrôlent la vitesse du curseur plutôt que sa position, ce qui introduit une indirection qui peut poser des problèmes à certains utilisateurs. Certains joysticks offrent un 3ème degré de liberté avec la rotation du manche sur lui-même. Certains sont munis du retour d’effort. Les touchpads et écrans tactiles Les touchpads sont généralement utilisés sur les ordinateurs portables. Il s’agit d’une surface rectangulaire tactile, permettant de repérer la position du doigt, son déplacement, ou une pression furtive pouvant être utilisée pour le clic. A la différence des périphériques précédents, les écrans tactiles permettent une désignation directe sur l'écran des objets affichés. Les écrans tactiles à très faible résolution (10x10 à 50x50) sont à mécanisme optique (grille de faisceaux infrarouge). Mais il en existe d’autres types comme les écrans capacitifs, ou les écrans sonores. Certains écrans tactiles peuvent capter la pression du doigt ou du stylet. Tous ces dispositifs ne peuvent capter qu'une position à la fois, et donnent des valeurs erronées si l'on pose deux doigts sur l'écran, ou un stylet tenu à la main et le poignet. Il en résulte une fatigue d'utilisation rapide et une faible précision. Enfin, pour les écrans tactiles, comme l'image est affichée derrière le verre de l'écran et que l'écran tactile est sur le dessus, on a souvent une erreur de parallaxe importante.

34 Classification des périphériques d’entrée
absolu (x,y) ≠ relatif (dx,dy) tablette ≠ souris direct ≠ indirect écran tactile ≠ touchpad courbe de réponse Absolu / Relatif On peut classer les périphériques de localisation en périphériques absolus et relatifs. Les périphériques absolus transmettent une position (x, y) tandis que les périphériques relatifs transmettent un déplacement (dx, dy). Les périphériques relatifs ne permettent pas le dessin à main levée. C'est pourquoi les tablettes graphiques qui sont souvent utilisées en arts graphiques fonctionnent le plus souvent en mode absolu. Par contre, les périphériques absolus ne permettent pas à l'application de repositionner le curseur à l'écran car celui-ci est directement lié à la position du périphérique. Les tablettes et les écrans tactiles sont des périphériques absolus. Les souris, joysticks, trackballs et touchpads sont relatifs. Direct / Indirect Une autre classification des périphériques de localisation concerne leur degré d'indirection. Un périphérique direct permet un pointage direct sur l'écran (c'est le cas de l'écran tactile). Un périphérique indirect met en jeu une indirection plus ou moins importante entre l'action sur le périphérique et l'effet sur le curseur. Dans le cas de la tablette, de la souris, ou du touchpad, le périphérique se déplace dans un plan horizontal, et contrôle les déplacements du curseur dans le plan de l'écran, généralement vertical. Dans le cas du joystick mécanique, la position du périphérique contrôle la vitesse de déplacement du curseur. Dans le cas du joystick à jauge de contrainte, c'est l'effort sur le joystick qui contrôle la vitesse de déplacement. Plus l'indirection est importante, plus l'utilisateur est susceptible d'avoir des difficultés à contrôler le périphérique. Cependant, le pointage direct, s'il est plus naturel, n'a pas que des avantages car il est généralement plus fatiguant et souvent moins précis. Courbe de réponse Les périphériques indirects utilisent une courbe de réponse qui transforme les déplacements captés par le périphérique en déplacements du curseur. Dans le cas le plus simple, cette courbe de réponse est linéaire. Ce cas correspond aussi à la courbe de réponse implicite des périphériques directs, comme la tablette. Si l'on veut une bonne précision, il faut que la courbe soit assez plate près de l'origine : à de petits déplacement de la souris correspondent des déplacements encore plus petits du curseur. Par contre, pour une bonne efficacité, il faut pouvoir traverser l'écran rapidement, donc avoir une courbe plutôt raide lorsque le déplacement du périphérique augmente. Lorsque l'on choisit la vitesse de la souris, on choisit en fait une courbe de réponse qui monte plus ou moins vite.

35 Gestion des entrées 3 modes d'entrée : mode principal
Dans le mode requête, l'application attend un changement d'état d'un périphérique donné. Tant qu'il n'y a pas de changement d'état du périphérique, l'application est bloquée. Ce mode ne permet pas de gérer plusieurs périphériques simultanément. Dans le mode échantillonnage, l'application peut récupérer l'état courant d'un périphérique à tout moment. Cet appel n'est pas bloquant. L'inconvénient de ce mode est qu'il peut conduire à une attente active : l'application boucle sur l'échantillonnage d'un (ou plusieurs) périphérique(s) jusqu'à détecter un changement d'état. Cela consomme des ressources CPU inutilement. Dans le mode événement, l'application a accès à une file d'événements qui décrivent les changements d'état des périphériques. Chaque événement contient : la date de son occurrence ; le périphérique concerné (identificateur de périphérique physique) ; l'état (et/ou le changement d'état) du périphérique. mode principal

36 Gestion des entrées echo
représentation graphique des actions de l'utilisateur pour la souris : le curseur existent aussi : ligne élastique rectangle élastique

37 Constituants standard d’une interface graphique par manipulation directe
fenêtres menus boîtes de dialogues contrôles souris/curseur Tout environnement de développement d'interface graphique doit fournir les moyens de créer et de gérer les composants listés ci-dessus. Pour "fixer" le vocabulaire : - Une fenêtre est une zone rectangulaire comportant en général une zone de titre en haut, une barre d'état en bas, éventuellement une ou deux barres de défilement (vertical / horizontal), parfois une barre de menu, et enfin une zone centrale comportant d'autres composants graphiques. - Un menu est une liste de choix ; un menu déroulant est une liste présentée en colonne, à laquelle on accède par une action (clic sur une étiquette, une icône, combinaison de touches…). Pour respecter la contrainte "maxi 7 items" les menus sont souvent hiérarchiques. - Une boîte de dialogue est une fenêtre "ponctuelle", qui s'ouvre le temps de remplir une action particulière. Elle vient en complément d'un choix dans un menu (par exemple la boîte de dialogue d'ouverture d'un fichier) afin de fournir les paramètres nécessaires à une tâche. Lorsqu'elle est modale elle bloque tout autre utilisation de l'application : par exemple sous Windows la boîte d'information pendant la copie d'un fichier d'un volume à un autre. A l'inverse la boîte de dialogue de recherche d'un mot dans un éditeur de texte n'est pas modale en général. Les contrôles, ou Widgets, sont les composants de l'interface sur lesquels l’utilisateur agit. - Les boutons servent essentiellement à gérer les fenêtres, à valider ou non des actions, (les classiques « valider », « quitter »). Ils servent également à sélectionner une ou plusieurs options, lorsqu’ils sont rassemblés dans des « panneaux de contrôles ». Pour cela on dispose également des cases à cocher. Les ascenseurs sont utilisés pour faire défiler des documents, mais également pour permettre à l’utilisateur de spécifier des quantités. Les listes déroulantes permettent la sélection d’une valeur parmi plusieurs. Un certain type de liste déroulante doit permettre à l’utilisateur de saisir une valeur qui n’existe pas déjà dans la liste. Les zones de saisie de texte, de type ligne ou éditeur, sont typiquement accompagnées d’au moins 2 boutons : l’un pour valider (Ok), l’autre pour abandonner (Annuler). Il en va de même pour les boîtes de dialogue en général. À ces boutons standard doit être associée la notion de valeur par défaut. Tous ces « contrôles » ont été proposés en suivant le principe des métaphores : celle des boutons sur un appareil physique, des système de défilement, etc.

38 Constituants standard d’une interface graphique par manipulation directe
Contrôles (et panneaux de contrôle) boutons : sélection d’une ou plusieurs options ascenseurs : déplacements, quantités listes déroulantes : choix (prédéfinis ou non) zones de saisie de texte (+ validation) valeurs par défaut des contrôles métaphores... souris/curseur

39 Tâches standard d’une interface graphique
gestion des entrées gestion du focus gestion d’une fenêtre gestion de plusieurs fenêtres gestion des interactions élémentaires De même qu’il y a des composants qui se retrouvent dans toute interface graphique, de même il y a des tâches communes à tous les systèmes : - gérer les entrées - gérer le focus - gérer une fenêtre - gérer les interactions entre fenêtres. Tout environnement de développement d'interfaces graphiques doit donc offrir des primitives ou des bibliothèques de fonctions pour ces tâches de base.

40 Tâches standard interactions élémentaires : pointage sélection tracé
déplacer le curseur sur une zone de l'écran sélection appuyer puis relâcher le bouton de la souris (+shift/ctrl/alt/…) tracé appuyer sur le bouton, déplacer le curseur, relâcher le bouton

41 Tâches standard possibilité de conflit entre la sélection et le tracé
introduction de l'hystérésis l'interaction de tracé n'est reconnue après l'appui sur le bouton que lorsque le curseur a bougé suffisamment On va détailler ces tâches dans la suite

42 Tâches standard tâches possibles par manipulation directe :
saisie de valeurs sélection d'un ou plusieurs objets déclenchement de commandes défilement de documents spécification d'arguments et propriétés transformations graphiques

43  tâches de saisie textes quantités positions tracés boîte de saisie
valeur au clavier aiguille, curseur, etc. positions pointage, clic, double-clic tracés échantillonnage de positions Saisie de textes : une boîte de saisie permet à l'utilisateur d'entrer et d'éditer du texte. Il en existe plusieurs sortes : ligne unique, multiligne, conversion automatique des minuscules en majuscules, masquage de l'affichage (pour les mots de passe). Les boîtes de saisie multilignes peuvent disposer de barres de défilement. Saisie de quantités : différentes techniques sont possibles : taper la valeur au clavier, positionner l'aiguille d'un compteur ou d'un potentiomètre rotatif, positionner le curseur d'un potentiomètre , incrémenter, décrémenter un compteur à l'aide de deux boutons (haut, bas). La technique à employer dépend de l'ensemble et du type des valeurs possibles : valeurs continues ou discontinues, nombre de valeurs, taille de l'intervalle, etc. Saisie de positions : des positions à l'écran peuvent être saisies par pointage et validation par la souris. Saisie de tracés : la saisie de tracé consiste à échantillonner les positions de la souris lors d'une interaction de type cliquer-tirer.

44  tâches de sélection dans un ensemble variable :
par pointage dans une liste par saisie d'un nom dans un ensemble fixe : par menu exclusive : boutons radio binaire : cases à cocher Il existe de nombreuses variantes ou extensions des menus décrits ci-dessus. Parmi les plus importantes on peut citer : Menus hiérarchiques Les menus sont parfois définis par une structure de données hiérarchisée. La barre de menus peut être considérée comme un premier niveau de menus. Un menu est composé d'items ou rubriques. Une rubrique peut être elle-même l'entête d'un sous-menu. Dans ce cas, on fait suivre en général le texte de la rubrique par un symbole (flèche >) indiquant à l'utilisateur que cette rubrique donne accès à un sous-menu. L'accès à un sous-menu peut être explicite (clic) ou implicite (dès que le curseur de la souris passe sur l'entête du menu, celui-ci est déroulé). Il convient de ne pas abuser des niveaux de hiérarchie pour une meilleure mémorisation (3 niveaux au maximum). Menus détachables Il est parfois possible de transformer un menu fugitif (surgissant ou déroulant) en palette, par exemple en le détachant de son titre dans la barre de menu (Macintosh) ou en sélectionnant le premier séparateur (Tk). Cela permet un accès plus facile aux rubriques du menu si on en a un besoin fréquent. Pendant qu'il est détaché, le menu fugitif reste accessible. Une fois détaché, le menu peut être refermé. Menus circulaires Dans un menu circulaire, les rubriques sont réparties en secteurs. Le nombre maximal de rubriques est de 8 à 10. L'avantage d'un menu circulaire est que la distance par rapport à chaque item est la même et donc le temps de sélection ne dépend pas de la position dans le menu. Comme les menus linéaires, les menus circulaires peuvent être hiérarchiques. "Marking menus" Les "marking menus" sont une variante des menus circulaires qui permet de sélectionner une rubrique par un geste rapide avant que le menu n'apparaisse. Sélection exclusive : boutons radio : les boutons radio permettent de sélectionner une option parmi un ensemble d'options exclusives : un seul des boutons du groupe peut être activé à un instant donné (comme les bandes de fréquence sur les anciens modèles de radios). Sélection binaire : cases à cocher : une case à cocher peut être assimilée à un interrupteur à deux états : allumé ou éteint, (ou à un groupe de 2 boutons radio). Elle sert à sélectionner un état parmi deux possibles, en général de forme on/off, activé/désactivé, etc.

45  tâches de sélection améliorations :
sélection multiple (lasso, "shift-clic", etc.) combinaison de techniques ex : saisie + pointage  recherche d'une page d'aide par mot-clé pointage  gravité (pointage d'objets de petite taille) menus  séparateurs, rubriques grisées, raccourcis clavier Gravité : le pointage d'objets de petit taille (segments de droite par exemple) peut être facilité en ajoutant une tolérance lors du pointage et de la sélection : l'objet est désigné lorsque le curseur est dans son champ de gravité.

46  tâches de déclenchement
boutons actif / grisé texte / image options cliquer-tirer (drag-and-drop) entrée gestuelle Un bouton est une zone de l'écran que l'on peut activer par pointage et sélection La saisie de tracé peut être utilisée pour déclencher des commandes, dites commandes gestuelles. Dans ce cas il est préférable d'utiliser un stylet pour la saisie, soit sur une tablette graphique, soit sur un écran tactile, car la précision est meilleure. Un feed-back lexical (l'encre) permet de donner l'illusion d'un crayon électronique. Ce feed-back disparaît au lever du stylo (ou au relâchement du bouton). La commande déclenchée dépend de la forme du tracé. Cette forme doit être interprétée et reconnue par rapport à un vocabulaire prédéfini. De cette forme sont extraits la commande à exécuter et ses paramètres (taille, position, etc.)

47  tâches de défilement barres de défilement défilement direct
avantage : rapide sur de longs documents inconvénient : sens de défilement = sens inverse des flèches défilement direct avantage : intuitif inconvénient : peut être fastidieux sur de longs documents défilement automatique fonction de la position du curseur Inconvénient des barres de défilement : moyennement intuitif : clic sur la flèche du haut ou bien déplacement de la barre vers le haut = défilement du texte vers le bas !

48  tâches de spécification d'arguments et de propriétés
boîtes de dialogue modales ou non modales au moins 2 boutons : OK et Cancel possibilités de rubriques à onglet boîtes d'alerte non sollicitées par l'utilisateur le plus souvent modales boîtes de propriétés affichage permanent pas de validation Les boîtes de dialogue sont des fenêtres grâce auxquelles un programme peut demander à l'utilisateur les informations nécessaires à l'exécution d'une commande. Elles apparaissent en général à la suite de la sélection d'une commande, typiquement dans un menu. On peut distinguer deux types de boîtes de dialogue : les boîtes de dialogue modales, et les boîtes de dialogue non modales (la notion de mode sera décrite plus loin). Une boîte de dialogue modale empêche l'utilisateur d'accéder à toute autre fenêtre de l'application tant qu'il ne l'a pas refermée (soit par annulation, soit par validation). Dans ce cas, les informations requises par la boîte de dialogue sont en général importantes. A l'inverse, une boîte de dialogue non modale autorise l'utilisateur à interagir avec d'autres fenêtres sans fermeture de la boîte de dialogue. Les boîtes de dialogue modales peuvent interdire l'accès soit seulement aux autres fenêtres de l'application (modale locale), soit à toutes les fenêtres de l'écran (modale globale). Ce dernier types de boîtes de dialogue est à éviter en général sauf dans le cas ou les informations contenues dans la boîte concernent tout le système.

49  tâches de transformation
poignées de manipulation

50 Conception des IHM

51 Introduction Objectif :
permettre à l’utilisateur d’accomplir ses tâches de façon efficace avec une bonne productivité en toute sécurité en prenant plaisir à le faire en apprenant rapidement à utiliser le système

52 Introduction savoir concevoir une IHM savoir réaliser une IHM
savoir évaluer une IHM différents types de matériel pour un but fédérateur

53 Conception approche technocentriste approche anthropocentriste
centrée sur la machine et ses fonctionnalités l’utilisateur doit s’adapter à la machine approche anthropocentriste centrée sur l’homme et les utilisations la machine doit s’adapter à l’activité des utilisateurs

54 Conception Utilisabilité facilité d’apprentissage et d’utilisation
facilité de mémorisation utilisation sans erreurs satisfaction contexte

55 Conception L’utilisateur
le résultat visible d’une bonne conception est un utilisateur satisfait le processus de conception résulte d’un collaboration entre l’utilisateur et le concepteur, et peut évoluer en cours de conception l’utilisateur et le concepteur sont en constante communication durant le processus de conception

56 Conception L’utilisateur ? données physiques / physiologiques
données psychologiques données socio-culturelles expérience professionnelle / compétences

57 Ergonomie Pour qui conçoit-on le logiciel ?

58 Ergonomie les gens sont différents :
difficile d’arranger tout le monde essayer de fonctionner pour 95% des gens ? se baser sur la moyenne ? le programmeur ne représente pas forcément la moyenne

59 Ergonomie Pour qui conçoit-on le logiciel ? novice moyen bon expert
la plupart des services internet et systèmes «kiosque » système facile, nombre de tâches limitées, tutoriaux pour les tâches plus compliquées langage standard, symboles visuels simples, guides de référence, structure de tâches basique langage avancé, contrôles complexes, tips, interface permettant des tâches avancées raccourcis pour utilisation efficace, interface permettant ensemble complet de tâches et la personnalisation de tâches la plupart des applis courantes applis sur mesure

60 Ergonomie Recommandations ergonomiques : compatibilité guidage
homogénéité souplesse contrôle explicite gestion des erreurs concision

61 Ergonomie Compatibilité : niveau produit : niveau tâche :
les utilisateurs connaissent d’autres produits exploiter cette connaissance dans une même compagnie, avoir un style d’interface utilisateur niveau tâche : raisonner en termes de tâche utilisateur et faciliter le passage d’une tâche à une autre (intérêt du multi-fenêtrage)

62 Ergonomie Compatibilité : connaissances utilisateur
capacité du logiciel apprentissage facilité univers familier

63 Ergonomie Guidage : moyens mis à la disposition de l’utilisateur pour : connaître l’état du système établir des liens de causalité entre actions et état du système évaluer le système et orienter son action sur celui-ci

64 Ergonomie Guidage : 2 types de guidage : objectifs :
explicite : messages d’avertissement, aide en ligne, codes clairs, etc. implicite : structuration de l’affichage, différentiation par typographie des catégories d’information objectifs : faciliter l’apprentissage aider l’utilisateur à se repérer et à choisir ses actions prévenir les erreurs

65 Ergonomie Homogénéité (ou consistance) :
similarité interne d’un produit logique d’usage constante dans une application, ou d’une application à une autre stabilité des choix de conception objectifs rendre le comportement du système prévisible diminuer le temps de recherche d’une information faciliter la prise d’informations

66 Ergonomie Souplesse : capacité de l’interface à s’adapter aux différentes exigences de la tâche, aux diverses habitudes et connaissances des utilisateurs personnalisation de l’interface dans le fonctionnement (adaptation du logiciel à diverses populations d’utilisateurs) dans l’utilisation (diverses procédures, options et commandes pour atteindre un même objectif) objectifs adaptation à la diversité des utilisateurs outil qui s’adapte à l’homme et non l’inverse

67 Ergonomie Contrôle explicite :
maîtriser le lancement et le déroulement des opérations sémantique des commandes rendant compte de leurs effets effet des commandes prédictible objectifs favoriser la prévision des réactions de l’interface favoriser l’apprentissage diminuer les risques d’erreur

68 Ergonomie Gestion des erreurs : moyens pour : objectifs
perception, identification des erreurs conservation de l’intégrité de l’application robustesse objectifs système tolérant éviter les craintes dues aux difficultés de réparer localiser, comprendre, corriger précisément

69 Ergonomie Concision : moyens pour réduire les activités de perception et mémorisation objectifs optimiser la prise d’informations et de décisions par des informations précises et brèves minimiser le nombre d’actions ou d’opérations et le temps de manipulation

70 Ergonomie Objets de tous les jours les gens ont des habitudes
par ex : associations symbole – signification rouge = danger vert = sécurité difficiles à changer ex : clavier dvorak (années 30) : plus rapide mais peu utilisé culturelles symboles pas forcément compréhensibles par tout le monde

71 Ergonomie Mais : attention aux différents standards (par ex. selon les pays, les utilisations,…) robinet : selon les pays, ouvrir  sens des aiguilles d’une montre ou sens inverse pavé numérique : ordinateur  en bas téléphone  en haut

72 Ergonomie des standards pas si standard… saisie adaptée aux USA :
saisie universelle :

73 Ergonomie Les gens ont des « modèles mentaux » de la façon dont les choses marchent dus à : contraintes, causalité, stéréotypes, standards culturels, etc.

74 Ergonomie Bon exemple : les ciseaux ce que ça permet : contraintes :
trous pour y insérer quelque chose contraintes : gros trou peut laisser passer plusieurs doigts, petit trou juste le pouce correspondance : entre les trous et les doigts suggérée et contrainte par l’apparence connaissances culturelles et facilité : appris dès le plus jeune âge mécanisme constant modèle conceptuel : on voit clairement comment les parties opérantes marchent

75 Ergonomie Mauvais exemple : la montre digitale ce que ça permet :
4 boutons, on ne sait pas à quoi ils peuvent servir contraintes et correspondance : pas de relation visible entre les boutons et leurs possibles résultats transfert de connaissances : très peu de relations avec les autres montres connaissances culturelles : peu de standardisation modèle conceptuel : mode d’emploi doit être appris

76 Ergonomie Le concepteur doit aider à une compréhension rapide
fournir un bon modèle conceptuel en concordance avec ce à quoi les gens s’attendent mauvais exemple :

77 Ergonomie ce à quoi les gens s’attendent parallèle parallèle ?

78 Ergonomie Tenir compte pour la conception et pour la réalisation
recommandations ergonomiques facteurs issus des sciences cognitives facteurs physiologiques (couleurs, vision, …) facteurs culturels etc. pour la conception et pour la réalisation

79 Ergonomie Quel modèle de plaque de cuisson vous paraît le plus ergonomique ? A B C

80 Guide de style Langage simple et naturel
ne mettre que les informations dont l’utilisateur a besoin ne pas surcharger être simple et précis organiser

81 Guide de style Parler le même langage que l’utilisateur
utiliser une terminologie compréhensible par l’utilisateur fonction de la tâche ex. : retrait de billets au distributeur : utiliser des mnémoniques, icônes, et abréviations connus ex. : Ctrl-S, Retrait maximum de 50$ pour le moment Connexion X.25 impossible. Encombrement réseau. Procédure de limite locale.

82 Guide de style My program gave me the message Rstrd Info. What does it mean? That’s restricted information But surely you can tell me!!! No, no… Rsdrd Info stands for “Restricted Information” Hmm… but what does it mean??? It means the program is too busy to let you log on Ok, I’ll take a coffee

83 Guide de style Minimiser la quantité d’informations à retenir
utiliser la reconnaissance plutôt que la mémoire  objets directement visibles

84 Guide de style Minimiser la quantité d’informations à retenir
fournir un format, un exemple, une valeur par défaut, des valeurs possibles

85 Guide de style Etre homogène dans la présentation
dans la disposition des boutons dans les effets ex. : un label qui a l’apparence d’un bouton  on croit que c’est un bouton

86

87

88 Guide de style Fournir du « feedback »
informer constamment l’utilisateur sur : ce que le système est en train de faire comment il interprète les données de l’utilisateur > Doit What’s it doing? This will take 5 minutes... Time for coffee.

89 Guide de style Fournir du « feedback » dans quel mode suis-je ?
comment le système interprète-t-il mes actions? qu’est-ce que j’ai sélectionné ?

90 Guide de style Fournir du « feedback » être spécifique bien mieux

91 Guide de style Fournir du « feedback »
comment l’utilisateur perçoit-il les délais de réponse ? < 0.1s. : perçu comme instantané 1 s. : pas le temps de perdre le fil de pensée, mais délai ressenti 10 s. : limite pour garder l’attention de l’utilisateur sur le dialogue > 10 s. : l’utilisateur souhaitera faire autre chose en attendant pour les longs délais : curseur sablier ou barre de progression

92 Guide de style Fournir des « sorties » visibles
l’utilisateur n’aime pas se sentir « coincé » solutions : bouton « non » ou « annuler » undo bouton d’interruption (opération longue) bouton quitter bouton restauration des valeurs par défaut Core Dump

93 Guide de style Fournir des raccourcis raccourcis clavier et souris
abréviations complétion menus contextuels touches fonction double clic

94 I can’t believe I pressed Yes...
Guide de style Gérer les problèmes de façon positive 2 types d’erreurs : vraies erreurs (choix délibéré de la mauvaise solution) fautes d’inattention, de frappe, etc. fréquentes y compris chez l’utilisateur averti ont souvent pour origine la même action règle à suivre : prévenir les fautes avant qu’elles n’arrivent les détecter et les corriger prévenir l’utilisateur I can’t believe I pressed Yes...

95 Guide de style Gérer les problèmes de façon positive
fournir des messages d’erreurs compréhensibles sans faire passer l’utilisateur pour un idiot Adobe's ImageReady AutoCAD Mechanical

96 Guide de style Fournir de l’aide
l’aide ne doit pas être un palliatif pour une mauvaise conception beaucoup d’utilisateurs ne lisent pas les manuels généralement utilisée en cas de problème/coinçage/panique… différentes sortes d’aide : tutoriel, manuel de référence, tips, aide contextuelle, wizards, etc.

97 Guide de style Organisation des écrans : agencement général
mettre toutes les informations essentielles pour la prise de décision consistance dans la localisation des types d’information grouper les items (angle visuel de 5°) répartir de façon équilibrée les zones blanches organiser verticalement les listes éviter le tout-majuscule (moins lisible) bien différencier les zones à remplir des légendes Un texte écrit en minuscules se lit beaucoup plus vite qu’un texte en majuscules. La vitesse de lecture en majuscules a été estimée 13% plus lente qu’en minuscules, ceci provenant d’une différentiation plus forte des minuscules que des majuscules. Estimation faite par Tullis en 1988. De même la lecture d’un texte est améliorée si la longueur d’une ligne est supérieure à 26 caractères (longueur conseillée 50 à 55 caractères ou doubles colonnes de 30 à 35 caractères)

98 Organisation de l’écran
l’œil balaie l’écran à partir du coin haut gauche, dans le sens des aiguilles d’une montre très visible peu accessible peu visible peu visible et peu accessible très visible et peu accessible la plus accessible très accessible

99 zone de messages à lecture optionnelle
Exemple solution proposée, à corriger : zone de commandes travail titre zone de messages à lecture optionnelle quit zone de sélection

100 Exemple d’où une meilleure solution proposée, après correction : titre
zone de sélection travail titre commandes zone de messages quit

101 Guide de style La couleur :
attribut de plus en plus important car puissant mais risque de mauvaise utilisation étude de la vision humaine pour une bonne utilisation tester car différent selon matériel concevoir en monochrome puis ajouter les couleurs

102 Guide de style La couleur : utiliser cet attribut pour :
attirer l’attention organiser indiquer un état relations utiliser 8 couleurs différentes maximum (mieux 4 ou moins) prendre en compte le confort visuel le rouge paraît plus proche, le bleu plus éloigné couleurs chaudes : objets apparaissent plus grands

103 Réalisation des IHM

104 Introduction Objectif :
permettre à l’utilisateur d’accomplir ses tâches de façon efficace avec une bonne productivité en toute sécurité en prenant plaisir à le faire en apprenant rapidement à utiliser le système

105 Introduction savoir concevoir une IHM savoir réaliser une IHM
savoir évaluer une IHM différents types de matériel pour un but fédérateur

106 Approche approche technocentriste approche anthropocentriste
centrée sur la machine et ses fonctionnalités l’utilisateur doit s’adapter à la machine approche anthropocentriste centrée sur l’homme et les utilisations la machine doit s’adapter à l’activité des utilisateurs

107 Réalisation 3 aspects : le design, l’apparence extérieure
la structure interne, mode de navigation l’approche de réalisation (génie logiciel)

108 Design graphique Utilisation de grilles localiser les composants
les organiser assurer l’homogénéité organisation polices couleurs etc. Message text in Arial 14, left adjusted Standard icon set No Ok

109 ? ! The file was destroyed No Ok
Message text in Arial 14, left adjusted Standard icon set Do you really want to delete the file “myfile.doc” from the folder “junk”? ? Cannot move the file “myfile.doc” to the folder “junk” because the disc is full. ! Apply Cancel The file was destroyed

110 Exemple deux niveaux de hiérarchie séparation par espace blanc
alignement

111 Un mauvais exemple Mauvais alignement Mauvais contraste
on distingue mal les zones d’édition des zones de texte colorées Mauvaise répétition les boutons ne ressemblent pas à des boutons Mauvaise structure

112 Un autre mauvais exemple

113 Encore des mauvais exemples
abus d’effets 3D  surcharge inutile éléments de liste indifférenciables

114 Design graphique importance de l’alignement négatif

115 Design graphique Les onglets : excellent moyen d’éviter la surcharge

116 Design graphique Lisibilité
police, couleur, taille, gras, italique, souligné, etc.

117 Design graphique ne pas souligner les longs textes car ceci nuit à la lisibilité

118 Design graphique Théorie de la Forme :
Application à l'agencement des écrans [Cohen 00] A. Formatage du texte 1. Le paragraphe 2. Les titres 3. La section 4. L'indentation B. Liste 1. Liste numérotée 2. Liste à puce 3. Liste de définition 4. Liste complexe C. Lien hypertexte 1. L’ancre 2. Lien interne à la page 3. Lien externe 4. Lien de messagerie 2. Lien interne Les groupes apparaissent (lois de proximité et de bonne continuité) A. FORMATAGE DU TEXTE B. LISTE C. LIEN HYPERTEXTE Les têtes de chapitre ressortent (loi de similitude)

119 Mauvais exemple Inutile d’utiliser les majuscules quand ce n’est pas nécessaire

120 Design graphique Les images (icônes, symboles,…)
design des icônes très difficile  parfois signification pas évidente leur adjoindre un texte choisir le bon niveau d’abstraction

121 Design graphique Univers familier typique Fichier
Manipulation de la fenêtre Contrôles typographiques standard Toolbars et tooltips Affichage What You See Is What You Get Menus déroulants Menu en cascade Rubrique ouvrant une boîte de dialogue

122 Design graphique Comment choisir parmi les widgets ? selon les actions
manipulation directe pour les activités centrales boutons/formulaires/barres d’outils/outils spéciaux pour les actions fréquentes menus/fenêtres de propriétés pour les actions moins fréquentes fenêtres secondaires pour les activités rares organisés en gros blocs

123 Design graphique Comment choisir parmi les widgets ?
d’un bon choix dépend une lecture facile ex. : altimètre 9 1 2 3 4 6 7 8 5 < 10,000’ > 10,000’ beaucoup d’erreurs avec ce modèle

124 Design graphique Comment choisir parmi les widgets ?
d’un bon choix dépend une lecture facile ex. : altimètre 14000 15000 16000 17000 18000 900 000 100 200 300 400 500 600 ligne de référence mouvement indépendant peu d’erreurs avec ce modèle

125 Design graphique renforcement
Le curseur renforce la sélection de l’outil courant Seuls les outils disponibles sont visibles Le bouton enfoncé indique l’outil sélectionné

126 Design graphique Navigation dans les widgets, organisation
éviter les longs chemins d’accès, les trop grandes hiérarchies

127 Design graphique Multi-fenêtrage et profondeur de navigation
la profondeur de l’application doit être limitée à 3 niveaux Création d’un client Type Numéro Saisie des informations Nom Prénom Date de naissance… Saisie des adresses Domicile Bureau Commerciales… Recherche code postal Niveau 1 Niveau 2 Niveau 3 Niveau 4 Saisie des n° de téléphones Domicile Bureau Commerciales…

128 Réalisation Une méthode de conception : LUCID
Logical User-Centered Interface Design (Kreitzberg, 1996) développement du concept du produit analyse conception initiale de l’interface conception incrémentale ou itérative de l’interface implantation de l’application évaluation externe

129 Réalisation Développement du concept du produit
créer un concept de haut niveau du produit identifier les objectifs commerciaux du produit identifier les principales fonctions du produit identifier la population d’utilisateurs identifier les contraintes haut niveau créer une première maquette

130 Réalisation Analyse segmenter la population d’utilisateurs
identifier les principales activités créer des scénarios décrivant chaque activité identifier les besoins fonctionnels identifier les objets du métier

131 Réalisation Conception initiale de l’interface
créer un modèle conceptuel en utilisant une métaphore créer un modèle de navigation créer un look and feel réaliser une maquette des écrans-clés

132 Réalisation Conception incrémentale conception prototype évaluation

133 Réalisation Implantation de l’application
lien entre l’application et l’interface conception de l’interface « étendue » : aide en ligne, documentation, procédure d’installation, tutoriels

134 Réalisation Evaluation externe diffusion d’une version beta
mise en place d’un plan d’évaluation correction des erreurs minimes livraison de la première version planification des versions suivantes : maintenance curative maintenance évolutive

135 Réalisation Conception centrée sur l’utilisateur facteurs humains
analyse participation utilisateurs conception prototypage instrumentation développement études utilisateurs évaluation

136 Réalisation Autre façon de voir les choses :
Interface Design and Usability Engineering Articulate: who users are their key tasks Brainstorm designs Refined designs Completed designs Goals: Task centered system design Participatory design User-centered design Psychology of everyday things User involvement Representation & metaphors Participatory interaction Task scenario walk- through Graphical screen design Interface guidelines Style guides Evaluate tasks Usability testing Heuristic evaluation Field testing Methods: low fidelity prototyping methods high fidelity prototyping methods Products: User and task descriptions Throw-away paper prototypes Testable prototypes Alpha/beta systems or complete specification

137 Outils de développement
Classement : librairies ou systèmes graphiques systèmes de fenêtrage boîtes à outils d’interfaces (toolkit) générateurs d’interfaces niveau d’abstraction

138 Librairies graphiques
permettent de faire des dessins pas utilisées telles quelles pour les IHM utilisées indirectement par les outils de plus haut niveau directement dans certaines parties des IHM visualisation graphique

139 Système de fenêtrage fournit un ensemble de fonctions pour :
créer des fenêtres modifier des fenêtres détruire des fenêtres dessiner dans des fenêtres récupérer les entrées qui se produisent dans une fenêtre

140 Système de fenêtrage modèle de base : modèle hiérarchique
1 ou plusieurs fenêtres dans l'écran, rectangulaires modèle hiérarchique chaque fenêtre peut contenir des sous-fenêtres écran = fenêtre racine visibilité fonction de la visibilité de la fenêtre parente

141 Système de fenêtrage affichage / réaffichage des fenêtres
parties visibles / non visibles changements au cours du temps restituer dans l’état initial demandes de réaffichage événement, fonction de rappel

142 Boîtes à outils surcouche au-dessus des librairies graphiques et des systèmes de fenêtrage bibliothèques de composantes dédiées à la construction d’interfaces prend en charge une grande partie de la gestion des événements langage de plus haut niveau  rapidité, facilité interfaces plus « standard » La programmation de l'application interactive même la plus simple avec une librairie graphique et un système de fenêtrage devient rapidement rédhibitoire. Créer un simple bouton nécessite par exemple de créer une fenêtre (dans un système de fenêtrage hiérarchique) qui contiendra le bouton, de le dessiner, de récupérer les événements qui concernent cette fenêtre, de les traiter par une machines à états, etc.

143 Boîtes à outils notion de widgets (« window objects »)
création gestion jeu de widgets  « look and feel » d’une boîte à outils Les boîtes à outils d'interface fournissent un ensemble de composants appelés objets interactifs ou "widgets" (abréviation de "window object") et un ensemble de fonctionnalités destinées à faciliter la programmation d'applications graphiques interactives. A travers son jeu de widgets, une boîte à outil implémente un "look and feel" particulier, c'est-à-dire un ensemble de règles de présentation et de comportement qui caractérisent la boîte à outils.

144 Widgets organisation en arbre des widgets:
widgets simples (boutons, etc.) widgets composés (boîtes de dialogue, menus,…) racine = widget composé conteneur nœuds = widgets composés de structuration feuilles = widgets simples L'arbre des widgets On distingue en général deux catégories de widgets : les widgets "simples" (comme les boutons, barres de défilement, barres ou en-têtes de menus), et les widgets "composés" qui sont destinés à contenir d'autres widgets, simples ou composés (comme les boîtes de dialogue ou les menus). Les widgets sont donc organisés en un ou plusieurs arbres de widgets : la racine de l'arbre est un widget composé qui correspond à une fenêtre de base de l'application. Les noeuds de l'arbre sont des widgets composés qui permettent de structurer visuellement et/ou fonctionnellement le contenu de la fenêtre. Les feuilles de l'arbre sont des widgets simples avec lesquels l'utilisateur peut interagir directement. Un arbre de widget correspond donc à une hiérarchie d'inclusion géométrique : un widget fils est inclus dans son widget parent. Cette règle d'inclusion géométrique peut cependant ne pas être systématique. Par exemple, un menu déroulant est souvent considéré comme un fils de l'en-tête ou barre de menu mais il n'est évidemment pas inclus géométriquement dans cet en-tête. Chaque widget a un nom qui doit être unique parmi ses frères dans l'arbre. On peut donc désigner un widget par son chemin d'accès complet dans l'arbre, comme un nom de fichier dans un système de fichiers hiérarchique.

145 Générateurs d'interface
outils de plus haut niveau destinés à réduire les coûts (temps de prog.) produire une partie de l'application interactive à partir d'une description de haut niveau

146 Générateurs d'interface
Les générateurs d'interfaces sont souvent eux-mêmes des outils interactifs : ils permettent de construire interactivement la description d'une partie d'une application interactive

147 Générateurs d'interface
générateurs composés de 3 parties : un éditeur interactif : permet de construire, par manipulation directe, la présentation de l'interface et de spécifier au moins une partie des fonctions de rappel. Cet éditeur dispose en général d'un mode "test" qui permet de faire fonctionner l'interface construite. un compilateur : permet de traduire la description de l'interface produite par l'éditeur en un module qui peut être compilé. un module d'exécution ou "run-time" : doit être inclus dans l'application finale. Ce module contient le corps d'un certain nombre de fonctions génériques qui sont utilisées par le code généré par le compilateur. Ce module contient également les fonctions qui permettent de charger une description de l'interface telle qu'elle est générée par l'éditeur.

148 Générateurs d'interface
Générateurs : 2 façons de produire une application interactive : A : l'application charge la description de l'interface produite par l'éditeur B : l’application intègre le code produit par le compilateur

149 Générateurs d'interface
Générateurs : 2 façons de produire une application interactive : A : utile dans la phase de développement il n'est pas nécessaire de recompiler l'application complète à chaque modification de l'interface B : permet de produire l'application en phase finale application plus efficace puisque le code de l'interface est compilé. autonome puisqu'elle ne dépend pas d'un fichier séparé contenant la description de l'interface.

150 Générateurs d'interface
Avantages construction de l’IHM par manipulation directe une partie de l’IHM peut être testée immédiatement fournit parfois un éditeur de ressources (icones, etc.) Inconvénients focalise sur la partie présentation peu ou pas d'assistance pour des fonctions génériques (ex. copier-coller), la gestion des documents limités par la palette de widgets fournis par la boîte à outils au-dessus de laquelle le générateur est construit

151 Evaluation des IHM

152 Introduction savoir concevoir une IHM savoir réaliser une IHM
savoir évaluer une IHM différents types de matériel pour un but fédérateur

153 Evaluation But  évaluer : l’utilité utilité potentielle
capacité fonctionnelle performances assistance l’utilisabilité facilité d’apprentissage, de mémorisation, d’utilisation taux d’erreurs satisfaction utilité potentielle utilité réelle

154 Evaluation Variables cibles : mesures de performances :
taux d’erreur durée d’exécution d’une tâche durée de lecture de la doc variables subjectives : confort d’usage suggestions préférences facilité d’apprentissage demandes d’aide fonctions inutilisées durée d’apprentissage décision d’achat esthétique

155 Evaluation en cours de conception : en cours de réalisation :
tests papier, maquettes en cours de réalisation : expérimentations par prototypage (fonctionnement, comportement, performances) prototypes jetables outils de communication entre informaticiens, ergonomes, utilisateurs avant diffusion puis après : tests, enquêtes

156 Evaluation Différents types d’évaluation approches empiriques
utilisateurs contrôlent a posteriori, analyse de données comportementales approches analytiques informelles expertise, grille d’évaluation, heuristiques formelles modèles prédictifs, modèles de qualité

157 Evaluation Approches empiriques diagnostics d’usage questionnaires
analyse d’incidents critiques mais insuffisamment précis pour évaluer la qualité ergonomique d’une interface questionnaires satisfaction appréciations mais construction difficile, informations non quantifiées

158 Evaluation Approches empiriques méthode « think aloud »
l’utilisateur pense à voix haute pendant l’utilisation le concepteur prend des notes règles et précautions : dire à l’utilisateur que c’est le système qu’on teste, pas lui ne pas aider l’utilisateur pendant le test, mais noter les interrogations intervenir seulement en cas d’impasse grave marche aussi pour tester la doc

159 Evaluation Approches analytiques modèles informels
utilisation d’experts l’utilisateur peut être expert grand nombre d’experts  + de problèmes identifiés 1 expert  environ 35% des problèmes détectés 5 experts  environ 75% des problèmes détectés grille d’évaluation liste de propriétés échelle de mesure

160 Evaluation Approches analytiques
évaluation heuristique (J. Nielsen, 1994) inspection systématique de l’interface satisfait tous les critères basé sur les 9 caractéristiques de base de l’utilisabilité (voir « guide de style ») (10 si on sépare prévention des erreurs et qualité des messages d’erreur) méthode 3-5 inspecteurs + utilisateurs inspectent en isolation (1 à 2h pour interfaces simples) comparaison des notes ensuite

161 Evaluation Approches analytiques modèles formels
modèles prédictifs de performances analyse des tâches principe de rationalité (buts, méthodes, opérateurs, règles) évaluation au niveau des actions physiques de l’utilisateur (modèle keystroke) approche linguistique présentation sous forme de grammaire des actions de l’utilisateur complexité cognitive calcul du nombre de règles, de productions, de buts, piles de buts, etc.

162 Evaluation Approches analytiques modèles formels modèles de qualité
approche cognitive modèles mentaux cohérence interne et externe approche perceptive complexité perceptive qualité d’affichage

163 A vous de juger…

164 A vous de juger… Densité de l’information : par où commencer ?

165 IHM et Réalité Virtuelle

166 Introduction but fédérateur : passer des informations entre le monde virtuel et le monde réel entrée : capture du mouvement saisie d'actions sortie : visualisation 3D immersion dans un monde virtuel différents types de matériel pour un but fédérateur

167 La capture de mouvement
principal but : animer un personnage virtuel avec le mouvement d’un acteur réel

168 Historique La chronophotographie superposition - Stroboscopie
ancêtre du freezing tambour - Marey et Demeny 1894

169 Historique

170 Historique chronophotographie géométrique

171 Principes et objectifs
récupérer le mouvement de quelques points représentatifs à l’aide de marqueurs recréer un squelette animé à partir de ce nuage de points attacher un modèle 3D au squelette domaines d’application : sport, biomédical, cinéma, télévision, jeux vidéo

172 Construction du squelette
Labellisation Acquisition Nuage de points Construction du squelette Animation des acteurs de synthèse

173 Les différentes techniques : méthode mécanique
méthode très peu utilisée car très contraignante pour l’acteur consiste à placer, sur l’acteur même, des barres représentant les membres de l’acteur on enregistre leurs différentes inclinaisons et leurs positions afin de recréer directement le squelette avantage : utilisable avec un système de retour d’effort !!!

174 Les différentes techniques : méthode électromagnétique
marqueurs : petits circuits électromagnétiques émettant des informations position dans l’espace orientation

175 Les différentes techniques : méthode électromagnétique
Avantages étape de labellisation très simple, car chaque émetteur transmet son identité chaque émetteur peut transmettre d’autre informations (vitesse, accélération, …) prix de revient « faible » Inconvénients le peu de liberté de l’acteur : batteries ou câbles d’alimentation mauvaise précision F = Euros

176 Exemples

177 Exemples

178 Les différentes techniques : méthode optique
Les différentes étapes calibrage des caméras placement des marqueurs acquisition des images tracking et la labellisation reconstruction 3D

179 Les différentes techniques : méthode optique
Les caméras (au moins 3) longueur d’onde d’utilisation impose les conditions d’expérimentation visible permet de travailler dans toutes les conditions traitement difficile des images infrarouge expérience dans la semi-obscurité, à l’abri total de la lumière du jour problème de coût problème de refroidissement des caméras

180 Les différentes techniques : méthode optique
astuce travailler dans le proche infrarouge ou le rouge avec des caméras opérant dans le visible munies d’un filtre interférentiel

181 Les différentes techniques : méthode optique
Les marqueurs passifs ils se contentent de réfléchir la lumière émise par des flashs synchronisés avec les caméras. Aucune contrainte de taille, de forme ou de poids! actifs ils émettent la lumière. Ils se composent d’une diode électroluminescente et de l’électronique qui permet de l’éclairer. Contraintes de taille et de solidité dues à l’électronique

182 Les différentes techniques : méthode optique
Les marqueurs visibilité

183 Les différentes techniques : méthode optique
codage des marqueurs codage par couleur compliqué à réaliser pour beaucoup de capteurs codage en niveau de gris la variation de l’intensité se confond avec la variation d’angle codage à l’aide d’un système magnétique investissement coûteux et encombrement important codage séquentiel temporel clignotement des diodes suivant une séquence ( ) synchronisée avec les caméras très efficace

184 Les différentes techniques : méthode optique
traitement d'image, puis tracking et labellisation suivre et marquer les taches… problèmes phase d’initialisation du tracking disparition d’un marqueur choix parmi différentes taches avec des marqueurs non codés labellisation à la main L’étape de labellisation sur les marqueurs non codés Le tracking désigne un point par image qui correspond à un et un seul marqueur sans pouvoir dire lequel. On récupère donc un ensemble de chaîne de points représentant un marqueur inconnu. L’étape de labellisation consiste à associer les différentes chaînes et à les affecter à un marqueur. Cette étape est quasiment tout le temps réalisée à la « main ».

185 Les différentes techniques : méthode optique
la reconstruction 3D passer d’un ensemble de nuages de points 2D, trackés, labellisés, à un nuage de points 3D problème des distorsions d’image

186 Exemples

187 Saisie d'actions outils simples ou plus perfectionnés utilisés en CAO
utilisés en réalité virtuelle ou augmentée, couplés à des systèmes de visualisation 3D on veut des informations plus précises que simplement la position

188 Outils simples ex : tablettes graphiques, souris 3D, trackeur magnétique simple avec boutons Space Orb (trackball 3D) Trackeur magnétique + Bonne portée, pas d’ombrage, abordable - sensible aux objets métalliques et peut déranger les écrans

189 Gants retour d'effort pincement torsion et pincement
mouvement et position

190 Interfaces haptiques Bras articulés Spidar
Phantom (Sensable) Virtuose (Haption) Spidar

191 Outils spécialisés ex : ShapeTape (position et flexion/torsion)

192 Tracking magnétiques Trackeurs magnétiques :
+ : bonne portée, insensible aux masquages (traverse une main par ex.), plus cher mais abordable - : sensible aux objets métalliques et magnétiques, peut perturber les écrans et être perturbés par eux. Trackeurs ultrasoniques : + : pas d'interférences avec les écrans, économique - : problèmes de masquage, sensible au bruit Trackeurs hybrides : d’autant plus complexes et chers…

193 Actions + tracking flystick wiimote

194 Utilisations : interactions 3D
navigation angle de vue (tracking de la tête) position (direction, vitesse, début/fin du mouvement) sélection main virtuelle, retour d’effort, etc. manipulation contrôle de l’application systèmes interactifs 3D

195 Visualisation 3D Affichage Immersif Semi immersif
HMD, head mounted display BOOM, arm mounted display Virtual Retinal Display Semi immersif Ecran stéréo Workbench CAVE Divers

196 Affichage immersif HMD, head mounted display immersif
facile à utiliser permet le mouvement de l’utilisateur la gamme débute à bas prix souvent mauvaise résolution pas de vision périphérique (FOV restreint) sensation de claustrophobie peut devenir cher (jusqu'à $100,000) lourd et ne tient pas forcément bien en place Affichage par CRT ou LCD Opaque Vue stéréo liée à l’observateur Pour : Immersif facile à utiliser permet le mouvement de l’utilisateur La gamme débute à bas prix Contre Souvent mauvaise résolution Pas de vision périphérique (FOV restreint) Sensation de claustrophobie Peut devenir cher ($100,000 pour le top top) Lourd et ne tient pas forcément bien en place ex :

197 Affichage immersif BOOM, arm mounted display bonne résolution
le poids n’est plus vraiment une limite tracking excellent changement d’utilisateur rapide et facile bonne qualité stéréo le mouvement de l’utilisateur est limité fatiguant (comme des jumelles) pas de vision périphérique surtout : peut immobiliser une voire deux mains Variante du HMD, monté sur un bras articulé Surtout CRT Pour Bonne résolution Le poids n’est plus vraiment une limite Tracking excellent Changement d’utilisateur rapide et facile Bonne qualité stéréo Contre Le mouvement de l’utilisateur est +- limité Fatiguant (comme regarder dans des jumelles) Pas de vision périphérique Surtout : Immobilise une voir deux mains

198 Affichage immersif Virtual Retinal Display très léger haute résolution
totalement immersif (possible) peut atteindre une bonne qualité stéréo petit angle de vision (FOV) excessivement cher !!! Imprime les images directement sur la rétine Pour Très léger Haute résolution Totalement immersif (possible) Peut atteindre une bonne qualité stéréo Contre Petit angle de vision (FOV) Excessivement cher !!!

199 Affichage semi-immersif
Ecran stéréo très économique contrôle habituel à la souris ou autre bonne résolution sensation d’immersion faible impossibilité de se déplacer pas de vision périphérique Ordinateur standard équipé de simples lunettes à obturation. Pour Très économique Contrôle habituel à la souris ou autre Bonne résolution Contre Sensation d’immersion faible Impossibilité de se déplacer Pas de vision périphérique

200 Affichage semi-immersif
Workbench ou Holobench haute résolution et FOV seules des lunettes à obturation sont nécessaires liberté (relative) de mouvement possibilité d’utilisation en groupe restreint très cher (plus d’un million de $) assez encombrant système de synchro nécessaire entre les projecteurs vision stéréo peut poser problèmes problèmes entre les objets virtuels et réels Mur immersif en version lite Permet éventuellement d’écrire sur la surface de la table avec un stylet. Pour Haute résolution et FOV Seules des lunettes à obturation sont nécessaires Liberté (relative) de mouvement Possibilité d’utilisation en groupe restreint Contre Très cher (plus d’un million de $$) Assez encombrant Système de synchro nécessaire entre les projecteurs Vision stéréo peut poser problèmes Problème entre les objets virtuels et réels

201 Workbench

202 Affichage semi-immersif
Mur immersif haute résolution et FOV seules des lunettes à obturation sont nécessaires liberté (relative) de mouvement possibilité d’utilisation en groupe restreint la taille de l’installation permet d’y incorporer de gros objets reéls (voiture, etc.) encore plus cher très encombrant synchro nécessaire entre les projecteurs vision stéréo peut poser problèmes problèmes entre les objets virtuels et réels Cave en version lite Pour Haute résolution et FOV Seules des lunettes à obturation sont nécessaires Liberté (relative) de mouvement Possibilité d’utilisation en groupe restreint Pas besoin d’avatar La taille de l’installation permet d’y incorporer de gros objets reéls (voiture, etc.) Contre encore plus cher Très encombrant Système de synchro nécessaire entre les projecteurs Vision stéréo peut poser problèmes Problème entre les objets virtuels et réels

203 Mur immersif séparable et positionnable en sorte de cave

204 Affichage semi-immersif
CAVE haute résolution et FOV seules des lunettes à obturation sont nécessaires liberté (relative) de mouvement possibilité d’utilisation en groupe restreint la taille de l’installation permet d’y incorporer de gros objets reéls encore plus cher très encombrant synchro nécessaire entre les projecteurs vision stéréo peut poser problèmes problèmes entre les objets virtuels et réels problèmes de collision avec les écrans Systèmes de 3 à 6 écrans géants rétroprojetés Pour Haute résolution et FOV Seules des lunettes à obturation sont nécessaires Liberté (relative) de mouvement Possibilité d’utilisation en groupe restreint Pas besoin d’avatar La taille de l’installation permet d’y incorporer de gros objets reéls (voiture, etc.) Contre Très cher (plus d’un million de $$) Très encombrant Système de synchro nécessaire entre les projecteurs Vision stéréo peut poser problèmes Problème entre les objets virtuels et réels Problème de collision avec les écrans

205 CAVE

206 Utilisation conjointe
Exemples : (videos) avec avatar :

207 Interfaces tangibles Objets quotidiens pour interagir : (videos)
Sentoy :

208 Exemples de domaines d’utilisation RV/RA
Divertissement (jeux / films d’animation) Médecine / chirurgie Design industriel Simulateurs (aéronautique / sous-marin / etc.) Entraînement Tests d’ergonomie PSA IRCAD

209 Applications dans le domaine médical
domaines : simulation de gestes médicaux et chirurgicaux intubation, accouchement, chirurgie ouverte,… assistance pour les opérations chirurgicales planification préopératoire, réalité augmentée peropératoire,… réhabilitation musculaire retour d'effort diagnostic et thérapies comportementales phobies, schizophrénie, troubles post-traumatiques,… entraînement de médecins de conflits mise en situation de stress

210 Applications dans le domaine médical
matériels : du plus courant (casque, manette) au plus perfectionné et spécifique (virtual surgery table, dispositifs haptiques ad-hoc)


Télécharger ppt "INTRODUCTION AUX INTERFACES HOMME-MACHINE"

Présentations similaires


Annonces Google