Upload
amelie-castel
View
114
Download
9
Embed Size (px)
Citation preview
– Page 2
Quelques définitions
CHM Communication Homme MachineEtude 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
– Page 3
Problématique actuelle
Prendre en compte les avancées technologiquesnouveaux supports matérielsarrivée du net (masse de données + réseaux)nouveaux moyens d'interactionsmultimé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 complexevoiture vs électroménagertéléphone : nouvelle gamme
– Page 4
Utilisabilité des interfaces
Facile à apprendre et à utiliserRetour d'information rassurant, informatif et immédiat
La conception doit répondre aux besoins, connaissances etCaractéristiques des utilisateurs
Objectif avoué : fiabilité, efficacité, productivité
3 aspects étudiés à travers le moduleconception, évaluation, prototypage
– Page 5
Cycle de vie des IHMs
– Page 6
IHM sur supports mobiles
Complexification de la conception ergonomique et logicielle
– Page 7
IHM sur supports mobiles
Complexification de la conception ergonomique et
logicielle
– Page 8
IHM sur supports mobiles
Complexification de la conception ergonomique et logicielle
– Page 9
IHM : Ordinateur, ubiquité et mobilité
Ubiquité(environnementéquipé)
Mobilité(utilisateuréquipé)
– 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
De nouveaux problèmes à résoudre– prendre en compte le contexte dans l'interaction
• Perception/modélisation/adaptation
Des solutions à des problèmes anciens à revoir– les techniques d'interaction : windows, icons, menus, pointing
Des problèmes classiques prennent une importance particulière– concevoir pour plusieurs plates-formes– assurer la sécurité et la confidentialité
– Page 11
Analyse des besoins
Conception
Conception logicielle
Codage
Tests Unitaires
Tests d’intégration
Tests UtilisateursEvaluation ergonomique
Boîtes à outils
Mécanismes généraux
Modèle d’architecture logicielle
Espace de conception
Propriétés ergonomiques
Dimensions de l ’espace problème
– Page 12
Dimensions de l ’espace problème
Selon trois axes
Techniques d’interaction
Collaboration
Contexte
– Page 13
Dimensions de l ’espace problème
Selon trois axes
Techniques d’interaction
Collaboration
Contexte
– Page 14
Système interactif sensible au contexte
Système interactif sensible au contexte• capable d’identifier les circonstances qui entourent l’action utilisateur • en vue d’offrir des services contextualisés
– offre sélective d’information – décoration contextuelle pour recherche ultérieure
Contexte : ensemble de propriétés de phénomènes physiques qui peuvent être captées
– Page 15
Système interactif sensible au contexte
– Page 16
Applicatifs envisagés
Localisation de l’utilisateur
Identification et localisation de dispositifs d’interaction
– 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 Poly’Table • Pour l’analyse de l’existant
– Au niveau matériel
• Pour le contexte d’usage très particulier- Questionnaire
- Dans la vitrine : https://vitrine.polytech.unice.fr
– Page 18
Existantbar « 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 tactilehttp://www.logiciel-restaurant.org
/texts/logiciel-de-caisse-tactile
Table tactile à usage militaire
Société TouchTable
navigation poussée, très chères,
domaines de pointes, ou gouvernement.
http://www.touchtable.com
– Page 19
Dimensions de l ’espace problème
Selon trois axes
Techniques d’interaction
Collaboration
Contexte
– Page 20
Mobilité : nouveau découpage spatio-temporel
Déplacement dans l’espace
Variation dans le temps : synchronisme/ asynchronisme
local distant
asyn
chro
ne
syn
chro
ne
– Page 21
Mobilité : nouveau découpage spatial
Etude selon les lieux d’interaction et non la distance
CONFINElieu de l’interaction
délimité
VAGABONDlieu de l’interaction
n’importe oùENSEMBLE DISPERSE
IDENTIQUE(local)
DIFFERENT(distant)
– Page 22
Plate-forme Magic
Camera + Micro
Casque + Ecouteurs
Capteur d’orientation
Stylos
Tablette + Extenseur de port
Réseau sans fils
– Page 23
MAGIC : Travail sur le terrain de fouille
Explorer le site (Mobilité)
Travailler en groupe sur le site (Collecticiel)
S’informer auprès d’experts distants (Collecticiel)
Comparer des objets physiques avec des objets d’une base de données (Augmentation)
Accéder aux objets enlevés du site (Augmentation)
– Page 24
MAGIC : vue d’ensemble
• Sur la tablette :– Communication
(forum, mail, etc.)
– Coordination (carte)
– Production (outils d’édition)
• A travers le casque:– Combinaison du
physique avec l’informatique grâce à la passerelle
– Page 25
• Un archéologue travaille
• Il trouve un objet• La découverte est retirée
du site
• L’objet est sauvegardé dans une base de données
• Un archéologue approche de où était l’objet
• La découverte est virtuellement disponible
Terrain augmenté
– Page 26
Menu
Formules
Liste
Gestion du piège
Gestion des cubes
HistoriqueCarte
TROC : Interface de la tablette tactile
– Page 27
Temps de jeu
Objet ciblé
Description de l’objet ciblé
Formules actives
Autre objet visible
Niveau d’énergie magique
Œil magiqueMessages
Interface dans le casque
– Page 28
Projet IHM
Allez voir Easy Visit
Sur la vtrine
– Page 29
Dimensions de l ’espace problème
Selon trois axes
Techniques d’interaction
Collaboration
Contexte
– Page 30
Mobilité : Interface « Baby face » De très nombreuses techniques d ’interaction
Technique d ’interaction : plusieurs perspectives• psychologie cognitive : système sensoriel• informatique : technique d’interaction
Technique d’interaction : plusieurs niveaux d’abstraction–dispositif physique
clavier, souris, écran, haut-parleur, ...
–Système représentationnellangue pseudo-naturelle, manipulation directe, ...
Système sensoriel
Système cognitif
– Page 31
Interface « Baby face »
Technique d ’interaction en sortie
Son spatialisé : T = <haut-parleur, LN>
SoundbeamNeckset
RDV à 15h
– Page 32
Interface « Baby face » : multimodalité
Plusieurs techniques ou modalités d ’interaction
Apports de la multimodalité –Flexibilité/adaptabilité (contexte d ’usage)–Robustesse (complémentarité, redondance)–Expressivité (complémentarité)
Problèmes posés –Validation empirique de ces apports –Etude de l’usage des modalités (choix, appropriation, etc.)
– Page 33
Interface « Baby face » : multimodalité Technique = <d, s> Go to the middle
of the message
T = <caméra-doigt, gestes> T = <micro, pseudo LN>
T = <ordinateur, gestes> T = <stylet, manipulation directe>
– Page 34
Interface « Baby face » : multimodalité
Magicien d ’oz
Compère Sujet observé
– Page 35
Interface « Baby face » : multimodalité
Usage des modalités par les sujets
Toutes commandes / Toutes sessions
Vocale
Tactile
Gestuelle
Embodied
– Page 36
Interface « Baby face » : multimodalité
Usage des techniques d ’interaction par les sujets
Variabilité inter-individuelle importante dans l ’usage (fréquence, préférences variées)
Spécialisation
Peu de redondance et de complémentarité
– Page 37
Optimisation de l’utilisation de la Wiimote pour des présentations en salle
Eric NouriCédric PeinMaximilien PerrinYannick Reynard 2007/2008
– Page 38
Audience
Etat actuel Nos objectifs
Audience
– Page 39
– Page 40
– Page 41
Variabilité importante entre les utilisateurs.
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 ».
– Page 42
– Page 43
Les participants– 7 étudiants de l’ESSI et de l’université de Nice
Le matériel– Un vidéoprojecteur et un écran– Un document Powerpoint– Un ordinateur portable avec Bluetooth– Un émetteur infrarouge– Une Wiimote
Le lieu– Salles de cours < à 50 personnes– Le participant est à plus de 4 m de l’écran
Le dispositif
– Page 44
– Page 45
– Page 46
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).
Scénario n°2 :– Sur un schéma/graphique, dessinez un cercle, puis gommez.
Scénario n°3 :– Sur du texte, soulignez 2 mots consécutifs, puis gommez.
Scénario n°4 :– Au cours de la présentation, vous avez oublié d’insister 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.
Scénario n°5 :– Avez-vous une idée du temps qu’il vous reste pour votre présentation ?
Scénario n°6 (optionnel):– Vous souhaitez lancer l’hyperlien qui figure sur votre document Powerpoint, pouvez-vous le faire ?
– Page 47
Recueil de données par grille d’observation et questionnaire de satisfaction avec rappel des commandes:–Peu d’erreurs (<8%) –Problèmes avec l’efficience 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
– Page 48
Gestion à la fois des gestures, du pointage et des boutons.
–Les gestures s’activent avec un bouton.
–Toutes les fonctionnalités peuvent s’effectuer sans gestures.
– 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
Des problèmes classiques prennent une importance particulière– concevoir pour plusieurs plates-formes– assurer la sécurité et la confidentialité
– Page 50
Plasticité des interfaces
Un peu d’histoire …
– Introduction du terme à Interact’99
– Capacité d’une interface à s’adapter à son contexte d’usage dans
le respect de son utilisabilité
– Contexte d’usage
• Plate-forme
• Environnement
• Utilisateur (2001)
– Page 51
Cadre de référence : principes “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”
– Page 52
Les enjeux de la mutation
De nouveaux problèmes à résoudre– prendre en compte le contexte dans l'interaction
– Page 53
Plasticité des interfaces :une nécessité
Problème ?
– Exemple
• SI la batterie du PC faiblit ALORS passer sur PDA
– SI condition ALORS action
Action Réaction
– Page 54
Reconnaissance de situation
Exécution de la réaction
Capture du
contexte
IdentificationDes solutions
candidates
Selection d’unesolutioncandidate
Détection de
changement decontexte
Identification du
changement decontexte
Exécution du
prologue
Execution de la
reaction
Execution de
L’épilogue
Calcul d’une réaction
Cadre de référence : phase “exécution”
– Page 55
Objectifs du module
Etude de marché et/ou réalisation de logiciels à la demande (constructeurs d’applications)
Fournir un prototype adapté aux besoins clients
Evaluer le coût de réalisation du produit final– Mettre l’accent sur l’IHM pour le dialogue
Architecture logicielle pour la mise en œuvre réelle de l’application
– Page 56
Etude centrée utilisateur
Etude d’une IHM existante : reconception
–Définir le modèle conceptuel de l’utilisateur
–Évaluer l’interface existante
–Dégager le modèle de conception
–Proposer un prototype (maquettage papier)
– Page 57
Etude centrée utilisateur
Conception d’une IHM
–Définir le modèle conceptuel de l’utilisateur
–Dégager le modèle de conception
–Proposer un prototype (maquettage papier)
– Page 58
Etude centrée utilisateur
Construction d’une IHM
–Dégager le modèle de conception
–Proposer un prototype reposant sur une architecture
logicielle pour l’IHM
– Page 59
Mise en commun des études
Confronter les 3 prototypes
Réaliser un prototype plus finalisé
Faire évaluer le prototype
Conclure
– Page 60
Reconception
Maquettage papier
Evaluation
Mise en situation
– Page 61
Utilisation ergonomique
d’un autoradio
Mise en situation & évaluation
ESSI 3 Année 2004/2005
Claire Fiastre – Jean Hodot – Pierre Leca – Pierre Reveillon
Best Of 2005
– Page 62
I - Notre solution II - Evaluation de notre interface II - Démonstration
Notre objectif initial
Simplifier l’ensemble des commandes
Faciliter leur accès
Améliorer la sécurité d’utilisation
ESSI 3 Claire Fiastre – Jean Hodot – Pierre Leca – Pierre Reveillon Année 2004/2005
1 - Emplacement 2 - Utilisation
– Page 63
I - Notre solution II - Evaluation de notre interface II - Démonstration
L’emplacement de l’affichage
Projection sur le pare-briseTemps de détournement du regard diminué
ESSI 3 Claire Fiastre – Jean Hodot – Pierre Leca – Pierre Reveillon Année 2004/2005
1 - Emplacement 2 - Utilisation
– Page 64
I - Notre solution II - Evaluation de notre interface II - Démonstration
L’emplacement de l’affichage
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/2005
1 - Emplacement 2 - Utilisation
– 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
L’emplacement des commandes
Regroupement sur le volant Accès direct
Zone tactile (pad) + 4 boutons
1 - Emplacement 2 - Utilisation
– 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 boutonsComportements différents de selon le nombre d’appuis
Commandes spécifiquesà la source écoutée
Fonctions avancées
Navigation
Commandes globales de l’autoradio
Fonctions liées au son
Mode
1 - Emplacement 2 - Utilisation
– 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
– 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 l’ensemble
Une commande = combinaison d’appuis et de mouvements
Exemple : Monter le volume Appui sur le bouton de son Mouvement vers le haut
1 - Emplacement 2 - Utilisation
– 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/2005
1 - Notre prototype 2 - Déroulement de l’évaluation 3 - Résultats
Se rapprocher d’une utilisation réelle
Son ?Extraits de radios et morceaux de types différents, CD entier
Affichage ?Ecran d’ordinateur
Commandes ?Touches du clavierSouris d’ordinateur portable
– 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/2005
1 - Notre prototype 2 - Déroulement de l’évaluation 3 - RésultatsSe rapprocher d’une utilisation réelle
– 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/2005
1 - Notre prototype 2 - Déroulement de l’évaluation 3 - Résultats
Utilisation du prototype
BoutonsTouches du clavier Q,E, I et M
Zone tactileMouvements de la souris sans clicPossibilité de sortir de ce mode
– 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/2005
1 - Notre prototype 2 - Déroulement de l’évaluation 3 - Résultats
Fonctionnalités implémentées
Ecoute d’un CDLecture, navigation entre les morceaux, stopModes « répétition » et « aléatoire »
Ecoute de la radioNavigation entre les préréglages
Fonctions relatives au sonModification du volume
– 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/2005
1 - Notre prototype 2 - Déroulement de l’évaluation 3 - Résultats
4 évaluateurs étudiants
Mise en situationTemps d’adaptation aux commandes
Scénario d’évaluationRéactions différentesCommandes « amusantes »
– Page 74
Reconception
Maquettage papier
Evaluation
Mise en situation
– Page 75
Présentation du sujet
Analyse des mosaïques de télévision (CanalSat ou Free) peu intuitivesmal conçues
Objectif : construire un système de navigation plus intuitif.
Public visé : Adolescents & adultes
– Page 76
Scénarios de l’existant
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
– Page 77
Scénarios de l’existant
Pré-tests des scénarios
– Évaluation du temps nécessaire à la passation– Amélioration des scénarios
– Page 78
Scénarios de l’existant
Tests des scénarios
– Enregistrement vidéo et papier des réponses– Types d’utilisateurs : experts et novices– Nombre de participant : 5– Types de mosaïques : CanalSat et Freebox
– Page 79
Modèles de tâches
– Page 80
Bilan des scénarios
Résultats des tests utilisateurs– Utilisateurs insatisfaits
– Principales raisons :
• Mosaïque = chaîne 1 (a changé en janvier : chaîne 8 …)
• Manque d’information sur les programmes en cours
• Difficile de distinguer les chaînes payantes des gratuites
• …
– Page 81
Proposition d’amélioration
Réalisation d’un maquette de bas niveau– Conçue en fonction des besoins des utilisateurs
– Page 82
– Page 83
Scénarios de la maquette
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
– Page 84
Scénarios de la maquette
Modèle de tache de l’existant
Modèle de tache de la maquette de bas niveau
– Page 85
Reconception
Maquettage papier
Evaluation
Mise en situation
– 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)
– Page 87
Problématique
Problèmes–Lecteurs MP3 classiques non adaptés–Communication difficile avec les utilisateurs
Restrictions–Définition d’une tranche d’âge–Chargement du contenu par les parents–Nécessité d’utiliser un matériel adéquat
– Page 88
Démarche préalable (1/5)
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
– Page 89
Démarche préalable (3/5)
Réalisation d’un questionnaire– Données visées
• Habitudes d’écoute• Connaissances technologiques• Préférences visuelles• Attente des futurs utilisateurs
– Démarche • Sondage par l’instituteur
– Rédaction des directives• Nécessité d’avoir un questionnaire
– Ludique (captiver l’attention des enfants)– Pédagogique (nécessité d’une finalité pour chaque activité)
– Page 90
Démarche préalable (4/5)
– Page 91
Démarche préalable (5/5)
Retours du questionnaire– Modification de la démarche
• Mis en œuvre trop lourde• Sondage individuel
– Pas d’influence extérieure– Remplissage assisté par l’instituteur
– 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
– Page 92
Prototype (2/4)
– Evolution du prototype
• Première version
• Version finale
• Travail sur les coques amovibles(Clémentine Némo and co)
– Page 93
Reconception
Maquettage papier
Evaluation
Mise en situation
– Page 94
Gestaction 3D
Mise en situation : un vraiprototype
– Page 95
AVANCEES TECHNIQUES
- Construction des gants
– Page 96
AVANCEES TECHNIQUES
Webcam
- Traitement des images
-Détection des diodes
-Problèmes et limites
– Page 97
Mise en place de l’évaluation
– Page 98
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 d’autres……
– Page 99
Merci à …
Laurence Nigay (IMAG) : – Exposé de synthèse aux Asisses I3
Marie THILLIEZ (Université de Valenciennes) : – LES APPLICATIONS DE PROXIMITE
Gaëtan Rey, Joëlle Coutaz (IMAG) : – LE CONTEXTEUR: UN MODELE COMPUTATIONEL POUR LE CONTEXTE
Joelle Coutaz et Gaelle Calvary (IMAG) :– Plasticité des interfaces
Jullien Bouchet, Laurence Pasqualetti(IMAG)
– SYSTEMES MIXTES MOBILES ET COLLABORATIFS
– TROC : UN JEU COLLABORATIF SUR SUPPORT MOBILEEXPLOITANT DES TECHNIQUES DE REALITE AUGMENTEE
– Et à tous les étudiants qui ont fournis d’aussi bons projets .....