IUT- Département d’Informatique G. Rey

2016

Département Informatique - IUT Nice-Côte d'Azur

Université Nice – Sophia Antipolis

41, Bd Napoléon III, 06206 Nice Cedex 3

Tél : +33 (0) 4 97 25 82 11– Fax : +33 (0) 4 97 25 83 31 1

Introduction à l’IHM – M2105

TD n° 1

1 Objectifs Ce TD/TP illustre la partie du cours sur la programmation des interfaces homme-machine. Les concepts principaux

abordés seront :

Modèle de tâches

Approche par scénario

Un compte rendu donnant la réponse à chacune des questions posées devra être rendu à votre responsable de TD/TP par

email à la fin de chacune des séances. L’objet (sujet) de l’email devra être le suivant :

[S2T][IHM][Gx][TDx]Nom-Prénom / Nom-Prénom

Avec Gx le numéro de votre groupe (exemple G1 pour le groupe 1) et TDx le numéro du TD/TP inscrit sur le sujet du

TD/TP (exemple TD1 pour le premier TD).

Vous ne pouvez pas faire 2 séances avec le même binôme. De même, vous ne pouvez pas faire plus de la moitié des séances

seul.

Veuillez, sauf indication contraire de votre responsable de TD, faire l’ensemble des exercices marqués « Obligatoire »

dans l’ordre de la feuille de TD/TP. Les exercices « Conseillés » sont à faire si vous avez terminé les précédents ou lors de

vos révisions. Les exercices « optionnels » sont là pour les plus passionnés d’entre vous.

2 Exercice 1 : Modèle de tâches et notation HTA (obligatoire) Comme nous l’avons vu en cours, le but de l'analyse des tâches est de mettre en évidence et de décrire les tâches à effectuer

pour accomplir un travail. Une analyse très fine des tâches peut également servir à prédire ou à expliquer les performances

d'un utilisateur dans un environnement donné [Wikipédia].

La méthode d’analyse et de représentation (HTA), vue en cours, consiste en une décomposition hiérarchique d’une tâche

en un ensemble de sous-tâches. Un ensemble d’opérateurs et d’annotations permettent de définir l’enchainement

(relations d'ordonnancement temporel) entre les sous-tâches d’une même tâche.

Pour rappel, la notation graphique se fait à l’aide d’un rectangle décrivant (ou simplement nommant) la tâche. Un

opérateur (boucle) peut s’appliquer sur une tâche pour indiquer une répétition (n’oubliez pas de spécifier la condition de

répétition ou d’arrêt). Quatre autres opérateurs permettent de décomposer celle-ci en sous-tâches :

Séquentielle : Suite de sous-tâches ordonnées.

Alternative : Choix entre plusieurs sous-tâches.

Alternative non stricte : Choix entre plusieurs sous-tâches mais plusieurs choix sont possibles.

Non ordonnée : Ensemble de sous-tâches à réaliser sans notion d’ordre. On notera qu’aucune notation n’est spécifiée pour indiquer les nuances suivantes (on pourra utiliser une annotation pour

spécifier cela) :

Parallélisme : plusieurs sous-tâches peuvent s’exécuter en même temps.

Simultanéité : plusieurs sous-tâches doivent s’exécuter en même temps.

Entrelacement : plusieurs sous-tâches peuvent s’exécuter en même temps mais en réalité cela se décompose en

une alternance entre les sous-tâches et une seule sous-tâche est réellement exécutée à un instant donné.

Enfin, une liaison en pointillé indique le fait qu’une sous-tâche est optionnelle.

Il existe plusieurs outils permettant la modélisation en tâches (CTT, K-MADe, AMBOSS, TaskArchitect, …). Pour notre

part, nous allons simplement utiliser Word, PowerPoint, ou mieux Visio (ou tous logiciels équivalent capable de faire des

boites, et des flèches) de manière à ne pas perdre de temps avec l’apprentissage de logiciels spécialisés. N’utilisant pas les

IUT- Département d’Informatique G. Rey

2016

Département Informatique - IUT Nice-Côte d'Azur

Université Nice – Sophia Antipolis

41, Bd Napoléon III, 06206 Nice Cedex 3

Tél : +33 (0) 4 97 25 82 11– Fax : +33 (0) 4 97 25 83 31 2

Introduction à l’IHM – M2105

TD n° 1

fonctionnalités avancées de ceux-ci (du fait qu’on reste à un niveau basic de description de la tâche), ceux-ci ne nous

apportent pas une réelle plus-value.

2.1 Révisions Voici une décomposition en tâche (que vous avez déjà vue lors des petits contrôles de cours). Répondez aux questions

suivantes. Vous expliquerez, de manière détaillée, chacune de vos réponses.

Quelle est la tâche décrite par ce diagramme ?

En combien de sous-tâche (de niveau 1) se décompose la tâche précédente ?

Combien y-a-t-il de sous-tâches (au total) pour cette tâche ?

Combien y-a-t-il de sous-tâches élémentaires/terminales (au total) pour cette tâche ?

Combien de sous-tâches élémentaires doit-on au minimum effectuer pour réaliser cette tâche ? et au maximum ?

3 Exercice 2 : Modèle de tâches et notation HTA (obligatoire) A partir des propositions faites par les étudiants du groupe pour l’exercice de cours n°2,

Comparez les solutions

Proposez une solution de remplacement qui corrigerait les éventuels problème et complèterait les manques identifiés

Si aucun étudiant n’a proposez de solution pour l’exercice 2,

Chaque étudiant doit faire une proposition pour la tâche « Retirer de l’argent au distributeur de billets »

Puis

Comparez les solutions

Proposez une solution de remplacement qui corrigerait les éventuels problème et complèterait les manques identifiés

Pour vous aider dans l’analyse de vos arbres de tâches, reportez-vous à la grille de notation donnée en fin de document.

IUT- Département d’Informatique G. Rey

2016

Département Informatique - IUT Nice-Côte d'Azur

Université Nice – Sophia Antipolis

41, Bd Napoléon III, 06206 Nice Cedex 3

Tél : +33 (0) 4 97 25 82 11– Fax : +33 (0) 4 97 25 83 31 3

Introduction à l’IHM – M2105

TD n° 1

4 Exercice 3 : Modèle de tâches et notation HTA (obligatoire) Jusqu’à maintenant nous avons beaucoup modéliser des tâches humaines mais sans trop nous attardez sur la partie

logicielle. Or si on modélise des tâches, c’est surtout pour nous aider dans la conception de nos applications logicielles.

Nous allons donc maintenant nous intéresser aux cas des applications logicielles.

Concevez l’arbre de tâches pour une messagerie électronique pour ordinateur type Thunderbird ou Outlook. Pour

simplifier un peu, on fera l’hypothèse que nos messageries ne gèrent que les emails (pas les autres types de messages

comme les flux rss, …)

On va considérer qu’il existe 4 types de tâches :

Tâche humaine (H) : une tâche effectuée par l’homme sans interaction avec le système. Elle peut être

élémentaire ou décomposée en tâche humaine.

Tâche système (S) : une tâche effectuée par le système sans interaction avec l’homme. Elle peut être élémentaire

ou décomposée en tâche système.

Tâche d’interaction (I) : l’utilisateur fait une action sur le système (donne une information, …) ou le système

transmet une information (ou alerte) l’utilisateur. Elle peut être élémentaire ou décomposée en tâche

d’interaction.

Tâche hybride/mixte (M) : tâche non élémentaire ayant des sous-tâches de différents types.

Décorez votre arbre de tâches avec ses différentes informations.

Que pouvez-vous dire sur ces différentes tâches ?

Jusqu’à maintenant on a fait l’hypothèse que notre messagerie était une application « lourde » pour ordinateur.

Est-ce que vous pensez que l’arbre de tâches sera différent pour une application « légère » (type messagerie en

ligne) ? (Argumentez précisément votre réponse)

Et pour une messagerie pour téléphone mobile ? (Argumentez précisément votre réponse)

5 Exercice 4 : Projet fil rouge (obligatoire) Dans la suite de nos TDs nous allons construire une application en partant de l’analyse des

besoins et en allant jusqu’à la réalisation de cette application.

Pour cette année, le choix de l’application est un jeu de tic-tac-toe. Le Tic-tac-toe est un jeu

de réflexion se pratiquant à deux joueurs au tour par tour et dont le but est de créer le

premier un alignement. [Wikipédia]

Sauf indication contraire, les exercices « fil rouge » (identifiés par le logo et uniquement

ceux-ci), pourront être fait par des groupes allant jusqu’à 5 personnes (mais pas plus). De plus

ces groupes pourront être les même à chaque séance.

5.1 Définition des besoins et scénario Nous avons vu lors du cours que l’approche par scénario est un outil d'analyse de situations complexes qui permet

l’examen des interactions entre acteurs, leur équipement, l’environnement lors de la réalisation des objectifs de ces

premiers. L’important de cette approche est d’améliorer la compréhension des problèmes. Attention, cette approche est

en rupture avec l’approche classique de l’ingénierie logicielle mais tend à se développer de plus en plus en entreprise.

On a vu que les scénarios peuvent prendre plusieurs formes (storyboard, …). Nous allons lors de ce TD/TP nous

concentrer sur la description narrative. C’est à dire ce que font les utilisateurs lors de la réalisation d’une tâche.

IUT- Département d’Informatique G. Rey

2016

Département Informatique - IUT Nice-Côte d'Azur

Université Nice – Sophia Antipolis

41, Bd Napoléon III, 06206 Nice Cedex 3

Tél : +33 (0) 4 97 25 82 11– Fax : +33 (0) 4 97 25 83 31 4

Introduction à l’IHM – M2105

TD n° 1

L’objectif de cette approche est de mettre en place un nouveau mode d’organisation des données lors de la phase

d’analyse des besoins de manière :

à fournir un support commun de communication entre utilisateurs et concepteurs

à constituer une aide lors du développement

à fournir des descriptions détaillées de contextes d’utilisation

à fournir une base pour imaginer ce que sera le futur système

à fournir des matériaux pour la constitution de la documentation utilisateur

Il ne s’agit donc pas de simplement rédiger une histoire, mais bien de segmenter celle-ci en étapes (on pourra parler de

situations) qui viendront illustrer des tâches-clés du futur système. Pour chacune de ces situation/étapes, il sera

nécessaire d’identifier les 5 points suivants :

1. La ou les tâches liées à la situation : cela nous permettra de faire le lien avec le modèle de tâche et donc de connaitre les tâches principales qui le composent.

2. Les acteurs de la situation : Cela nous permettra de faire le lien avec le modèle de l’utilisateur. En fonction de l’utilisateur, certaines contraintes pourront (ou non) apparaitre.

3. Les besoins fonctionnels de la situation : c’est-à-dire quel sont les objectifs de cette tâche 4. Les contraintes matérielles et contextuelles : est-ce que le matériel mis en œuvre dans la situation à un

impact sur la réalisation de la tâche ? idem pour l’environnement lui même 5. Les mécanismes informels : cette partie est la plus difficile. Elle consiste à illustrer s’il y a des mécanismes

implicites, inconscients, … qui viennent influencer la tâche. Pour notre TP on ignorera cette partie. Une étape/situation pourra par exemple prendre la forme ci-dessous :

L’identification des différents éléments n’est qu’une première phase. Il est important de tirer les enseignements de

chaque élément identifié.

Par exemple, s’il y a plusieurs utilisateurs, il faudra un système collaboratif qui permettra un accès partagé entre les

utilisateurs aux différentes ressources. Il faudra peut-être également des moyens d’échanges de données et de dialogues

entre les utilisateurs.

Un autre exemple, si la situation se passe en condition de mobilité (déplacement dans le désert), il y aura probablement

des difficultés au niveau du réseau ce qui voudra dire qu’il faudra anticiper les coupures (mécanisme de caches) et facilité

le rétablissement des communications. Au contraire, si la situation est à l’intérieur d’un bureau, on devrait avoir une

bonne connexion réseau (filaire ou wifi) mais par contre on pourrait avoir des problèmes sur la localisation GPS.

IUT- Département d’Informatique G. Rey

2016

Département Informatique - IUT Nice-Côte d'Azur

Université Nice – Sophia Antipolis

41, Bd Napoléon III, 06206 Nice Cedex 3

Tél : +33 (0) 4 97 25 82 11– Fax : +33 (0) 4 97 25 83 31 5

Introduction à l’IHM – M2105

TD n° 1

A savoir :

Du scénario oral ou rédigé (type histoire), on doit donc identifier les étapes/situation

principales. De ces situations, on pourra alors identifier les tâches à modéliser ainsi que les

différentes contraintes à prendre en compte.

De manière collégiale (tous les étudiants et votre enseignant) :

Etablissez la liste des fonctionnalités que vous souhaiteriez avoir pour une telle application.

Un bilan de l’ensemble des fonctionnalités devra être rédigé.

Un des étudiants du groupe de projet doit envoyer par email (au responsable du cours) le bilan des fonctionnalités

retenues. On prendra en compte la richesse et la cohérence des fonctionnalités choisies par le groupe

Maintenant que vous avez choisi les fonctionnalités de votre application, il faut « mettre en musique » celles-ci. C’est-à-

dire les replacer dans un contexte ou une situation compréhensible par le plus grand monde.

Ecrivez un scénario qui illustre de manière la plus complète possible les fonctionnalités choisies pour votre

application.

5.2 Modèle de tâches Maintenant que nous avons une première version des fonctions de notre application, il convient de réaliser une

décomposition en tâche de l’utilisation de notre application.

Ecrivez une décomposition en tâches de votre application

A savoir :

Un des moyens de modélisation des tâches de l’utilisateur consiste en une décomposition

hiérarchique but/sous-but. Il existe plusieurs notations (graphique ou non) de cette

décomposition.

IUT- Département d’Informatique G. Rey

2016

Grille de notation d’un arbre de tâches

Département Informatique - IUT Nice-Côte d'Azur Université Nice – Sophia Antipolis

41, Bd Napoléon III, 06206 Nice Cedex 3 Tél : +33 (0) 4 97 25 82 11– Fax : +33 (0) 4 97 25 83 31

Critères Excellent (5 points) Bon (3 points) Insuffisant (1 point) Inacceptable (0 point)

Couverture

fonctionnelle du

modèle de tâches

Le modèle de tâches couvre bien

l'ensemble des tâches de l'application

telles qu'elles ont été définies

préalablement

Le modèle de tâches couvre une

majorité (≥ 85%) des tâches de

l'application telles qu'elles ont été

définies préalablement

Le modèle de tâches couvre une partie

(≥ 70%) des tâches de l'application

telles qu'elles ont été définies

préalablement

Le modèle de tâches ne couvre que

partiellement (< 70%) les tâches de

l'application telles qu'elles ont été

définies préalablement ou aucun

modèle n'a été réalisé

Précision de la

décomposition

en tâches / sous-

tâches

Chaque tâche du modèle est

décomposée en sous-tâche et cela de

manière récursive (les sous tâches

sont-elles mêmes décomposées en

sous tâches) jusqu'à obtenir des

tâches élémentaires (actions

physiques)

Une majorité (≥ 75%) des tâches du

modèle est décomposée en sous-tâche

et cela de manière récursive (les sous

tâches sont-elles mêmes décomposées

en sous tâches) jusqu'à obtenir des

tâches élémentaires (actions

physiques)

Une partie (≥ 50%) des tâches du

modèle est décomposée en sous- tâche

et cela de manière récursive (les sous

tâches sont-elles mêmes décomposées

en sous tâches) jusqu'à obtenir des

tâches élémentaires (actions

physiques)

Une minorité (< 50%) des tâches du

modèle est décomposée en sous-

tâche et cela de manière récursive

(les sous tâches sont-elles mêmes

décomposées en sous tâches) jusqu'à

obtenir des tâches élémentaires

(actions physiques)

Respect de

l'organisation

temporelle des

sous-tâches

L'ensemble des sous-tâches de chaque

tâche est organisé en fonction des

opérateurs de séquence (stricte ou

non) ou d'entrelacement (strict ou

non) et respecte les spécifications

initiales de l'application

Une majorité (≥ 75%) des sous- tâches

de chaque tâche est organisée en

fonction des opérateurs de séquence

(stricte ou non) ou d'entrelacement

(strict ou non) et respecte les

spécifications initiales de l'application

Une partie (≥ 50%) des sous-tâches de

chaque tâche est organisée en fonction

des opérateurs de séquence (stricte ou

non) ou d'entrelacement (strict ou

non) et respecte les spécifications

initiales de l'application

Une minorité (< 50%) des sous-

tâches de chaque tâche est

organisée en fonction des

opérateurs de séquence (stricte

ou non) ou d'entrelacement

(strict ou non) et respecte les

spécifications initiales de

l'application

Qualité des

annotations

attachés aux

tâches

L'ensemble des tâches est décoré à

l'aide de commentaires et

d'opérateurs (répétition, optionnel, …)

de manière à respecter les

spécifications initiales de l'application

Une majorité (≥ 75%) des tâches est

décoré à l'aide de commentaires et

d'opérateurs (répétition, optionnel, …)

de manière à respecter les

spécifications initiales de l'application

Une partie (≥ 50%) des tâches est

décoré à l'aide de commentaires et

d'opérateurs (répétition, optionnel, …)

de manière à respecter les

spécifications initiales de l'application

Une minorité (< 50%) des tâches est

décoré à l'aide de commentaires et

d'opérateurs (répétition, optionnel, …)

de manière à respecter les

spécifications initiales de l'application