Understanding Human-Computer Interaction (HCI) Basics in Short and Long Term Projects

1. Cedric.Dumas@emn.fr contrat Creative Commons Paternité-Pas d'UtilisationCommerciale-Partage des Conditions Initiales à l'Identique 2.0 France License

4. 4

5. Définitions de l’IHM (HCI) L ’interaction homme-machine désigne l ’ensemble des phénomènes physiques et cognitifs qui interviennent dans la réalisation de tâches avec le concours de l ’ordinateur. L ’interface homme-machine désigne un assemblage de composants logiciels et matériels qui permet l’accomplissement de tâches avec le concours de l’ordinateur communication homme-machine communication humaine médiatisée dialogue homme-machine La frontière

6. Une approche inter-disciplinaire composante cognitive et affective Composante sociale et institutionnelle composante technique Composante physique Psychologie Informatique Sociologie Physiologie

7. Quel enjeu pour vous ? (court terme) Projet OSE Fi2 Projet OSE Fi3 Projets Fi4 Capacité à développer rapidement vos propres outils en fonction de vos besoins Meilleure maitrise de la composante informatique Meilleure visibilité sur la complexité des développements informatiques

8. Quel enjeu pour vous ? (long terme) Savoir concevoir une IHM Savoir réaliser une IHM Savoir évaluer une IHM Faire appel à des spécialistes ou créer une équipe pluridisciplinaire !

9. Pour quels objectifs ? 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

10. Les styles d’interaction

11. Styles d’interaction Conversationnel langage de commandes dialogue imposé par le système Menus, formulaires guidage du système dialogue contrôlé par le système Question / réponse Langage naturel et langage écrit

12. Styles d’interaction Navigation nœuds, ancre, liens difficulté de repérage Manipulation directe actions physiques sur des représentations d’objets inspire toutes les interfaces actuelles

13. Styles d’interaction WIMP windows, icons, menus and pointers widgets : bouttons, barre d’outils (actions), palettes (modes), boites de dialogues + compositions Point-and-click hypertext généralisation / WIMP (<> souris) Interaction tactile

14. Styles d’interaction WYSIWIG : édition de document What You See Is What You Get dialogue contrôlé par l’utilisateur … x.ln(x)/sqr(sqr(x)+1) ...

15. Styles d’interaction Interaction gestuelle / reconnaissance de traces interfaces à stylo ETC....

16. 16 Interaction Directe • Ben Schneiderman, 1983L’utilisateur agît sur des objets dotés de réactions spécifiques • apprentissage rapide • limite les efforts de mémorisation • permet l'expérimentation(vérification immédiate, réversibilité) • exemple : éditeur de dessin

17. 17 Interaction Directe • représentation continue des objets • utilisation d'actions physiques (mouvement et sélection par souris, pointage, etc) au lieu d'une syntaxe complexe • opérations rapides, incrémentales et réversibles dont les effets sur les objets doivent être visibles immédiatement • apprentissage selon une approche progressive afin de permettre l'utilisation de l'interface même avec un minimum de connaissances

18. 18 Utilisation de l’interaction Directe • Interactions élémentaires avec le périphérique de localisation • Pointage • suivi du déplacement par déplacement du curseur • Sélection • par click simple ou multiples, avec ou sans touches du clavier • Tracé • cliquer-tirer, drag and drop, suivi du déplacement

19. 19 Utilisation de l’interaction Directe • Tâche de déclenchement (sélection, action) • Tâches de défilement • Tâches de spécification (argument, propriété) • Commande par action directe • Arguments donnés implicitement • ou explicitement : boîtes de dialogue, modales ou non modales • Boîte d’alerte et d’information, État d’avancement • Boîte de propriétés, effet immédiat des modifications • Tâches de transformation

20. Nous maintenant... Du WIMP Avec Swing Pour comprendre que la conception est : Simple De haut niveau Longue Qualité fortement couplée au génie logiciel Stereotypée en WIMP Evolue rapidement + un facteur clé : De la réussite d'un S.I. D'une innovation

21. Bibliographie Internet Intranet Ressources

22. Points de départ ! CAMPUS2 transparents liens bibliographie exemples etc… Portails http://www.dmoz.org http://www.usabilis.com/ http://membres.lycos.fr/interaction/ http://directory.google.com/ en ergonomie http://usableweb.com/ http://www.stcsig.org/usability/topics/prototyping.html

23. Bibliographie Interaction Homme-Machine pour les Systèmes d’Informations (2 tomes)Christope KolskiHermès Designing the user interfaceBen ShneidermanAddison Wesley (3rd edition) Human-Computer InteractionAlan Dix, Janet Finlay, Gregory Abowd, Russel Beale Prentice Hall (2nd edition)

24. Cours S3S4 – IHM - Programmation Approche Technique Pragmatique Première confrontation Mise en évidence des difficultés de l’IHM qualité structuration maintenabilité utilisabilité