IHM

1. IHM Cours 0 1-Interaction Humains-Machines 2-Présentation du module M2-IFL/DU-TICE, UPMC Elisabeth.Delozanne@upmc.fr http://lutes.upmc.fr/delozanne/2011-2012/M2-IFL-DU-TICE-Accueil.htm

2. Qui suis-je ? • Maître de Conférences Informatique Paris 6 (sept. 2007) • Enseignante • IHM, Algorithmique, POO, TICE, Math • Paris 5, IUFM de Créteil, IUP Univ. du Mans, Secondaire • Chercheure • Aida • Thèse en 1992 (Université du Maine) • Centres d’intérêts • EIAH (Projets Élise, Repères, Pépite, Lingot) • Intégration des technologies pour l’éducation et la formation • Conception participative et le prototypage • Congé pour recherches : Univ. Sydney, Télé-Univ. du Québec

3. Interaction « Homme »/Machine • [8] (Guide to usability, Open University, 1993)

4. Interaction Humains Machines • Interaction : Boucle • Les gens expriment leur intention • Le logiciel interprète, exécute et communique des résultats • Les gens interprètent les modifications • Humain • Les utilisateurs finaux, leurs collègues • Leur activité, leurs besoins, leurs difficultés • Machines • Des (matériels et) logiciels • Avec des contraintes techniques et matérielles

5. Interface Homme-Machine • Partie d’une application qui permet • Au gens • d’interagir avec la machine • A la machine • de communiquer des résultats • Logiciel/matériel

6. Point de vue des usagers

7. Prise en compte de l’utilisateur • Approche technocentrique • centrée sur la machine • et ses possibilités • l’utilisateur doit s’adapter à la machine • Approche anthropocentrique • centrée sur l’homme • et ses besoins • la machine doit s’adapter à l’utilisateur • Approche instrumentale • Co-adaptation des machines et des humains

8. Sigle IHM ? • 1970 Interface Homme/Machine • Apparition des interfaces graphiques • Informatique personnelle • 1980 Interaction Homme/Machine • Informatique outil • 1990 Interactions Humains-Machines • TIC : informatique de communication • 2000 I. des Humains avec des Mondes • Informatique mobile, disséminée, vestimentaire, invisible • Réalité virtuelle, réalité augmentée, réalité mixte • Interfaces tangibles

9. IHM (Cours de James Landay) • Domaine qui s’intéresse à • La conception • Le prototypage • L’évaluation • Des interfaces et des interactions Humains machines

10. IHM : domaine pluridisciplinaire • s’appuie sur des connaissances • en sciences humaines et sociales (SHS) : psychologie, sociologie, ergonomie, anthropologie • en informatique • en design • met au point • des modèles • des méthodes • des techniques • des outils

11. Pourquoi étudier l’IHM ? • Économiques • 50 à 90 % des coûts de développement • Sociales • des interfaces mal conçues coûtent cher • Argent :+ 5 % de satisfaction => + 85 % de hausse (Landay) • Vie : accident du Mont Saint-Odile • Scientifiques et techniques • les interfaces utilisateurs sont difficiles à mettre au point • Les gens sont imprévisibles • Les activités sont complexes • existence de techniques, méthodes et démarches rigoureuses • Professionnelles • Vous aurez à travailler • pour des entreprises/services qui font des logiciels pour des utilisateurs, pas seulement pour des machines

12. Qui construit des interfaces ? • Une équipe • Pourquoi ? • Idéalement • Graphistes • Spécialistes de l’interaction • Ergonomes • Marketing • Rédacteurs techniques • Ingénieurs spécialisés dans les tests • Développeurs Informatiques • Utilisateurs

13. Orientation du module IHM

14. Reproches aux concepteurs • Les concepteurs (amateurs) • se centrent uniquement sur les fonctionalités et sur le fonctionnement du système • traitent l’interface en dernier • pensent que tous les utilisateurs leur ressemblent • pensent que tous les utilisateurs sont idiots • ne sont pas formés • à l’analyse de besoins, à travailler avec des utilisateurs • ne comprennent pas que les besoins évoluent au cours de conception

15. Conception de l’interaction • Concevoir l’interaction des usagers avec le système • Pas une opération cosmétique • chargée de mettre en final l’application au goût du jour • Étape centrale • dans le processus de conception d’un logiciel

16. En tant que concepteur… Retenez que • Ce n’est pas à l’utilisateur de s’adapter à vos idées, certes géniales Mais • c’est au concepteur de s’adapter à l’activité de l’utilisateur Pour cela il y a • Des sciences (humaines) : ergonomie (des logiciels), psychologie, sociologie • Des méthodes : conception centrée utilisateur • Des techniques : entretiens, incidents critiques etc.

17. Objectifs de l'enseignement • Sensibiliser • aux démarches ergonomiques et centrée-utilisateur • Faire connaîtreet pratiquer • lestechniques simples mais efficacesd’évaluationet de conception centrée utilisateur de logiciels interactifs • Pas étudiées dans ce cours • Technologies pour le développement des GUI

18. Compétences (1/2) Savoir • organiser et mettre en œuvre • une démarche rigoureuse de conception centrée utilisateur • mettre en œuvre • des techniques simples de recueil d’informations, d’analyse et de conception : • entretiens, remue-méninges, scénarios et personas, prototypage, inspection heuristique, revue de conception • un plan d'évaluation dans un projet • rédiger • une analyse de problème , un dossier de conception, un rapport d'évaluation d'un logiciel interactif • une fiche de lecture

19. Compétences(2/2) • organiser • un travail en équipe • trouver • les recommandations, guides de style, standards, design patterns, les expertises • présenter • les principaux concepts du domaine de l’IHM • communiquer • vos idées, les argumenter, les développer et les faire évoluer

20. Organisation du module • Apprentissage par confrontation • de pratiques : • un mini-projet • mise en œuvre des techniques visées • vos expériences d’utilisation de logiciel • retours sur votre travail • du groupe • des enseignants • d’ interrogations théoriques : • cours • lectures personnelles : • Avant le cours, Synthèse, Pour approfondir

21. Plan du cours Cf le site http://lutes.upmc.fr/delozanne/2011-2012/IHM-IFL-TICE/siteIHM/CoursIHM.htm

22. Projet • Conception d’une application Web • Utilisateurs potentiels réels et accessibles (entretiens) • Qui ne vous ressemblent pas trop • Une base de données • Par groupe de 2 ou 3 • Rendre des documents sur un site web de votre projet à date fixes • Obtenir des retours rapides sur votre travail • Mettre en œuvre les différentes techniques étudiées en cours • Produire un prototype évalué par vos pairs fin janvier

23. Sujet • Pas trop ambitieux • Des utilisateurs • Accessibles • Différents de vous • Exemples de sujets • http://lutes.upmc.fr/delozanne/2011-2012/IHM-IFL-TICE/siteIHM/proj.htm

24. Déroulement • 4 phases • Phase 0 : constitution des équipes (14/9) • Phase 1 : définition du problème (11/11) • Phase 2 : conception (25/11) • Phase 3 : développement (27/1) • Phase 4 : évaluation (27/1) Descriptif du projet : en ligne

25. Fiche de lecture • Choisir un texte et préparer une fiche • Thèmes: conception, évaluation, prototypage, histoire de l’IHM, IHM &EIAH • Fiche • Identification • de l’auteur de la fiche, du texte, des auteurs, de l’ouvrage dont est issu le texte • Résumé (ce que disent les auteurs) • Analyse et commentaires (ce que vous en pensez) • Les erreurs de vos prédécesseurs (Cf. méthodologie de la recherche) A rendre le 21 octobre sur Moodle

26. Lectures • Une excellente introduction à l’ergonomie du logiciel E. Brangier, J. Barcenilla, Concevoir un produit facile à utiliser : Adapter les technologies à l’homme, Editions d’organisation, 2003 • Des méthodes, des conseils et des exemples • D. Van Duyne, J. Landay, J. Hong, The Design of Sites: Patterns for creating winning web sites, Prentice Hall, 2007 • A. Boucher, Ergonomie Web, Eyrolles 2009 • Manuel de référence • B. Shneiderman, C. Plaisant, M. Cohen, and S. Jacobs, Designing the User Interface: Strategies for Effective Human-Computer Interaction (5th Edition), Pearson, 672 Pages • Des textes à télécharger pour préparer chaque cours • Poly sur les techniques de conception + textes de bases • Autres références : sur le site

27. Évaluation de l’UE? • Première session : Contrôle continu (CC) • P : Note de projet (sur 10) • PP : Note personnelle (sur 5) • PE : Note équipe (sur 5) • Note personnelle • L: Fiche de lecture IHM (sur 5) • TP : Travaux pratique en php, mysql, html (sur 5) CC = PP + PE + L +TP • Deuxième session (NF) • Examen : E2 • NF = sup (E2, (E2 + CC)/2)

28. Devoir pour le 14/9 • Projet : • Réfléchir à un idée de projet • Déposer une fiche descriptive sur Moodle • Faire campagne pour trouver des équipiers • Lecture • Choisir un texte • Commencer la lecture

29. Dicton du jour L’interface est (presque) la seule chose que l’usager connaît de l’application que vous avez construite