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

– Page 1 Conception et évaluation d IHM : Introduction Anne-Marie Déry

Présentations similaires


Présentation au sujet: "– Page 1 Conception et évaluation d IHM : Introduction Anne-Marie Déry"— Transcription de la présentation:

1 – Page 1 Conception et évaluation d IHM : Introduction Anne-Marie Déry

2 – Page 2 Quelques définitions CHM Communication Homme Machine Etude de la conception des systèmes informatiques contrôle aérien, centrale nucléaire : sécurité bureautique : productivité jeux : engagement Des utilisateurs IHM Interface Homme Machine (1970) contact utilisateur système = langage d'entrée + de sortie + gestion de l'interaction Interaction Homme Machine (1980) Discipline englobant la conception, l'évaluation et le développement de systèmes interactifs

3 – Page 3 Problématique actuelle Prendre en compte les avancées technologiques nouveaux supports matériels arrivée du net (masse de données + réseaux) nouveaux moyens d'interactions multimédia : son, images de plus en plus d'utilisateurs des novices aux experts Succès des interfaces ? facilité d'utilisation même si le service offert est complexe voiture vs électroménager téléphone : nouvelle gamme

4 – Page 4 Utilisabilité des interfaces Facile à apprendre et à utiliser Retour d'information rassurant, informatif et immédiat La conception doit répondre aux besoins, connaissances et Caractéristiques des utilisateurs Objectif avoué : fiabilité, efficacité, productivité 3 aspects étudiés à travers le module conception, évaluation, prototypage

5 – Page 5 Cycle de vie des IHMs

6 – Page 6 IHM sur supports mobiles l Complexification de la conception ergonomique et logicielle

7 – Page 7 IHM sur supports mobiles Complexification de la conception ergonomique et logicielle

8 – Page 8 IHM sur supports mobiles l Complexification de la conception ergonomique et logicielle

9 – Page 9 IHM : Ordinateur, ubiquité et mobilité Ubiquité (environnement équipé) Mobilité (utilisateur équipé)

10 – Page 10 Les enjeux de la mutation –Ingénierie au cas par cas insuffisante Coûts de développement et de maintenance Cohérence ergonomique entre versions l De nouveaux problèmes à résoudre – prendre en compte le contexte dans l'interaction Perception/modélisation/adaptation l Des solutions à des problèmes anciens à revoir – les techniques d'interaction : windows, icons, menus, pointing l Des problèmes classiques prennent une importance particulière – concevoir pour plusieurs plates-formes – assurer la sécurité et la confidentialité

11 – Page 11 Analyse des besoins Conception Conception logicielle Codage Tests Unitaires Tests dintégration Tests Utilisateurs Evaluation ergonomique Boîtes à outils Mécanismes généraux Modèle darchitecture logicielleEspace de conception Propriétés ergonomiques Dimensions de l espace problème

12 – Page 12 Dimensions de l espace problème l Selon trois axes Techniques dinteraction Collaboration Contexte

13 – Page 13 Dimensions de l espace problème l Selon trois axes Techniques dinteraction Collaboration Contexte

14 – Page 14 Système interactif sensible au contexte l Système interactif sensible au contexte capable didentifier les circonstances qui entourent laction utilisateur en vue doffrir des services contextualisés –offre sélective dinformation –décoration contextuelle pour recherche ultérieure l Contexte : ensemble de propriétés de phénomènes physiques qui peuvent être captées

15 – Page 15 Système interactif sensible au contexte

16 – Page 16 Applicatifs envisagés l Localisation de lutilisateur l Identification et localisation de dispositifs dinteraction

17 – Page 17 Projets IHM -Aller voir les Simulateurs de plongée : -Qualité du prototype -http://www.polytech.unice.fr/~pinna//MODULEIHM/IHM2004/BO2004.html -Aller voir PolyTable Pour lanalyse de lexistant –Au niveau matériel Pour le contexte dusage très particulier -Questionnaire -Dans la vitrine : https://vitrine.polytech.unice.fr

18 – Page 18 Existant bar « Intermission » de l'université de Westminster Société Escapsim Un million de livres, 6 tables, pour communiquer, jouer et commander. un écran sortant d'une table Caisse enregistreuse tactile /texts/logiciel-de-caisse-tactile Table tactile à usage militaire Société TouchTable navigation poussée, très chères, domaines de pointes, ou gouvernement.

19 – Page 19 Dimensions de l espace problème l Selon trois axes Techniques dinteraction Collaboration Contexte

20 – Page 20 Mobilité : nouveau découpage spatio-temporel l Déplacement dans lespace l Variation dans le temps : synchronisme/ asynchronisme local distant asynchrone synchrone

21 – Page 21 Mobilité : nouveau découpage spatial l Etude selon les lieux dinteraction et non la distance CONFINE lieu de linteraction délimité VAGABOND lieu de linteraction nimporte où ENSEMBLEDISPERSE IDENTIQUE (local) DIFFERENT (distant)

22 – Page 22 Plate-forme Magic Camera + Micro Casque + Ecouteurs Capteur dorientation Stylos Tablette + Extenseur de port Réseau sans fils

23 – Page 23 MAGIC : Travail sur le terrain de fouille l Explorer le site (Mobilité) l Travailler en groupe sur le site (Collecticiel) l Sinformer auprès dexperts distants (Collecticiel) l Comparer des objets physiques avec des objets dune base de données (Augmentation) l Accéder aux objets enlevés du site (Augmentation)

24 – Page 24 MAGIC : vue densemble Sur la tablette : –Communication (forum, mail, etc.) –Coordination (carte) –Production (outils dédition) A travers le casque: –Combinaison du physique avec linformatique grâce à la passerelle

25 – Page 25 Un archéologue travaille Il trouve un objet La découverte est retirée du site Lobjet est sauvegardé dans une base de données Un archéologue approche de où était lobjet La découverte est virtuellement disponible Terrain augmenté

26 – Page 26 Menu Formules Liste Gestion du piège Gestion des cubes Historique Carte TROC : Interface de la tablette tactile

27 – Page 27 Temps de jeu Objet ciblé Description de lobjet ciblé Formules actives Autre objet visible Niveau dénergie magique Œil magique Messages Interface dans le casque

28 – Page 28 Projet IHM l Allez voir Easy Visit Sur la vtrine

29 – Page 29 Dimensions de l espace problème l Selon trois axes Techniques dinteraction Collaboration Contexte

30 – Page 30 Mobilité : Interface « Baby face » l De très nombreuses techniques d interaction l Technique d interaction : plusieurs perspectives psychologie cognitive : système sensoriel informatique : technique dinteraction l Technique dinteraction : plusieurs niveaux dabstraction –dispositif physique clavier, souris, écran, haut-parleur,... –Système représentationnel langue pseudo-naturelle, manipulation directe,... Système sensoriel Système cognitif

31 – Page 31 Interface « Baby face » l Technique d interaction en sortie l Son spatialisé : T = Soundbeam Neckset RDV à 15h

32 – Page 32 Interface « Baby face » : multimodalité l Plusieurs techniques ou modalités d interaction l Apports de la multimodalité –Flexibilité/adaptabilité (contexte d usage) –Robustesse (complémentarité, redondance) –Expressivité (complémentarité) l Problèmes posés –Validation empirique de ces apports –Etude de lusage des modalités (choix, appropriation, etc.)

33 – Page 33 Interface « Baby face » : multimodalité l Technique = Go to the middle of the message T =

34 – Page 34 Interface « Baby face » : multimodalité l Magicien d oz CompèreSujet observé

35 – Page 35 Interface « Baby face » : multimodalité l Usage des modalités par les sujets l Toutes commandes / Toutes sessions Vocale Tactile Gestuelle Embodied

36 – Page 36 Interface « Baby face » : multimodalité l Usage des techniques d interaction par les sujets l Variabilité inter-individuelle importante dans l usage (fréquence, préférences variées) l Spécialisation l Peu de redondance et de complémentarité

37 – Page 37 Optimisation de lutilisation de la Wiimote pour des présentations en salle Eric Nouri Cédric Pein Maximilien Perrin Yannick Reynard 2007/2008

38 – Page 38 Audience Etat actuel Nos objectifs Audience

39 – Page 39

40 – Page 40

41 – Page 41 l Variabilité importante entre les utilisateurs. l Néanmoins, il apparait que : –La navigation à travers les diapositives est toujours affectée à la croix multidirectionnelle. –Les fonctionnalités nécessitant un pointage sont majoritairement attribuées à « A » et à « B ».

42 – Page 42

43 – Page 43 l Les participants –7 étudiants de lESSI et de luniversité de Nice l Le matériel –Un vidéoprojecteur et un écran –Un document Powerpoint –Un ordinateur portable avec Bluetooth –Un émetteur infrarouge –Une Wiimote l Le lieu –Salles de cours < à 50 personnes –Le participant est à plus de 4 m de lécran l Le dispositif

44 – Page 44

45 – Page 45

46 – Page 46 l Scénario n°1 : –Après avoir lancé le diaporama, au début de la présentation, vous souhaitez commencer par un écran noir. Puis commencez la présentation (page de titre). l Scénario n°2 : –Sur un schéma/graphique, dessinez un cercle, puis gommez. l Scénario n°3 : –Sur du texte, soulignez 2 mots consécutifs, puis gommez. l Scénario n°4 : –Au cours de la présentation, vous avez oublié dinsister sur un point de la diapositive n°3, vous souhaitez la retrouver en passant par le mode plan (trieuse). Réaffichez-là en plein écran. l Scénario n°5 : –Avez-vous une idée du temps quil vous reste pour votre présentation ? l Scénario n°6 (optionnel): –Vous souhaitez lancer lhyperlien qui figure sur votre document Powerpoint, pouvez-vous le faire ?

47 – Page 47 l Recueil de données par grille dobservation et questionnaire de satisfaction avec rappel des commandes: –Peu derreurs (<8%) –Problèmes avec lefficience du mode dessin (58% jugent le contrôle difficile) –Lécran noir est une fonctionnalité mineure (pour 72% des utilisateurs) –Version satisfaisante pour les utilisateurs (avis favorable pour 80% des questions) –Rappel des commandes sans erreurs

48 – Page 48 l Gestion à la fois des gestures, du pointage et des boutons. –Les gestures sactivent avec un bouton. –Toutes les fonctionnalités peuvent seffectuer sans gestures.

49 – Page 49 Les enjeux de la mutation –Ingénierie au cas par cas insuffisante Coûts de développement et de maintenance Cohérence ergonomique entre versions l Des problèmes classiques prennent une importance particulière – concevoir pour plusieurs plates-formes – assurer la sécurité et la confidentialité

50 – Page 50 Plasticité des interfaces l Un peu dhistoire … –Introduction du terme à Interact99 –Capacité dune interface à sadapter à son contexte dusage dans le respect de son utilisabilité –Contexte dusage Plate-forme Environnement Utilisateur (2001)

51 – Page 51 Cadre de référence : principes l Spécifier 1 fois -> N Interfaces approche par modèles Trois groupes de modèles Domaine Contexte Adaptation Trois instanciations Ontologiques: Métadescriptifs, théorie Archetypes: spécifiques au contexte ciblé, phase conception Observés: exécutables, phase exécution

52 – Page 52 Les enjeux de la mutation l De nouveaux problèmes à résoudre – prendre en compte le contexte dans l'interaction

53 – Page 53 Plasticité des interfaces : une nécessité l Problème ? –Exemple SI la batterie du PC faiblit ALORS passer sur PDA –SI condition ALORS action Action Réaction

54 – Page 54 Reconnaissance de situation Exécution de la réaction Capture du contexte Identification Des solutions candidates Selection dune solution candidate Détection de changement de contexte Identification du changement de contexte Exécution du prologue Execution de la reaction Execution de Lépilogue Calcul dune réaction Cadre de r é f é rence : phase ex é cution

55 – Page 55 Objectifs du module l Etude de marché et/ou réalisation de logiciels à la demande (constructeurs dapplications) l Fournir un prototype adapté aux besoins clients l Evaluer le coût de réalisation du produit final –Mettre laccent sur lIHM pour le dialogue l Architecture logicielle pour la mise en œuvre réelle de lapplication

56 – Page 56 Etude centrée utilisateur l Etude dune IHM existante : reconception –Définir le modèle conceptuel de lutilisateur –Évaluer linterface existante –Dégager le modèle de conception –Proposer un prototype (maquettage papier)

57 – Page 57 Etude centrée utilisateur l Conception dune IHM –Définir le modèle conceptuel de lutilisateur –Dégager le modèle de conception –Proposer un prototype (maquettage papier)

58 – Page 58 Etude centrée utilisateur l Construction dune IHM –Dégager le modèle de conception –Proposer un prototype reposant sur une architecture logicielle pour lIHM

59 – Page 59 Mise en commun des études l Confronter les 3 prototypes l Réaliser un prototype plus finalisé l Faire évaluer le prototype l Conclure

60 – Page 60 l Reconception l Maquettage papier l Evaluation l Mise en situation

61 – Page 61 Utilisation ergonomique dun autoradio Mise en situation & évaluation ESSI 3 Année 2004/2005 Claire Fiastre – Jean Hodot – Pierre Leca – Pierre Reveillon Best Of 2005

62 – Page 62 I - Notre solution II - Evaluation de notre interface II - Démonstration Notre objectif initial Simplifier lensemble des commandes Faciliter leur accès Améliorer la sécurité dutilisation ESSI 3 Claire Fiastre – Jean Hodot – Pierre Leca – Pierre Reveillon Année 2004/ Emplacement 2 - Utilisation

63 – Page 63 I - Notre solution II - Evaluation de notre interface II - Démonstration Lemplacement de laffichage Projection sur le pare-brise Temps de détournement du regard diminué ESSI 3 Claire Fiastre – Jean Hodot – Pierre Leca – Pierre Reveillon Année 2004/ Emplacement 2 - Utilisation

64 – Page 64 I - Notre solution II - Evaluation de notre interface II - Démonstration Lemplacement de laffichage Technologie Head Up Display (tête-haute) Temps de détournement du regard diminué ESSI 3 Claire Fiastre – Jean Hodot – Pierre Leca – Pierre Reveillon Année 2004/ Emplacement 2 - Utilisation

65 – Page 65 Notre solution II - I - Evaluation de notre interface II - Démonstration ESSI 3 Claire Fiastre – Jean Hodot – Pierre Leca – Pierre Reveillon Année 2004/2005 Lemplacement des commandes Regroupement sur le volant Accès direct Zone tactile (pad) + 4 boutons 1 - Emplacement 2 - Utilisation

66 – Page 66 I - Notre solution II - Evaluation de notre interface II - Démonstration ESSI 3 Claire Fiastre – Jean Hodot – Pierre Leca – Pierre Reveillon Année 2004/2005 Utilisation des boutons 2 catégories de boutons Comportements différents de selon le nombre dappuis Commandes spécifiques à la source écoutée Fonctions avancées Navigation Commandes globales de lautoradio Fonctions liées au son Mode 1 - Emplacement 2 - Utilisation

67 – Page 67 I - Notre solution II - Evaluation de notre interface II - Démonstration ESSI 3 Claire Fiastre – Jean Hodot – Pierre Leca – Pierre Reveillon Année 2004/2005 Utilisation du pad Liste de mouvements reconnus Comportements différents selon le mouvement 1 - Emplacement 2 - Utilisation

68 – Page 68 I - Notre solution II - Evaluation de notre interface II - Démonstration ESSI 3 Claire Fiastre – Jean Hodot – Pierre Leca – Pierre Reveillon Année 2004/2005 Utilisation de lensemble Une commande = combinaison dappuis et de mouvements Exemple : Monter le volume Appui sur le bouton de son Mouvement vers le haut 1 - Emplacement 2 - Utilisation

69 – Page 69 I - Notre solution II - Evaluation de notre interface II - Démonstration ESSI 3 Claire Fiastre – Jean Hodot – Pierre Leca – Pierre Reveillon Année 2004/ Notre prototype 2 - Déroulement de lévaluation 3 - Résultats Se rapprocher dune utilisation réelle Son ? Extraits de radios et morceaux de types différents, CD entier Affichage ? Ecran dordinateur Commandes ? Touches du clavier Souris dordinateur portable

70 – Page 70 I - Notre solution II - Evaluation de notre interface II - Démonstration ESSI 3 Claire Fiastre – Jean Hodot – Pierre Leca – Pierre Reveillon Année 2004/ Notre prototype 2 - Déroulement de lévaluation 3 - Résultats Se rapprocher dune utilisation réelle

71 – Page 71 I - Notre solution II - Evaluation de notre interface II - Démonstration ESSI 3 Claire Fiastre – Jean Hodot – Pierre Leca – Pierre Reveillon Année 2004/ Notre prototype 2 - Déroulement de lévaluation 3 - Résultats Utilisation du prototype Boutons Touches du clavier Q,E, I et M Zone tactile Mouvements de la souris sans clic Possibilité de sortir de ce mode

72 – Page 72 I - Notre solution II - Evaluation de notre interface II - Démonstration ESSI 3 Claire Fiastre – Jean Hodot – Pierre Leca – Pierre Reveillon Année 2004/ Notre prototype 2 - Déroulement de lévaluation 3 - Résultats Fonctionnalités implémentées Ecoute dun CD Lecture, navigation entre les morceaux, stop Modes « répétition » et « aléatoire » Ecoute de la radio Navigation entre les préréglages Fonctions relatives au son Modification du volume

73 – Page 73 I - Notre solution II - Evaluation de notre interface III - Démonstration ESSI 3 Claire Fiastre – Jean Hodot – Pierre Leca – Pierre Reveillon Année 2004/ Notre prototype 2 - Déroulement de lévaluation 3 - Résultats 4 évaluateurs étudiants Mise en situation Temps dadaptation aux commandes Scénario dévaluation Réactions différentes Commandes « amusantes »

74 – Page 74 l Reconception l Maquettage papier l Evaluation l Mise en situation

75 – Page 75 Présentation du sujet l Analyse des mosaïques de télévision (CanalSat ou Free) peu intuitives mal conçues l Objectif : construire un système de navigation plus intuitif. l Public visé : Adolescents & adultes

76 – Page 76 Scénarios de lexistant l Conception des scénarios – Scénarios conçus en fonction des problèmes soulevés par les utilisateurs lors de la passation du questionnaire – Conception de 5 scénarios accès à une chaîne par son nom accès à une chaîne par son numéro modification du volume sonore accès à une chaîne par son thème navigation au sein des écrans de la mosaïque

77 – Page 77 Scénarios de lexistant l Pré-tests des scénarios – Évaluation du temps nécessaire à la passation – Amélioration des scénarios

78 – Page 78 Scénarios de lexistant l Tests des scénarios – Enregistrement vidéo et papier des réponses – Types dutilisateurs : experts et novices – Nombre de participant : 5 – Types de mosaïques : CanalSat et Freebox

79 – Page 79 Modèles de tâches

80 – Page 80 Bilan des scénarios l Résultats des tests utilisateurs –Utilisateurs insatisfaits – Principales raisons : Mosaïque = chaîne 1 (a changé en janvier : chaîne 8 …) Manque dinformation sur les programmes en cours Difficile de distinguer les chaînes payantes des gratuites …

81 – Page 81 Proposition damélioration l Réalisation dun maquette de bas niveau –Conçue en fonction des besoins des utilisateurs

82 – Page 82

83 – Page 83 Scénarios de la maquette l Conception de nouveaux scénarios à partir de la maquette de bas niveau –En réadaptant les scénarios précédents –Mise en place de 6 scénarios Navigation au sein des écrans de la mosaïque Accès à une chaîne par son thème Accès aux films prochainement diffusés Accès à une chaîne par le nom de la chaîne Ajout de chaînes dans la catégorie « mes favoris » Achat d'une chaîne

84 – Page 84 Scénarios de la maquette Modèle de tache de lexistant Modèle de tache de la maquette de bas niveau

85 – Page 85 l Reconception l Maquettage papier l Evaluation l Mise en situation

86 – Page 86 Baladeur MP3 pour enfants Questionnaire ciblé et adapté Alexandre Aureli – Frédéric Laurendeau – Nicolas Rondelé – Christophe Schreiber BestOf 2005 Encadreur: Alain Giboin (sujet proposé par Teresa Colombi)

87 – Page 87 Problématique l Problèmes –Lecteurs MP3 classiques non adaptés –Communication difficile avec les utilisateurs l Restrictions –Définition dune tranche dâge –Chargement du contenu par les parents –Nécessité dutiliser un matériel adéquat

88 – Page 88 Démarche préalable (1/5) l Choix du public visé –Évolution rapide des enfants en bas âge Dextérité Capacité de raisonnement –Choix de viser les 3-6 ans Facteur limitant des 3 ans Appareil attractif pour un enfant de 6 ans

89 – Page 89 Démarche préalable (3/5) l Réalisation dun questionnaire –Données visées Habitudes découte Connaissances technologiques Préférences visuelles Attente des futurs utilisateurs –Démarche Sondage par linstituteur –Rédaction des directives Nécessité davoir un questionnaire –Ludique (captiver lattention des enfants) –Pédagogique (nécessité dune finalité pour chaque activité)

90 – Page 90 Démarche préalable (4/5)

91 – Page 91 Démarche préalable (5/5) l Retours du questionnaire –Modification de la démarche Mis en œuvre trop lourde Sondage individuel –Pas dinfluence extérieure –Remplissage assisté par linstituteur –Exploitation des résultats Analyse des résultats –Dégager les tendances générales Impact sur le prototype –Nouvelle apparence (forme, disposition) –Ajout de fonctionnalités

92 – Page 92 Prototype (2/4) –Evolution du prototype Première version Version finale Travail sur les coques amovibles (Clémentine Némo and co)

93 – Page 93 l Reconception l Maquettage papier l Evaluation l Mise en situation

94 – Page 94 Gestaction 3D Mise en situation : un vrai prototype

95 – Page 95 AVANCEES TECHNIQUES - Construction des gants

96 – Page 96 AVANCEES TECHNIQUES Webcam - Traitement des images -Détection des diodes -Problèmes et limites

97 – Page 97 l Mise en place de lévaluation

98 – Page 98 l 2 autres projets à regarder –HelpMeDoc et son rapport Démarche centrée utilisateur (vitrine.polytech.unice.fr) –ePhotoBook et sa présentation Démarche et prototype (en ligne) Et beaucoup dautres……

99 – Page 99 Merci à … l Laurence Nigay (IMAG) : –Exposé de synthèse aux Asisses I3 l Marie THILLIEZ (Université de Valenciennes) : –LES APPLICATIONS DE PROXIMITE l Gaëtan Rey, Joëlle Coutaz (IMAG) : –LE CONTEXTEUR: UN MODELE COMPUTATIONEL POUR LE CONTEXTE l Joelle Coutaz et Gaelle Calvary (IMAG) : – Plasticité des interfaces l Jullien Bouchet, Laurence Pasqualetti (IMAG) –SYSTEMES MIXTES MOBILES ET COLLABORATIFS –TROC : UN JEU COLLABORATIF SUR SUPPORT MOBILE EXPLOITANT DES TECHNIQUES DE REALITE AUGMENTEE –Et à tous les étudiants qui ont fournis daussi bons projets.....


Télécharger ppt "– Page 1 Conception et évaluation d IHM : Introduction Anne-Marie Déry"

Présentations similaires


Annonces Google