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

–

Conception et évaluation d’ IHM :

Introduction

Anne-Marie Déry [email protected]

–

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

–

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

–

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

–

Cycle de vie des IHMs

–

IHM sur supports mobiles

Complexification de la conception ergonomique et logicielle

–


Complexification de la conception ergonomique et

logicielle

–


Complexification de la conception ergonomique et logicielle

–

IHM : Ordinateur, ubiquité et mobilité

Ubiquité(environnementéquipé)

Mobilité(utilisateuréquipé)

–

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é

–

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

–


Selon trois axes

Techniques d’interaction

Collaboration

Contexte

–

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

–

Système interactif sensible au contexte

–

Applicatifs envisagés

Localisation de l’utilisateur

Identification et localisation de dispositifs d’interaction

–

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

–

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

–


Selon trois axes


Collaboration

Contexte

–

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

–

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)

–

Plate-forme Magic

Camera + Micro

Casque + Ecouteurs

Capteur d’orientation

Stylos

Tablette + Extenseur de port

Réseau sans fils

–

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)

–

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

–

• 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é

–

Menu

Formules

Liste

Gestion du piège

Gestion des cubes

HistoriqueCarte

TROC : Interface de la tablette tactile

–

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

–

Projet IHM

Allez voir Easy Visit

Sur la vtrine

–


Selon trois axes


Collaboration

Contexte

–

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

–

Interface « Baby face »

Technique d ’interaction en sortie

Son spatialisé : T = <haut-parleur, LN>

SoundbeamNeckset

RDV à 15h

–

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.)

–

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>

–


Magicien d ’oz

Compère Sujet observé

–


Usage des modalités par les sujets

Toutes commandes / Toutes sessions

Vocale

Tactile

Gestuelle

Embodied

–


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é

–

Optimisation de l’utilisation de la Wiimote pour des présentations en salle

Eric NouriCédric PeinMaximilien PerrinYannick Reynard 2007/2008

–

Audience

Etat actuel Nos objectifs

Audience

–

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 ».

–

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

–

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 ?

–

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

–

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.

–


– 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é

–

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)

–

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”

–


De nouveaux problèmes à résoudre– prendre en compte le contexte dans l'interaction

–

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

–

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”

–

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

–

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)

–


Conception d’une IHM

–Définir le modèle conceptuel de l’utilisateur


–Proposer un prototype (maquettage papier)

–


Construction d’une IHM


–Proposer un prototype reposant sur une architecture

logicielle pour l’IHM

–

Mise en commun des études

Confronter les 3 prototypes

Réaliser un prototype plus finalisé

Faire évaluer le prototype

Conclure

–

Reconception

Maquettage papier

Evaluation

Mise en situation

–

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

–

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

–


L’emplacement de l’affichage

Projection sur le pare-briseTemps de détournement du regard diminué



–


L’emplacement de l’affichage

Technologie Head Up Display (tête-haute) Temps de détournement du regard diminué



–

Notre solution II - I - Evaluation de notre interface II - Démonstration


L’emplacement des commandes

Regroupement sur le volant Accès direct

Zone tactile (pad) + 4 boutons


–



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


–



Utilisation du pad

Liste de mouvements reconnus Comportements différents selon le mouvement


–



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 - 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

–



1 - Notre prototype 2 - Déroulement de l’évaluation 3 - RésultatsSe rapprocher d’une utilisation réelle

–




Utilisation du prototype

BoutonsTouches du clavier Q,E, I et M

Zone tactileMouvements de la souris sans clicPossibilité de sortir de ce mode

–




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

–

I - Notre solution II - Evaluation de notre interface III - Démonstration



4 évaluateurs étudiants

Mise en situationTemps d’adaptation aux commandes

Scénario d’évaluationRéactions différentesCommandes « amusantes »

–

Reconception

Maquettage papier

Evaluation

Mise en situation

–

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

–

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

–


Pré-tests des scénarios

– Évaluation du temps nécessaire à la passation– Amélioration des scénarios

–


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

–

Modèles de tâches

–

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

• …

–

Proposition d’amélioration

Réalisation d’un maquette de bas niveau– Conçue en fonction des besoins des utilisateurs

–

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

–

Scénarios de la maquette

Modèle de tache de l’existant

Modèle de tache de la maquette de bas niveau

–

Reconception

Maquettage papier

Evaluation

Mise en situation

–

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)

–

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

–

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

–


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é)

–


–


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

–

Prototype (2/4)

– Evolution du prototype

• Première version

• Version finale

• Travail sur les coques amovibles(Clémentine Némo and co)

–

Reconception

Maquettage papier

Evaluation

Mise en situation

–

Gestaction 3D

Mise en situation : un vraiprototype

–

AVANCEES TECHNIQUES

- Construction des gants

–

AVANCEES TECHNIQUES

Webcam

- Traitement des images

-Détection des diodes

-Problèmes et limites

–

Mise en place de l’évaluation

–

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……

–

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 .....

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

Documents

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