COM2571 Interfaces et scénarisation Interactions Humain-Ordinateur Interfaces Jeux Jeux et mondes virtuels Scénarios interactifs Évaluation auprès des usagers Veille technologique Analyse des usages ecommerce Aide en ligne, documentation, formation Un cours pratique mais pas de production

Au programme aujourdhui B le déroulement du cours Pourquoi ce cours ? Présentation du plan de cours et des méthodes dévaluation Les notes (PowerPoints) sont mises en ligne Comment imprimer – Gris 4 par pages. Présentation du domaine des Interactions Humain - Ordinateur IHM (CHI)

Pourquoi ce cours ? Pourquoi létude des interactions Humain Ordinateur ? Il nest pas si facile de concevoir un bon site Internet, dinformatiser la communication de façon efficace Les systèmes doivent sadapter aux activités humaines, pas le contraire. Les applications multimédias, les sites web,les interfaces sur mobile sont complexes à développer, il faut scénariser. Il faut pouvoir choisir une technologie, participer à la conception, évaluer, savoir ce qui se passe et améliorer les systèmes. Scénariser la Communication

Exemples de conception Bornes des Bixis Vote électronique Systèmes de réponse automatisée au téléphone Services communautaires accessibles Guichet étudiant ? Information sur les bourses Service à la clientèle en ligne Intégration des médias - TV, Web, Blogue Gestion de vos courriels, gestion des réseaux sociaux selon lusage visé. Contenus générés par les utilisateurs. Applications et Interfaces des portables Système de navigation au téléphone

Exemple tiré de lélection présidentielle US 2000: Préparé par Yan Bodain, M.A. Jean-Yves Fiset, ing., Ph. D. et Sandrine Prom Tep Hec Montréal À un moment donné, 1% des votes était sous examen (écart entre les candidats est de quelques centaines, sur plusieurs centaines de milliers) bulletins de votes ont été rejetés car plus dun candidat y étaient sélectionnés.

Bulletin de vote électronique de la Floride Quelques possibilités derreurs: Lecture de haut en bas => ensemble de candidats associé au second trou Lignes horizontales alignées sur les trous Espacement réduit entre les trous Gauchers (droitiers) ne distinguent pas correctement les noms au moment de voter Exemple tiré de lélection présidentielle US 2000

Commentaires délecteurs: "When I went to push the one for president, I pushed one and it seemed to be just below the office of vice president. It seemed like I had to push one for vice president, too. Then I saw I had accidentally voted twice." "It was so hard to tell who and what you were voting for. I couldn't figure it out, and I have a doctorate." Selon le directeur des élections de Floride: "I don't think they are confused. I think they left the polling place and became confused. The ballot is very straightforward. You follow the arrow, you punch the location. Then you have voted for who you intend to elect," Roberts assigné par le Gov. Jeb Bush, (frère de George W.'s)

Références Bastien, J. M. C., & Scapin, D., L. (1993). Ergonomic Criteria for the Evaluation of Human-Computer Interfaces. (156). INRIA. Gentner, D., & Nielsen, J. (1996). The Anti-Mac interface. Communications of the ACM, 39(8), Nielsen, J. (2000). Conception de sites Web : l'art de la simplicité. Paris: CampusPress France, 387p. ISBN Lindsay, P. H., & Norman, D. S. (1980). Traitement Humain de l'Information. Montréal: Etudes Vivantes. Translated from Lindsay, P. H., & Norman, D. A. (1977). Human information processing : an introduction to psychology (2d ed.), pp. xxiii, 777. New York: Academic Press BF 455 L Norman, D. A. (1986). Cognitive Engineering. In D. A. Norman, & S. Draper (Ed.), User Centered System Design: New Perspectives on Human-Computer Interaction (pp ). Hillsdale, N.J.: Erlbaum. Shneiderman, B. (1998). Designing the user interface : strategies for effective human-computer interaction (Third ed.). Reading, Mass.: Addison-Wesley, 638p. ISBN p Weinschenk, S., & Yeo, S. C. (1997). GUI design essentials for Windows 95, Windows 3.1, World Wide Web. New York: Wiley,345p. ISBN Ch3 - p

Pourquoi létude des interactions Humain Ordinateur ? Limpact dune mauvaise interface nest pas toujours si grave… Mais elle peut faire perdre des milliers dheures à des milliers de personnes. Avec le commerce électronique, les jeux vidéos, lintégration actuelle des médias traditionnels et électroniques, la formation en ligne, … il y a dans les IHM un vaste domaine dapplication et de recherche. Association des professionnels de lutilisabilité

Présentation du cours.... Apprentissage des principes de scénarisation interactive et du processus de conception et d'évaluation des applications de communication informatisée, en utilisant diverses théories ergonomiques et communicationnelles. Théories sur lergonomie et la conception Méthodologies de prototypage et de gestion de projet de conception, de description et de production de maquettes dévaluation heuristique des interfaces (experts) dévaluation empirique ou tests dutilisabilité des maquettes et des systèmes informatisés auprès des usagers Exercices et travaux liés à lévaluation la conception Sites dinformation, ecommerce, eformation Jeux, logiciels

Présentation du domaine des Interactions Humain Ordinateur (IHM) Quest-ce quune interface ? Quest-ce que lergonomie cognitive ? Problématique spécifique à la communication Humain-ordinateur (Norman 1986) Modèle du traitement de linformation Manipulation directe vs Intelligence des systèmes Recherches dans le domaine Ce qui est important ???? Comprendre les concepts

Quest-ce quune interface ? Toutsavoir.net : interface Ensemble des programmes gérant l'utilisateur et les rapports qu'ils peut entretenir avec sa machine et les logiciels qu'elle abrite Si cette interface est jolie tout plein avec des tas de beaux dessins géométriques, c'est une interface graphique. Mise en oeuvre physique de règles de communication entre deux systèmes. Dicofr.com - Interface Une voie d'échange d'informations qui permet à un ordinateur ou plusieurs ordinateurs ou des équipements extérieurs (imprimantes, moniteurs ou modems) ou deux ou plusieurs ordinateurs de communiquer. Interface Utilisateur Partie visible par l'utilisateur d'un logiciel, en d'autres termes le programme gérant l'interaction entre la machine et l'utilisateur. Interface graphique Surcouche d'un système d'exploitation apportant le système de fenêtres et de menus inventé par Xerox. Sa vulgarisation pour le grand public a eu lieu grâce aux travaux d'Apple avec la sortie du Lisa puis du Macintosh en IHM Interaction Homme Machine ou IPSI Tout ce qui permet une communication homme/machine. Définir les IPSI …un problème pour lErgonomie cognitive

Quest-ce que lergonomie cognitive ? ergos travail et nomos lois naturelles. Laville (1976) "l'ensemble des connaissances sur le fonctionnement de l'homme en activité, afin de les appliquer à la conception des tâches, des outils des machines et des systèmes de production". Grandjean (1969) elle étudie "l'adaptation du travail à l'homme". faciliter l'utilisation d'un outil en se fondant sur les connaissances dans les sciences biologiques, psychologiques et physiques Lergonomie cognitive sintéresse à…ladaptation à la cognition humaine, soit: perception, activité symbolique, mémorisation, prise de décision, résolution, motivation

Concrètement... LErgonomie Cognitive sintéresse surtout au design des Interactions Humain Machine Ce qui se passe entre vos deux oreilles design de quelque chose dartificiel,de complexe. qui soit fonctionnel Inventer le médium et le message Lhumain et lordinateur ont chacun leurs forces et leurs faiblesses. Concevoir un système qui maximise linteraction entre les deux (Norman, 86) Créer des systèmes qui complètent lintelligence humaine.. Confronter les systèmes aux usagers et aux usages réels

Communication Humain Ordinateur Communication - émettre et recevoir linformation de façon efficace selon quatre phases Norman (1986) Le Gouffre Intentions Actions LUsagerLe Système EvaluationRétroaction

Problématique de ladaptation des systèmes informatiques Norman 1986: Cycle d'interaction avec un système informatisé: Fossé de lexécution Établissement d'un but Formation d'une intention Spécification d'une suite d'actions Exécution des actions Fossé de lévaluation Perception de l'état du système Interprétation de l'état du système Évaluation de l'état du système par rapport au but La largeur des fossés est reliée Les difficultés et les erreurs sont partout

Design = Compromis les menus aident à la formation des intentions mais nuisent à l'exécution plus de rétroaction aident l'évaluation, mais distrait de la formation d'intentions la présence visuelle peut favoriser la perception et la rétention aux différents stades, mais elle alourdit en ajoutant de la complexité La toile du Québec Médias intégrés Radio-CanadaRadio-Canada Les multiples index et choix diminuent l'attention portée à l'information. Définir laccès en fonction des usages, mais ceux-ci changent.

Théories ? Modèle du Traitement Humain de l'Information Il faut considérer les contraintes du traitement des informations par les humains Le temps et la difficulté du traitement de linformation est formé de trois composantes t = ts + tc + tm (sensoriel, cognitif et moteur) système sensoriel favoriser la discrimination sensorielle attention aux contrastes - couleur, sons, détail vitesse proportionnelle à lactivité réduire les variations de vitesse ralentir pour diminuer les erreurs permettre dajuster, dinterrompre

Modèle du Traitement Humain de l'Information... système moteur ergonomie physique des dispositifs Loi de Fitts T= I log2 2D/L D = distance à parcourir L = largeur de cible I = constante (1 sec) Si le bouton est loin sa taille doit augmenter Placer les zones actives utilisées fréquemment ensemble Plutôt en bas à droite, dans lordre de lecture..sauf sur Internet.. Pourquoi ? Attention aux boutons « Annuler » ou « Effacer » Penser aux erreurs possibles de manipulation

système cognitif - Mémoire mémoire à court terme ou mémoire de travail attention sélective, difficulté à se rappeler des choix de menus - raccourcir oublie le parcours fait - doù on vient? ce quon cherche ? mémoire à long terme Organisation en mémoire des concepts, des faits. Partir de ce que lusager connaît Fournir une structure, un résumé, répéter processeur: temps de reconnaissance et dexécution Donner le contrôle à lusager. Simplifier et morceler les étapes Supporter la résolution de problème..essais / erreur. Prévoir les processus, la difficulté, la reconnaissance Et les autres dimensions cognitives : la motivation, le flot, lapprentissage, les attitudes. Modèle du Traitement Humain de l'Information...

Mais au delà de faciliter la compréhension de lOutil.. La compréhension dune interface et sa facilité dépend des intentions..du contexte et de la structure des activités.. Hoc, On nutilise pas lordinateur pour lui-même…mais pour des buts super ordonnés « un concepteur de système ne conçoit pas seulement une machine, mais un système homme-machine qui réalise une tâche définie » Hoc, 1998Hoc, 1998 Au delà du traitement de linformation... Lactivité

Lorsquon spécifie une interface, ou lorsquon essaie de la comprendre, on cherche à répondre à trois questions dans lordre: Pourquoi ? Intentions, buts Quoi ?Objets, commandes, évènements Comment ? Méthodes suites dopérations Organisation de lutilisation des objets et commandes et des évènements. Dans la Toile.. Quels sont les buts..les objets et commandes..les méthodes Théorie de lactivité:

Atelier - expérimenter des interfaces Cest une course Un le fait..lautre regarde et prend des notes.. Notez les étapes, les difficultés, les réponses Proposez ensuite des changements qui seraient souhaitables pour faciliter linteraction. Changer la structure dInteraction Éliminer une étape Changer un bouton Ajouter une fonction, un choix de menu.

Atelier - expérimenter des interfaces Cest une course …Un(e) le fait …Un(e) regarde et note les problèmes.. Vous devez pourvoir répondre à toutes les questions et noter les difficultés. 1. Trouvez dans le site de lUdeM le calendrier pour connaître la date de la semaine de lecture à lhiver ? 2. Cherchez à quelle heure et dans quelle salle se donne le cours de Applications Internet à lAutomne ? 3. Pouvez-vous vous inscrire aussi à lhiver à au cours de relation publique ? 4. Vous ne vous rappelez plus de votre mot de passe pour votre courriel, que faire ? 5. Vous voulez renouveler vos emprunts à la bibliothèque. 6. Vous devez downloader Endnote de la logithèque (enregistrez sur le disque, ne linstallez- pas) 7. Vous êtes un étudiant étranger en maîtrise. Avez vous droit à des bourses ? Quand et à qui devez-vous envoyer votre demande ? Rapport sur les difficultés.. propositions de changements…