I n s t i t u t S u p é r i e u r d e s s c i e n c e s A p p l i q u é e s et d e Te c h n o l o g i e s d e S o u s s e

Cours Interactions Homme-Machine

Plan du cours

 Chapitre 1 : Introduction et fondamentaux des IHM

 Chapitre 2 : Conception des IHMs
 Chapitre 3 : Ergonomies des IHMs et l’expérience utilisateur (UX)
 Chapitre 4 : Sciences cognitives
Dr. WALI Wafa 1

 Chapitre 5 : Evaluation des IHMs

Wali Wafa
 I n s t i t u t S u p é r i e u r d e s s c i e n c e s A p p l i q u é e s e t d e Te c h n o l o g i e s d e S o u s s e

Cours Interactions Homme-Machine (IHM)

C HAPITRE 2 Wali Wafa

Conception des IHMs

Conception des systèmes informatiques, conception d’IHM,
processus de conception, technique de recueil d’information

Dr. WALI Wafa 2

 Conception des systèmes
informatiques
Conception des IHMs

Dr. WALI Wafa 3

 Définition
Conception des IHMs

Génie logiciel
• Ensemble de méthodes et outils pour produire et maintenir des
logiciels de qualité
• Besoin du client, idée du concepteur
• Cahier des charges fonctionnel
• Spécification
Fonctionnelle
 Description du logiciel en termes de fonctionnalités (métier)
 Scenarios, cas d’utilisation
Dr. WALI Wafa 4
 Définition
Conception des IHMs

Génie logiciel
• Spécification
Technique
 Comment réaliser ces fonctionalités
 Architecture à utiliser
Méthodes d’anlyse et de conception
 Pour formaliser ce processus

Dr. WALI Wafa 5

 Définition
Conception des IHMs

Approche génie logiciel

• Modéles en cascade
• Modéle en V
• Modéle en spirale
• Modéle par increments

Dr. WALI Wafa 6

 Méthodes de conception du génie logiciel
Conception des IHMs

Modéles en cascade (waterfall)

• Est une approche linéaire et séquentielle des différentes phases et
activités d’un projet
• Implique une progression étape par étape ou chaque phase de gestion
de projet doit être complétée avant de passer à la suivante

 L’évaluation intervient en dernier

 Retours en arrière uniquement dans la version avec itérations

Dr. WALI Wafa 7

 Méthodes de conception du génie logiciel
Conception des IHMs

Modéles en cascade (waterfall)

Dr. WALI Wafa 8

 Méthodes de conception du génie logiciel
Conception des IHMs

Modéles en V
• Principe:
 Détailler l’application jusqu’à sa realisation
Tester l’application
• Rôle des utilisateurs
L’analyse des besoins et de tests
Mais prise en compte limitée
 L’évaluation en fin après le codage
 Portée des retours arriére non précisée
Dr. WALI Wafa 9
 Méthodes de conception du génie logiciel
Conception des IHMs

Modéles en V

Dr. WALI Wafa 10

 Méthodes de conception du génie logiciel
Conception des IHMs

Modéles en spirale
• Principe:
 Version successives du logiciel de plus en plus complet
Importance de l’évaluation
Pour chaque cycle
 Identification des objectifs, alternatives, contraintes
 Analyse des risques et choix de développement
 Développement et validation du cycle
 Analyse des résultats et planification du cycle suivant
Dr. WALI Wafa 11
 Méthodes de conception du génie logiciel
Conception des IHMs

Modéles en spirale
 Effort de gestion important
 Les décisions régulières peuvent retarder le processus de
développement
 A cause de la subdivision du processus de développement, des
erreur et incohérences de conception peuvent facilement se
retrouve dans le produit final
 Inadapté aux petits projets aux risques raisonnables

Dr. WALI Wafa 12

 Méthodes de conception du génie logiciel
Conception des IHMs

Modéles en spirale

Dr. WALI Wafa 13

 Méthodes de conception du génie logiciel
Conception des IHMs

Bilan
 Méthodes structurées
 Adaptées aux grands projets
 Rôle des utilisateurs trop limité
 Processus centré sur les fonctionnalités du logiciel
 Évaluation tardive

Dr. WALI Wafa 14

 Méthodes de conception du génie logiciel
Conception des IHMs

Méthodes Agile
• Principe:
 Méthodes de conception itératives et incrémentales
 Projet fragmenté en plusieurs sous-parties (Sprint avec Scrum)
 Définition d‘objectifs à court terme
 Evaluations précoces
• Rôle des utilisateurs:
 Client au Coeur du processus
 Test auprés des utilisateurs
Dr. WALI Wafa 15
 Méthodes de conception du génie logiciel
Conception des IHMs

Méthodes Agile
• Le “product owner” (client) définit le périmétre du projet et compile
les fonctionnalités désirées par l’utilisateur sous forme de User Stories
• Le “product Backblog” regroupe les éléments à developer pour
réaliser la User Stories (les taches correspondant aux fonctionnalités
du système).
• Le development est itératif par sprints de 2-4 semaines
• Un sprint:
 Débute par “Sprint Planning” meeting
Dr. WALI Wafa 16
 Méthodes de conception du génie logiciel
Conception des IHMs

Méthodes Agile
 Des scrums chaque jour ( reunions courtes)
Se termine par un “Sprint Meeting Review”
• Les changements/nouveaux développments sont intégrés au “Product
BackBlog”

Dr. WALI Wafa 17

 Méthodes de conception du génie logiciel
Conception des IHMs

Méthodes Agile
 Gagner plus de contrôle sur le produit final
 Augmenter l’efficacité
 Assurer des livraisons de haute qualité
 Accroître la satisfaction des utilisateurs
 La minimization de la documentation dans un développement Agile
 La complexité de l’adoption de la culture Agile
 La difficulté d’implémentation pour des projets complexes et des
entreprises à grande échelle
Dr. WALI Wafa 18
 Méthodes de conception du génie logiciel
Conception des IHMs

Limites des méthodes de GL

• Certaines méthodes (méthode Agile) poussent à impliquer fortement
les utilisatrices dans la pahse de conception
 Implication limitée des utilisatrices (principalement lors de
l’analyse et l’évaluation)
 Méthode centrée système (garantie fonctionnelle) au detriment
des utilisateurs
Principe d’indépendance entre le noyau fonctionnel et l’interface
utilisateur
Dr. WALI Wafa 19
 Méthodes de conception du génie logiciel
Conception des IHMs

Limites des méthodes de GL

Evaluation tardive

Méthode de conception spécifique pour les IHM

Dr. WALI Wafa 20

 Méthode de conception d’IHM
Conception des IHMs

Pourquoi une méthode de conception IHM ?

Les IHM doivent être pensées dés le début (analyse) !
• Réduction des risques

• Réduction des côuts de dévelopment et de maintenance

• Réduction du budget et du temps pour la formation

• Gain de productivité côté utilisatrices

• Réutilisation et amélioration des composants de base

Dr. WALI Wafa 21
 Méthode de conception d’IHM
Conception des IHMs

Aperçu de la méthode de conception IHM

• Des concepts : utilisatrice, context, phases
• Des carctéristiques (inspirées des méthodes de conception GL) :
iterative, incrémentale, prototypée,
centrée utilisateur avec évaluation précoce
• Relation entre équipe de conception et
utilisatrices : basée du des personas
informative, participative
Dr. WALI Wafa 22
 Méthode de conception d’IHM
Conception des IHMs

Concepts : utilisatrice, tâche, contexte

• Utilisatrice : plusieurs profils, caractéristiques variées
• Tâche : objectif de l’utilistrice (e.g., rechercher un livre)
• Contexte : environement et contrainte d’utilisation
 Grand public (prise en main immédiate), loisirs (rendre le produit
atrrayant), industrie (augmenter la productivité) , systems critiques
(assurer un risqué zéro)
 Techinques (e.g., plate-forme, taille mémoire, écran,…)
Dr. WALI Wafa 23
 Méthode de conception d’IHM
Conception des IHMs

Concepts : phases
• Une méthode de conception IHM se découpe généralement en trois
phases:
1. Analyse : préciser les attentes et les besoins des utilisatrices,
connaître leurs tâches et le contexte
2. Conception : réaliser tout ou partie d’une interface
3. Évaluation : mesurer l’utilisabilité de l’interface réalisée, la
satisfaction pour réaliser les tâches avec cette interface, identifier
les points à améliorer pour la version suivante, etc.
Dr. WALI Wafa 24
 Méthode de conception d’IHM
Conception des IHMs

Carctéristiques de la conception IHM : iérative

• Méthodologie basée sur une succession de cycles composés des trois
phases (analyse, développement, évaluation) :
 Travail sur l’intégralité de l’interface
 Cycles répétés jusqu’à obtention d’une interface satisfaisante
 Prise en compte de nouveaux objectifs
 Prise en compte de l’avis des utilisatrices qui peuvent changer

Dr. WALI Wafa 25

 Méthode de conception d’IHM
Conception des IHMs

Carctéristiques de la conception IHM : incrémentale

• Méthodologie basée sur la réalisation d’une première partie, puis
d’une seconde, etc.
 Travail sur une seule zone de l’interface jusqu’à satisfaction
 Développement de solutions partielles, intermédiaires
 Prise en compte de nouveaux objectifs
 Prise en compte de l’avis des utilisatrices qui peuvent changer

Dr. WALI Wafa 26

 Méthode de conception d’IHM
Conception des IHMs

Carctéristiques de la conception IHM : itérative et

incrémentale

Dr. WALI Wafa 27

 Méthode de conception d’IHM
Conception des IHMs

Carctéristiques de la conception IHM : prototypée

• Obtenir une interface finale passe par plusieurs étapes :
Croquis (sketch) = aperçu global de l’interface (idée générale)
Maquette (mockup, wireframe) = interface détaillée (sans interaction)
Prototype = version incomplète d’une interface (avec
interactions)
• Lors de ces étapes, faire des choix :
de haut niveau (e.g., fonctionnalités disponibles)
de niveau intermédiaire (e.g., enchaînement des écrans)
de bas niveau (e.g., idées d’icônes)

Dr. WALI Wafa 28

 Méthode de conception d’IHM
Conception des IHMs

Carctéristiques de la conception IHM : prototypée

Croquis, maquette et prototype d’une page web

Dr. WALI Wafa 29
 Méthode de conception d’IHM
Conception des IHMs

Carctéristiques de la conception IHM : prototypée

Maquette, prototype et interface finale (gestionnaire de paquets

Ubuntu)
Dr. WALI Wafa 30
 Méthode de conception d’IHM
Conception des IHMs

Carctéristiques de la conception IHM : prototypée

• Outils d’aide au prototypage :
Papier, post-its
Transparents, vidéo (e.g., Libre Office Impress)
Logiciels de maquettage
haute fidélité, i.e., avec interactions (e.g., Invision, Maqetta)
basse fidélité, i.e., seulement des liens entre écrans (e.g.,
Mocking Bird, Pencil, Basalmiq)
 Logiciels de développement (e.g., frameworks web, Netbeans,
Visual Studio)
Dr. WALI Wafa 31
 Méthode de conception d’IHM
Conception des IHMs

Carctéristiques de la conception IHM : prototypée

• Avantages du prototypage :
 Travailler sur plusieurs ensembles de détails à la fois

 Se concentrer sur les parties problématiques de l’interface

 Étudier des alternatives de conception

 S’assurer de l’utilisabilité du système

 Visualiser ce que sera le système final (utilisatrices)

Dr. WALI Wafa 32

 Méthode de conception d’IHM
Conception des IHMs

Carctéristiques de la conception IHM : Centrée

utilisatrice
• Étude de l’utilisatrice et de sa tâche pour concevoir l’IHM :
 Prise en compte des utilisatrices dès l’analyse

 Difficulté à choisir des utilisatrices représentatives

 Ne pas oublier le contexte réel d’utilisation

• Trois modèles pour spécifier les caractéristiques :
 De l’utilisatrice

 De la tâche à réaliser

 De l’interaction
Dr. WALI Wafa 33
 Méthode de conception d’IHM
Conception des IHMs

Carctéristiques de la conception IHM : Centrée utilisatrice

• Modèle de l’utilisatrice : identifier les caractéristiques pertinentes de
l’utilisatrice
• Données générales
 taille, âge, genre, handicaps
 niveau de formation, habitudes culturelles (e.g., format des dates, sens
d’écriture)
 psychologiques (e.g., visuel/auditif, logique/intuitif,
analytique/synthétique)
• Données liées à l’application : compétences sur le domaine, compétences en
informatique et sur le système
 novice, expert, professionnel, usage occasionnel, quotidien
Dr. WALI Wafa 34
 Méthode de conception d’IHM
Conception des IHMs

Carctéristiques de la conception IHM : Centrée utilisatrice

Modèle de la tâche : identifier l’enchaînement des processus d’une
tâche
►Construire la hiérarchie de tâches du système
►Spécifier chaque tâche, penser aux exceptions
►Évaluer la décomposition avec l’utilisatrice
Dans ce modèle :
►Une tâche se compose de :
 but = ce qui doit être fait
 procédure = un ensemble de sous-tâches reliées par des
relations de composition ou des relations temporelles
►Une tâche élémentaire est une tâche décomposable
uniquement en actions physiques opérations d’E/S
Dr. WALI Wafa 35
 Méthode de conception d’IHM
Conception des IHMs

Carctéristiques de la conception IHM : Centrée utilisatrice

Modèle de tâche pour l’activité ”envoyer un sms”

Dr. WALI Wafa 36
 Méthode de conception d’IHM
Conception des IHMs

Carctéristiques de la conception IHM : Centrée utilisatrice

Modèle de l’interaction : établir une correspondance directe
entre :
►Les objets conceptuels manipulés (e.g., un fichier)
►La présentation et les interactions :
 les représentations de l’objet à l’écran (e.g., fichier
ouvert, corbeille vide)
 les opérations sur l’objet (e.g., ouverture, modification)
Cette correspondance doit :
►Apparaître comme intuitive, ”naturelle”
►S’inscrire dans une cohérence d’ensemble : la métaphore

Dr. WALI Wafa 37

 Méthode de conception d’IHM
Conception des IHMs

Carctéristiques de la conception IHM : Centrée utilisatrice

Modèle de l’interaction : la métaphore utilise des concepts connus
de l’utilisatrice
► Pour faciliter l’apprentissage

► Pour permettre à l’utilisatrice d’anticiper le comportement du

système
► Inspirés du monde réel :
 spatiales (bureau, maison, etc.)
 sociales ou techniques (imprimante, courrier, etc.)

Dr. WALI Wafa 38

 Méthode de conception d’IHM
Conception des IHMs

Carctéristiques de la conception IHM : Evaluation précoce

L’évaluation des croquis, maquettes, prototypes et interfaces est
fréquente et intervient très tôt dans la conception
L’évaluation repose généralement sur des scénarios. Un scénario
associe :
►Une utilisatrice (ou un groupe)
►Un contexte (environnement et contraintes)
►Une ou plusieurs tâches (que l’utilisatrice doit accomplir)

Exécution d’un scénario ⇒ idées et pistes d’améliorations pour

concevoir les interfaces

Dr. WALI Wafa 39

 Méthode de conception d’IHM
Conception des IHMs

Carctéristiques de la conception IHM : Evaluation précoce

La réussite ou l’échec de l’exécution d’un scénario sont évalués de
manière qualitative et quantitative selon plusieurs critères :
Taux de succès
Nombre d’erreurs
Temps d’exécution des tâches (e.g., modèles GOMS, KLM)
Nombre d’étapes nécessaires à la réussite du scénario
Rythme d’apprentissage
Satisfaction des utilisatrices
40
…

Dr. WALI Wafa 40

 Méthode de conception d’IHM
Conception des IHMs

Carctéristiques de la conception IHM : Evaluation précoce

Exemple de scénario :
►Utilisatrice = sans connaissance sur le site
Grooveshark
Contexte = un ordinateur standard équipé
de Firefox
Tâches = se connecter à Grooveshark,
chercher des musiques par titre et auteur,
les ajouter à la playlist et étendre cette playlist par l’ajout de musiques
dans le même genre musical
Dr. WALI Wafa 41
 Méthode de conception d’IHM
Conception des IHMs

Relation conceptrice- utilisatrice : personas

Un persona n’est pas une utilisatrice réelle, mais une
abstraction de plusieurs (i.e., traits caractéristiques les plus
fréquents)
 Meilleure compréhension des utilisatrices et de leurs
objectifs
 Vision partagée des utilisatrices
Persona :
 Des données générales (prénom, photo, devise, etc.)
 Des objectifs, contraintes, environnement de travail
 Ce qui va déclencher ses actions, Ce qui peut l’influencer
Dr. WALI Wafa 42
 Méthode de conception d’IHM
Conception des IHMs

Relation conceptrice- utilisatrice : personas

Exemples de personas
Dr. WALI Wafa 43
 Méthode de conception d’IHM
Conception des IHMs

Relation conceptrice- utilisatrice : personas

Exemples de personas
Dr. WALI Wafa 44
 Méthode de conception d’IHM
Conception des IHMs

Relation conceptrice- utilisatrice : personas

Empathie cognitive
Particulièrement adaptée au web (passage à l’échelle)

Distance par rapport aux utilisatrices réelles

Besoin de modifier les personas en cas de nouveaux
résultats ou de contexte différent
Mauvaise définition des personas ⇒ échec

Dr. WALI Wafa 45

 Méthode de conception d’IHM
Conception des IHMs

Relation conceptrice- utilisatrice : utilisatrices

l réelles

Dans une relation informative ou participative, les utilisatrices

n’interviennent pas que pour tester :
 Observées dans la résolution des tâches (analyse)

 Interrogées sur leurs attentes (développement)

 Questionnées sur les interfaces (évaluation)

Dr. WALI Wafa 46

 Méthode de conception d’IHM
Conception des IHMs

Relation conceptrice- utilisatrice : utilisatrices

l réelles

 Seules les utilisatrices connaissent la réalité des tâches

(crucial pour les tâches mal identifiées, et source
d’innovations)
 Facilite l’acceptation du logiciel

 Augmentation des coûts de développement

 Contradictions possibles entre les utilisatrices
participant-e-s et les autres
Dr. WALI Wafa 47
 Méthode de conception d’IHM
Conception des IHMs

Relation conceptrice- utilisatrice : informative

l
L’utilisatrice est intégrée dans l’équipe de conception, mais
ne participe pas aux choix finaux (imaginée pour la
conception avec des enfants)

Dr. WALI Wafa 48

 Méthode de conception d’IHM
Conception des IHMs

Relation conceptrice- utilisatrice : participative

l
L’utilisatrice est intégrée dans l’équipe de conception
comme partenaire de conception à part entière, et
participe donc aux choix de conception finaux
Obligation d’accepter des compromis pour satisfaire
des participantes, même si elles ont tort

Une interface utilisateur, c’est comme une blague. Si vous

devez l’expliquer, c’est qu’elle n’est pas si bonne
.

Dr. WALI Wafa 49

 Méthode de conception d’IHM
Conception des IHMs

En résumé:
 Méthode
l de conception itérative,
incrémentale, prototypée, centrée
utilisatrice et prise en compte
précoce de l’évaluation
 Relation forte entre équipe de
conception et utilisatrice
Une méthode de conception IHM nécessite de collecter des informations
sur les utilisatrices, leurs tâches ou sur les évaluations des interfaces
⇒ techniques de recueil d’informations

Dr. WALI Wafa 50

 Techniques de recueil d’informations
Conception des IHMs

Les techniques de recueil d’informations sont utilisées lors de la

méthode de conception IHM pour récolter des informations :
Sur les utilisatrices (e.g., pour construire des personas)
Sur les tâches (e.g., enchaînement des actions, vocabulaire
l métier)
Sur les interfaces (e.g., idées, points forts/faibles)

Choisir une technique adaptée selon le contexte, les

utilisatrices et la phase active (analyse, développement ou
évaluation)

Dr. WALI Wafa 51

 Techniques de recueil d’informations
Conception des IHMs

Observation, Entretien, Questionnaire

Focus Group (Entretien par Équipe)
Brainstorming
Tri par Cartes
Conception en Parallèle
Magicien D’oz

Dr. WALI Wafa 52

 Techniques de recueil d’informations
Conception des IHMs

Techniques de recueil d’information auprès des utilisateurs

•pour la conception : comprendre le marché, la tâche, les utilisateurs
Principe
•définir une tâche et demander aux utilisateurs de l’effectuer
•observer les utilisateurs pendant la réalisation de la tâche
interroger les utilisateurs
•entretien individuels, questions semi-directives, reformuler les réponses pour
clarifier
•analyse qualitative des réponses, pas de conclusions statistiques
•questionnaire (également pour demander un avis sur un projet)
•panel représentatif d’utilisateurs
•diffusion/récupération papier, en ligne
•analyse quantitative (automatique) + qualitative (manuelle), résultats chiffrés
Dr. WALI Wafa 53
 Techniques de recueil d’informations
Conception des IHMs

Observation, Entretien, Questionnaire

Focus Group (Entretien par Équipe)
Brainstorming
Tri par Cartes
Conception en Parallèle
Magicien D’oz

Dr. WALI Wafa 54

 Observations
Conception des IHMs

Procédure
en laboratoire ou sur le terrain
choisir au moins 2 utilisateurs qui agiront indépendamment
décider de ce que l'on veut mesurer
définir une mission spécifique: résoudre un problème, dérouler un
scénario…
Demander aux utilisateurs d'effectuer la tâche
observation directe simple
avec explication à haute voix (méthode intrusive)
à deux pour observer leurs interactions (interrogations, explications)
Enregistrer les interactions, puis les analyser

Dr. WALI Wafa 55

 Entretiens critiques
Conception des IHMs

Objectif :
Identifier des exemples de problèmes rencontrés concrètement par
les utilisateurs dans la situation actuelle
Procédure :
•interviewer l'utilisateur dans son environnement de travail
•lui demander de se souvenir d'un problème particulier vécu dans un
passé récent
•lui demander de décrire chaque incident en détail
•lui demander ce qui est habituel et ce qui ne l'est pas dans l'incident

Dr. WALI Wafa 56

 Focus Group (entretien collectif)
Conception des IHMs

Objectif:
Comprendre le marché, la tâche, les utilisateurs
Moyen
•Réunir des utilisateurs (4-7, max. 10) représentatifs du public-cible
•Post-it, tableaux, papier, crayon
•Animateur + séance observée/filmée
Procédure
•Commencer par une activité brise-glace
•Echanges dirigés informels sur le sujet étudié, via des activités
support
•Synthèse des idées exprimées
Dr. WALI Wafa 57
 Pourquoi avoir intervewé?
Conception des IHMs

Pour collecter des informations plus détaillées sur :

ACTUELS/FUTURS
Dispositif But d’assistance Fonctionnalités Éléments d’IHM

ACTUELS/FUTURS

Utilisateur Buts Tâches/Activités Scénarios

Dr. WALI Wafa 58

 Pourquoi avoir intervewé?
Conception des IHMs

Dr. WALI Wafa 59

 Modèle utilisateur: personas/but
Conception des IHMs

PERSONA(S)

Déterminer la
capacité
physique

Dr. WALI Wafa 60

 Modèle utilisateur: personas/but
Conception des IHMs

Les persona (s) et sa capacité en ergonomie

On ne doit pas dépasser 3, 4 personas pour que les résultats soient
réellement utiles
Exemple: application iPhone pour suivi de la bourse
• Bernard: le broker branché (gère les compte de trading, ordres d'entrée et
de sortie)
• Catherine: l’occasionnelle multitâche (service communication, informatique)

• Hugo: le touche-à-tout (des activités multiples)

Dr. WALI Wafa 61

 Modèle utilisateur: personas/but
Conception des IHMs
Du persona et sa capacité à la conception des IHM
Exemple: projet réseau social dans le domaine des achats
• Peut supporter une charge
informationnelle importante
• Exigent quant à l’efficacité du
moteur de recherche
• Peu intéressé au design
Responsable informatique
• Peu fidèle

• Vite perdue dans les sites trop «

chargés »
• Attirée par nouveautés, idées
cadeau
Assistante de gestion • Très intéressée au design
• Assez fidèle

Dr. WALI Wafa 62

 Modèle utilisateur: personas/but
Conception des IHMs
Persona tableau de correspondance

Dr. WALI Wafa 63

 Modèle utilisateur: personas/but
Conception des IHMs
Exemple: Application future de réalité augmentée, dispositif de réalité
augmentée pour archéologues effectuant des fouilles de terrain

Dr. WALI Wafa 64

 Modèle utilisateur: personas/but
Conception des IHMs
Exemple: Application future de réalité augmentée, dispositif de réalité
augmentée pour archéologues effectuant des fouilles de terrain
Buts de vie (Life goals) Ne servent qu’occasionnellement à la conception d’un
dispositif
« Découvrir le plus ancien ancêtre de l’homme »
Buts d’expérience Expriment ce que souhaiterait ressentir un persona
(Experience goals) lorsqu’il utilise un dispositif
« Voir disparaître la crainte de détériorer un vestige en le
manipulant »
Buts cibles (End goals) Décrivent ce qu’un persona souhaite obtenir d’un dispositif
•Buts relatifs au produit issu de l’usage du dispositif
« Obtenir une description du vestige plus fine grâce à la
possibilité de le manipuler (virtuellement) plus
longtemps et plus souvent »
•Buts relatifs aux bénéfices indirects de l’usage du
dispositif
« Eviter la détérioration des vestiges due à leur
manipulation physique »

Dr. WALI Wafa 65

 Modèle utilisateur: personas/but
Conception des IHMs
PERSONA DE GROUPE (EXEMPLE)
Exemple: Dispositif mobile futur pour des visiteurs d’un parc d’attraction

Dr. WALI Wafa 66

 Modèle utilisateur: personas/but
Conception des IHMs
Modèle de situation : scénarios
Exemple: Scénario des archéologues (application : « terrain augmenté »)

Dr. WALI Wafa 67

 Modèle utilisateur: personas/but
Conception des IHMs
Modèle de situation : scénarios
1) Structure d’un scénario individuel (exemple)
Contexte: Contexte de travail (Lieu et Acteur)
But: but particulier pour suivi
Action: récit a la première personne des actions entreprises pour atteindre le
but donné dans le contexte donné (avec un dispositif donné)

Dr. WALI Wafa 68

 Modèle utilisateur: personas/but
Conception des IHMs
Modèle de situation : scénarios individuelles
SCÉNARIO ACTUEL
 Contexte :
Je m’appelle Mary. Je suis doctorante en Pédagogie et Programme des études. J’enseigne à plein
temps dans le Programme d’Education alternative de la ville de Paris.
But :
Mon but est de trouver une méthode alternative d’évaluation des étudiants. Pour sortir du système
traditionnel de notation par lettre.
Action:
• Grâce à un outil de recherche de sites Web, je trouve un lien sur la page d ’accueil du site Web de
l’université.
• A partir de cette page, j’observe les liens vers la page d’accueil du College of Education.
• Je parcours la page à la recherche d’une référence sur les cours de Pédagogie et Programme des
études. Sur la page d’accueil de « Pédagogie et Programme des études », je trouve un lien vers
des Stratégies pédagogiques et une liste de liens tels que Critères d ’évaluation des étudiants et
Méthodes d’évaluation des compétences des étudiants.
• Je clique sur « Méthodes d’évaluation des compétences des étudiants ». La nouvelle page
commence par une explication indiquant que l’on peut cliquer sur des mots-clés pour lancer une
recherche sur les documents parlant d’évaluation des étudiants.
• Je parcours les documents et trouve des informations pratiques que je peux télécharger sur mon
ordinateur
Dr. WALI Wafa 69
 Modèle utilisateur: personas/but
Conception des IHMs
Modèle de situation : scénarios individuelles
SCÉNARIO FUTUR
Contexte :
Je m’appelle Mary. Je suis doctorante en Pédagogie et Programme des études. J’enseigne à plein temps
dans le Programme d’Education alternative de la ville de Paris.
But :
Mon but est de trouver une méthode alternative d’évaluation des étudiants. Pour sortir du système
traditionnel de notation par lettre.
Action:
• Grâce à un outil de recherche de sites Web, je trouve un lien sur la page d ’accueil du site Web de
l’université.
• A partir de cette page, j’observe les liens vers la page d’accueil du College of Education.
• Je parcours la page à la recherche d’une référence sur les cours de Pédagogie et Programme des
études. Sur la page d’accueil de « Pédagogie et Programme des études », je trouve un lien vers des
Stratégies pédagogiques et une liste de liens tels que Critères d ’évaluation des étudiants et Méthodes
d’évaluation des compétences des étudiants.
• Je clique sur « Méthodes d’évaluation des compétences des étudiants ». La nouvelle page
commence par une explication indiquant que l’on peut cliquer sur des mots-clés pour lancer une
recherche sur les documents parlant d’évaluation des étudiants.
• Je parcours les documents et trouve des informations pratiques que je peux télécharger sur mon
ordinateur
Dr. WALI Wafa 70
 Modèle utilisateur: personas/but
Conception des IHMs

Modèle de situation : scénarios Collectif

Structure d’un scénario collectif (exemple)

Cadre
Agents/Acteurs
Buts/Objectifs
Séquences d’actions et d’événements

Dr. WALI Wafa 71

 Modèle utilisateur: personas/but
Conception des IHMs
Modèle de situation : scénarios Collectif
Exemple: COLLABORATION USABILITY ANALYSIS (CUA)
Scénario « Discuter du patient et du document d’évaluation »
Description de l’activité : une infirmière reçoit un plan de soins et un document d'évaluation d'un
gestionnaire de cas-référent. L'infirmière examine l'évaluation et veut recueillir plus des informations avant de
visiter le malade. Elle tente alors de localiser le gestionnaire de cas dans le bureau. Lorsque l'infirmière
trouve le gestionnaire de cas, elle s'approche de lui et lui demande plus d'informations sur le patient.
L'infirmière pose le document d'évaluation sur le bureau et indique les aspects de l'évaluation où elle a des
questions. Le gestionnaire de cas et l’infirmière discutent de la situation du patient.
Spécification de l’utilisateur :
• les gestionnaires de cas: sont chargés de coordonner les soins aux patients en milieu communautaire.
• les infirmières: sont chargées de fournir une large gamme de services de soins infirmiers dans la
communauté. Elles n'utilisent pas actuellement l’ordinateur dans leur travail.
Résultat attendu : échanger des informations concernant le patient. L’infirmière, en particulier, souhaite
obtenir plus d'informations sur les patient avant de les visiter pour la première fois.
Circonstances : les infirmières et les gestionnaires de cas ont un espace de bureau dans le même bâtiment et
tentent généralement de se rencontrer au cours de la journée.

Dr. WALI Wafa 72

 Modèle utilisateur: personas/but
Conception des IHMs
Modèle de tâche

Modèle de tâche représenté à l’aide d’un formalisme type:

•HTA (Hierarchical Task Analysis)
•UAN (User Action Notation)
•CTT (Concur Task Trees)

Dr. WALI Wafa 73

 Modèle utilisateur: personas/but
Conception des IHMs

Modèle de tâche
Définitions
Les modèles de tâches sont des descriptions logiques des
activités à réaliser pour atteindre les objectifs des utilisateurs. Ils se
sont révélés utiles pour concevoir, analyser et évaluer les
applications logicielles interactives.
Les modèles de tâches décrivent comment les activités peuvent
être réalisées pour atteindre les objectifs des utilisateurs lors de
l’interaction avec l’application considérée.

Dr. WALI Wafa 74

 Modèle utilisateur: personas/but
Conception des IHMs

Modèle de tâche
Définitions
Les modèles de tâches sont des descriptions logiques des
activités à réaliser pour atteindre les objectifs des utilisateurs. Ils se
sont révélés utiles pour concevoir, analyser et évaluer les
applications logicielles interactives.
Les modèles de tâches décrivent comment les activités peuvent
être réalisées pour atteindre les objectifs des utilisateurs lors de
l’interaction avec l’application considérée.

Dr. WALI Wafa 75

 Modèle utilisateur: personas/but
Conception des IHMs

Modèle de tâche

COMPOSANTES D’UNE TÂCHE

Buts: objectif/Etat à atteindre (ex. : produire une lettre)
Dispositifs: Méthodes, outils ou techniques pour atteindre les buts
Tâches: Activités nécessaires pour atteindre les buts à l’aide des
dispositifs
Sous-tâches: Composantes des tâches
Actions: Tâches simples, qui n’ont pas de structure de contrôle

Dr. WALI Wafa 76

 Modèle utilisateur: personas/but
Conception des IHMs

Modèle de tâche

Dr. WALI Wafa 77

 Modèle utilisateur: personas/but
Conception des IHMs

Modèle de tâche
HTA : Hierarchical Task Analysis
MAD: Méthode Analytique de Description

Les Tâches

alternative alternative non stricte séquence Suite non ordonnée boucle

Dr. WALI Wafa 78

 Modèle utilisateur: personas/but
Conception des IHMs

Modèle de tâche
Relation séquentielle entre tâches (ou séquence) :
o Les sous-tâches sont exécutées [strictement] en séquence, c'est-à-dire, l'une
après l'autre dans un ordre donné (A-B-C…)

Dr. WALI Wafa 79

 Modèle utilisateur: personas/but
Conception des IHMs

Modèle de tâche
Relation alternative entre tâches :
o Structure permettant d'indiquer qu’une tâche peut s'exécuter de plusieurs
manières (ou sous-tâches) [dans le cas de l’alternative non stricte].

o Une seule des manières (sous-tâches) est exécutée [dans le cas de

l’alternative stricte].

Dr. WALI Wafa 80

 Modèle utilisateur: personas/but
Conception des IHMs

Modèle de tâche

Dr. WALI Wafa 81

 Modèle utilisateur: personas/but
Conception des IHMs

Modèle de tâche
Relation parallèle entre tâches (ou suite non ordonnée):

o La parallèle exprime que l'ordre des sous-tâches n'est pas contraint à priori
et qu'il peut exister des tâches d'interruption.

o Une tâche parallèle se termine quand toutes les sous-tâches non

facultatives ont été exécutées.

o Une sous-tâche et une seule est exécutée à un moment donnée.

o Celle-ci peut être interrompue par une tâche d'interruption mais dans ce cas,
elle est suspendue et c'est la tâche d'interruption qui devient active.

Dr. WALI Wafa 82

 Modèle utilisateur: personas/but
Conception des IHMs

Modèle de tâche

Dr. WALI Wafa 83

 Modèle utilisateur: personas/but
Conception des IHMs

Modèle de tâche
Relation simultanée entre tâches :

Très proche de la structure parallèle, la structure simultanée implique plusieurs

opérateurs.

Le fonctionnement est le même que celui de la parallèle à la différence que

plusieurs tâches peuvent s'exécuter en même temps.

Une tâche simultanée se termine quand toutes les sous-tâches non facultatives ont
été exécutées au moins une fois ou bien quand les postconditions de fin de tâche
sont vérifiées.

La relation simultanée n’est utilisable que lors des activités multi-opérateurs

Dr. WALI Wafa 84

 Modèle utilisateur: personas/but
Conception des IHMs

Modèle de tâche
Relation simultanée entre tâches : exemple des crêpes

Les courses pour les crêpes sont faites par 2 personnes, par exemple : la
grand- mère (GM) et son petit-fils (PF). On ne sait pas à priori qui va mettre dans
le caddie le sel ou le [lait]. Les courses seront achevées (post-conditions) lorsque
toute la liste des courses sera complétée

Dr. WALI Wafa 85

 Modèle utilisateur: personas/but
Conception des IHMs

Modèle de tâche
Relation itérative entre tâches (ou boucle) :
La relation itérative s’effectue tant que la tâche n’est pas achevée.

Dr. WALI Wafa 86

 Modèle utilisateur: personas/but
Conception des IHMs

Modèle de tâche

Dr. WALI Wafa 87

 Analyse de la tâche pour structurer l’IHM
Conception des IHMs
Les étapes nécessaires:

1. Etape 1: analyser le besoin des utilisateurs, c’est à dire identifier ce que les
utilisateurs veulent faire avec le logiciel, on procède en deux étapes :

 Des interviews permettent d’identifier la tâche prévue : ce qui doit être fait.

Cette première analyse est consolidée par l’observation des utilisateurs sur leur
lieu de travail afin de comprendre l’activité effectivement réalisée
Résultats :
• Ces résultats sont consignés sous la forme d’un graphe appelé modèle de tâche.
• Le modèle de tâche permet de formaliser les buts de l’utilisateur, la manière dont il atteint
ces buts et les informations qui lui sont nécessaires
• Il sert également à identifier la façon dont l’utilisateur traite les cas exceptionnels, voire
les urgences.

Dr. WALI Wafa 88

 Analyse de la tâche pour structurer l’IHM
Conception des IHMs
Les étapes nécessaires:
2. Etape 2: déterminer les tâches utilisateur
 La tâche est l’objectif que cherche à atteindre l’utilisateur : le résultat qu’il souhaite obtenir.
 Par exemple, lorsque je me sers d’un logiciel de traitement de texte, ma tâche consiste à
communiquer en rédigeant un document.
 Afin de réaliser une tâche, l’être humain la décompose en problèmes simples. Il décline le
but principal en sous-buts, puis en actions élémentaires, de façon hiérarchique.
Dans le cadre du développement logiciel, l’analyse de la tâche permet de structurer l’interface
homme-machine :
•Le découpage en fenêtres découle directement de l’architecture de la tâche et de la façon
dont l’utilisateur mène les différentes sous-tâches.
 Par exemple, si l’utilisateur réalise les tâches en parallèle, les fenêtres correspondantes
pourront apparaître simultanément.
•La connaissance des informations nécessaires à la réalisation de chaque tâche fournit le
contenu de chaque fenêtre.

Dr. WALI Wafa 89

 Analyse de la tâche pour structurer l’IHM
Conception des IHMs
.

Dr. WALI Wafa 90

 Analyse de la tâche pour structurer l’IHM
Conception des IHMs
.

Dr. WALI Wafa 91

 Modèle du dispositif
Conception des IHMs
.

Exemple Dispositif: Logiciel d'e-recrutement

FONCTIONNALITÉS:
• Personnalisation et intégration graphique complète
• Paramétrage de l’affichage des annonces
• Moteur de recherche multi critères des offres avec tri des résultats
• Candidature en ligne, spontanée ou en réponse à une offre
• Espace candidat personnel de suivi de ses candidatures

Module Candidat Module Administarteur Module Recruteur

Dr. WALI Wafa 92

 Techniques de recueil d’information pour IHM
Conception des IHMs
.

Observation, Entretien, Questionnaire

Focus Group (Entretien par Équipe)
Brainstorming
Tri par Cartes
Conception en Parallèle
Magicien D’oz

Dr. WALI Wafa 93

 Techniques de recueil d’information pour IHM
Conception des IHMs
Objectif: générer un grand nombre d'idées créatives pour résoudre un problème

Moyen: les participants (équipe de conception) imaginent des solutions

Procédure:

• réunir un petit groupe avec différents rôles et expertises

• limiter le temps (1h)

• décrire un problème de conception spécifique

Dr. WALI Wafa 94

 Techniques de recueil d’information pour IHM
Conception des IHMs
Procédure :
phase 1 : générer une grande quantités d'idées, et faire participer tout le monde,
enregistrer toutes les idées sans les évaluer
(Exemple: Post-its, logiciel Lucidspark)
phase 2 : classer les idées en fonction de leur qualité, chacun annonce les idées
qu'il préfère
•les idées sont classées par nombre de votes
•commencer la conception à partir des idées les mieux classées
•ne pas oublier les idées insolites (anormales)
Tâche. Énoncer une idée Tâche. Discuter une idée
Pre: une idée a été
énoncée Tâche. Grouper les idées
Pre: > 1 idée a été enregistrée

Dr. WALI Wafa 95

 Techniques de recueil d’information pour IHM
Conception des IHMs

Dr. WALI Wafa 96

 Techniques de recueil d’information pour IHM
Conception des IHMs

Tri de cartes
Objectif:
• Cette méthode permet de comprendre comment l’individu organisent mentalement
les informations
• Travailler sur l’organisation des fonctionnalités de l’application
• Déterminer l’architecture de l’information
• Organiser l’information
Moyen
• réunir des utilisateurs représentatifs du public-cible
• représenter chaque fonctionnalité par une carte
Procédure
• 1 carte = 1 fonctionnalité de l’application ou 1
information
• les utilisateurs regroupent les cartes qui vont ensemble
• puis nomment les groupes (menus)

Dr. WALI Wafa 97

 Techniques de recueil d’information pour IHM
Conception des IHMs

Procédure :
[Link] des mots-clés sur les cartes (besoin fonctionnelle)
[Link] des cartes ”qui se ressemblent”
[Link] d’un nom pour chaque groupe construit
[Link] des résultats :
• Statistique (groupes les plus fréquemment formés)
• Qualitative, basée sur les observations lors des séances

Convergence rapide vers une organisation pertinente du contenu

Dr. WALI Wafa 98

 Techniques de recueil d’information pour IHM
Conception des IHMs

Dr. WALI Wafa 99

 Techniques de recueil d’information pour IHM
Conception des IHMs

Dr. WALI Wafa 100

 Techniques de recueil d’information pour IHM
Conception des IHMs

Conception en parallèle
Objectif
• travailler sur les écrans 1
• avoir des idées de conception, repérer les points forts
Moyen
• réunir des utilisateurs représentatifs du public-cible
• leur faire créer des interfaces répondant au besoin
Procédure
• chaque utilisateur (ou binôme…) dessine/crée une interface
2
• comparaison des interfaces, discussion
• les meilleures idées sont conservées

Dr. WALI Wafa 101

 Techniques de recueil d’information pour IHM
Conception des IHMs

Magicien d’OZ
Objectif
•simuler les fonctionnalités absentes d’un système 102
•système ou fonctionnalité inexistants
•technique difficile à mettre en place
•adapté à des systèmes lourds, difficiles à développer
Principe: un "magicien" invisible pour l’utilisateur, effectue les actions à la place du
système
Procédure
•l'utilisateur a l’impression d'utiliser un vrai système
•le "magicien" interprète et traite les actions/entrées de l'utilisateur
•il supplée aux manques et contrôle le comportement du système
•Exemple: Brain-Computer Interface (voir video)

Dr. WALI Wafa

 Techniques de recueil d’information pour IHM
Conception des IHMs

Magicien d’OZ
Procédure :
La magicienne (exemple: capteur) interprète les entrées de l’utilisateur
Elle supplée aux manques du prototype et contrôle le comportement du
système

Exemple : un système pour réserver un billet de train en langage naturel

Expérimentations réelles en 1984 avec ”magicien d’Oz”

Face à la machine, les utilisatrices ont adopté un langage haché pour la
simplification du modèle pour le langage naturel pour aider les utilisateurs qui
ont un trouble de la parole résultant d'un dysfonctionnement neurologique, qui
affecte la communication verbale

Dr. WALI Wafa 103

 Exercice
Conception des IHMs

Sujet : conception d’une application de reconnaissance de déchets pour le tri

sélectif
Les objectifs globaux sont:
La protection de l’environnement
L’amélioration de la qualité de vie du citoyen ;
La réduction des effets des changements climatiques.
Récupérer les matières pour la réutilisation, valoriser et recycler de façon à
réduire les quantités de déchets

Dr. WALI Wafa 104

 Exercice
Conception des IHMs

Dr. WALI Wafa 105

 Exercice
Conception des IHMs

Dr. WALI Wafa 106