Conception d’une IHM

Quelques principes et étapes de base:

illustrations par l’exemple

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

Cycle de vie des IHMs

Plan à suivre

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

• Dégager le modèle de conception

• Charte graphique et contraintes ergonomiques

• Réaliser un prototype

• Evaluer le prototype

Plan

• Définir le modèle de l’utilisateur

• Modèle de conception

• Evaluation du prototype

• Conclusion

Les caractéristiques de l’utilisateur

• Classification des utilisateurs– par rapport à la tache à effectuer

• expert, novice, ….

– Par rapport à ses compétences en informatiques• expert, novice, ….

– Par rapport au contexte d’utilisation• matériel, localisation, ….

Définition des besoins de l’utilisateur

Comment se comporte-t-il actuellement pour

réaliser les tâches visées ?

Que souhaite-t-il conserver ? Améliorer ?

• MOYENS : interviews, questionnaires,

évaluation des outils existants

Définition des caractéristiques de l’utilisateurPas de modèle formelinterview d ’utilisateurs types sur les usagesquestionnaires pour un panel d ’utilisateursévaluation et analyse des outils utilisés

Procédure réitérée après un prototype intermédiaire

Définition des besoins de l’utilisateur

En déduire

les taches principales

les points forts et faibles de l ’existant

Essai de vêtements en

ligneChristophe TACHIER

Sylvie CRAHAY Thomas PARLE

Marie ROQUE

LOG 9 ~ I.H.M.Anne-Marie PINNA DERY

Modèle utilisateur

• Etude de l ’existant

• Questionnaire et résultats principaux

Différentes recherches

La redoute

La CAMIF

Alain Manoukian

Etude de l ’existant

Scanner 3D

VITUS (société allemande)

Lasers

Triangulation

Usine de fabricationde vêtements

Etude de l ’existant

Mon Mannequin Virtuel Inc.

Modélisation parfaite du mannequin 3D (+++)

Visualisation statique (- - -)

Etude de l ’existant

Conclusions• Domaine en pleine expansion

• Mise en œuvre d’outils de Haute Technologie

• Manque de réalisme (effets de l’environnement non exploité)

Etude de l ’existant

Questionnaire

• Situation et habitudes

• Pourquoi faire ou non les boutiques ?

• Pourquoi utiliser ou non la vente par correspondance classique ?

• Utilisation d ’Internet ?

• Souhaits ?

Résultats principaux

Il est important de pouvoir essayer le vêtement

Lorsque vous achetez des vêtements, vous aimez :

63,6

40,9

31,8

27,3

13,6

4,5

0,0 10,0 20,0 30,0 40,0 50,0 60,0 70,0

Essayer les vêtements

La présentation du magasin

Autre

Demander des conseils au vendeur

Rencontrer des gens

Discuter les prix

Au contraire vous n'aimez pas :

72,7

68,2

50,0

40,9

40,9

31,8

18,2

13,6

4,5

0,0 10,0 20,0 30,0 40,0 50,0 60,0 70,0 80,0

Faire la queue

La pression du vendeur

Multiples Habillages/Deshabillages

Le passage à la caisse fastidieux

L'accessibilité

Chercher les vêtements

Autre

Les horaires d'ouverture contraignants

Porter les sacs

Résultats principaux

La pression du vendeur et faire la queue posent des problèmes

Résultats principaux

La coupe du vêtement est très importante

Vous attachez plus d'importance :

40,9

50,0

81,8

45,5

9,14,5

0,0

10,0

20,0

30,0

40,0

50,0

60,0

70,0

80,0

90,0

A la couleur Au tissu A la coupe Au prix A la marque Autre

Résultats principaux

On aime bien le côté « rapide » du catalogue

Si oui pour quelles raisons ?

46,2

38,5

30,8

23,1

23,1

23,1

15,4

0,0 5,0 10,0 15,0 20,0 25,0 30,0 35,0 40,0 45,0 50,0

Comparaison facile et rapide des produits du catalogue

Simplement feuilleter le catalogue

Facilité d'achat

Pas assez de temps libre pour faire les courses

N'aime pas faire les courses

Les cadeaux ou promotions

Autre

Résultats principaux

Beaucoup ont des problèmes de taille

Que reprochez-vous aux catalogues?

59,1

50,0

31,8

31,8

22,7

22,7

18,2

0,0 10,0 20,0 30,0 40,0 50,0 60,0 70,0

La différence de taille entre deux produits

La morphologie des mannequins trop différente de soi

La différence de coloris entre deux produits

Autre

Ne pas pouvoir essayer

La présentation des différents produits

Ne pas pouvoir toucher le tissu

Résultats principaux

La coupe du vêtement est très importante

Que souhaitez-vous qu'un service par correspondance vous apporte pour vous faire utiliser ce type d'achat, ou simplement pour l'améliorer si vous l'utilisez déjà ?

77,3

59,1

59,1

59,1

50,0

50,0

40,9

27,3

18,2

0,0 10,0 20,0 30,0 40,0 50,0 60,0 70,0 80,0 90,0

Avoir un aperçu d’un modèle sur une personneressemblant à soi

Ne pas recevoir de grandes quantités de courrierpromotionnels ou publicités diverses

Voir l’ensemble des produits respectant un certaincritère, comme le type, la couleur, etc.

Associer différents produits de son choix sur un mêmemannequin

Régler la taille de manière interactive sur un mannequin

Bénéficier des retouches adaptées avant livraison

Voir évoluer un vêtement sur une personne enmouvement

Avoir un aperçu sur une personne de son choix

Autre

Modèle utilisateur

Tâches principales à retenir :

• Mannequin adapté au client

• Faire des ensembles

• Ajuster les tailles

• Accès aux vêtements par critères

Plan

• Modèle utilisateur

• Modèle de conception

• Evaluation du prototype

• Conclusion

Modèle de conception

• Définition des tâches

• Diagrammes H.T.A.(Hierarchical Task

Analysis)

• ICSE

Modèle de conception

Choisir un produit

Recherche d’un produit

Choisir un mannequi

n

Informations sur le produit

Gérer son panier

Produits associés

Comparer avec un autre produit

Diagramme H.T.A. global

Diagramme HTA :les tâches principales

Apprendre

Travailler un cours Obtenir de l’aide

Choisir le cours

Suivre le coursSélectionner l’année

Sélectionner le module

Sélectionner le cours

Suivre la première fois

Réviser Approfondir

Lire le plan

A1 : Démarrer du début A2 : Choisir une partie

Diagramme HTA :les sous-tâches

A1 ou A2

Le support de cours

Choisie sur le plan

Sur la partie Des liens, bibliographie …

Changer de mode (Première fois/Réviser/Approfondir)

Stopper / Rejouer

Revoir ou répéter le paragraphe en cours

Changer de partie

Chercher une information

Avoir plus de détails sur une partie de cours

Changer de présentation

Faire un commentaire

Poser une question

Obtenir des compléments

Imprimer

Quitter

Obtenir de l’aide

Changer de niveau (Débutant/Novice/Expert)

Partie précédente/suivante

Le prof

Le plan

Sur un mot (glossaire)

Des exemples

Une autre partie du cours

Modèle de conception

Entrer la référence :

Ref : 3345984521

Rechercher

Rechercher

Thème

Catégorie

Indifférent

Chemise

JupePull

Indifférent

CasualHabillé

Sportswear

Homme EnfantFemme

Taille Couleur

Indifférent

38

4240

36

Maquette

Modèle de conception

Prototype

Plan

• Modèle utilisateur

• Modèle de conception

• Evaluation du prototype

• Conclusion

Tests d’évaluation

Protocole de test :

– Taches à réaliser– Chronométrage– Compte des cliques– Appréciation

Synthèse des tests

• Bonne perception de l'interface– Organisation claire– Environnement familier

• Aspects à revoir– Pertinence des icônes– Personnalisation du professeur

Evaluation du prototype

• Choix de personnes plus ou moins « habituées » à l ’utilisation de l ’ordinateur

• Réalisation de tâches précises

• Commentaires généraux

Evaluation du prototype

• Interface satisfaisante

• Pas de difficulté majeure pour

effectuer les tâches demandées

• Motivés par le concept

Conclusions des utilisateurs « test »

Plan

• Modèle utilisateur

• Modèle de conception

• Evaluation du prototype

• Conclusion

Conclusion

• Recherche sur l ’existant intéressante

• Sondage instructif

• Difficultés techniques

FIN