Le contenu est basé aux transparents du 7ème édition
de «Software Engineering» de Ian Sommerville
B.Shishedjiev - Génie logiciel 1
Conception d’interface d’utilisateur
B.Shishedjiev - Génie logiciel 2
IU besoins• L’interface doit correspondre aux compétence,
l’expérience et les attentes des utilisateurs prévus
• Les utilisateurs du système jugent souvent un système par son interface plutôt que ses fonctionnalités
• Une interface mal conçue peut provoquer un utilisateur de faire des erreurs catastrophiques.
• Mauvaise conception d'interface utilisateur est la raison pour laquelle tant de systèmes logiciels ne sont jamais utilisés.
B.Shishedjiev - Génie logiciel 3
Les facteurs humains dans la conception de l‘IU
• Mémoire à court terme limitée– Les gens peuvent se rappeler instantanément à
environ 7 éléments d'information
• Les gens font des erreurs • Les gens sont différents
– Les gens ont un large éventail de capacités physiques. Les concepteurs devraient pas seulement le design de leurs propres capacités
• Les gens ont des préférences différentes interactions – des images ou texte
B.Shishedjiev - Génie logiciel 4
Principes de conception d'interface utilisateur • Familiarité pour l’utilisateur
– L'interface devrait être basée sur termes et des concepts familiers pour l'utilisateur plutôt que des concepts informatiques.
• Cohérence– Le système devrait afficher un niveau approprié de la
cohérence. Les commandes et les menus doivent avoir le même format, la ponctuation de commande devrait être similaire, etc
• Minimaliser la surprise– Si une commande fonctionne d'une manière connue,
l'utilisateur doit être capable de prédire le fonctionnement des commandes similaires
B.Shishedjiev - Génie logiciel 5
Principes de conception d'interface utilisateur
• Récupérabilité– Le système devrait offrir une certaine résilience aux
erreurs des utilisateurs et permettent à l'utilisateur de récupérer les erreurs (possibilité d'annulation, confirmation des actions destructrices, suppression provisionnelle, etc ).
• Diversité des utilisateurs– Icônes ou plus grand texte
• Guidage de l'utilisateur
B.Shishedjiev - Génie logiciel 6
Problèmes de conception d'interface utilisateur
• La présentation de l’information• La saisie de l’information• Ils sont unie dans un cadre de l’abstraction dite
l’interface de l’utilisateur. – On peut avoir plusieurs interfaces conçus pour
différents groupes d’utilisateurs. Exemple Unix
B.Shishedjiev - Génie logiciel 7
Styles d’interaction• La manipulation directe
Les jeux, simulation, les sytèmes CAO
• Sélection d'un menuLes systèmes plus générales
• Formulaire à remplirSystèmes d’information, de banques etc.
• Langage de commandeSystèmes d’exploitation. Systèmes de gestion
• Le langage naturelSystèmes d'extraction de l'information
• Interface basé WEBFormulaires, boutons, boxes de texte, images intéractives
B.Shishedjiev - Génie logiciel 8
Formulaire de recherche Lybsys
LIBSYS: Search
Choose collection
Keyword or phrase
Search using
Adjacent words
Search Reset Cancel
All
Title
Yes No
Présentation d’information• Type de présentation
– Directe– Transformé (graphique, audio, etc.)
• MVC modèle (Model-View-Controler)Manière d’avoir plusieurs présentation des données.
B.Shishedjiev - Génie logiciel 9
Information qui va être présentée
Module de présetation
Affichage
Model-View-Controler
B.Shishedjiev - Génie logiciel 10
Présentation de l’information• Information statique
– Permanente pendant la session– Numérique ou texte.
• Information dynamique– Modifiée pendant la session et les modification
doivent être vues par l’utilisateur– Numérique, texte
B.Shishedjiev - Génie logiciel 11
Facteurs influant sur l’affichage• Lequel est plus important?
– La valeur absolue– La valeur relative
• La vitesse de changement• Le besoin d’une réaction de la côté utilisateur• La disponibilité d’un interface directe pour
manipuler l’information• Le type de l’information
– Numérique– Textuelle
B.Shishedjiev - Génie logiciel 12
Méthodes de présentation• Numérique
– Compacte– Précise
• Analogique– Plus compréhensible – Voir les relation plu facilement– Voir les exceptions
B.Shishedjiev - Génie logiciel 13
Méthodes de présentation
B.Shishedjiev - Génie logiciel 14
0
1000
2000
3000
4000
Jan Feb Mar April May June
Jan2842
Feb2851
Mar3164
April2789
May1273
June2835
Méthodes de présentation
B.Shishedjiev - Génie logiciel 15
1
3
4 20 10 20
Dial with needle Pie chart Thermometer Horizontal bar
0 100 200 300 400 0 25 50 75 100
Pression Temperature
Valeurs relatives
Visualisation des données• Méthodes d’affichage de grandes quantités de
données – montre les relations et les tendances • Exemples
– Différents modèles – molécules, réseaux, information géographique
– Information météorologique
B.Shishedjiev - Génie logiciel 16
Utilisation des couleurs• Les couleurs sont utiles quand
– On doit améliorer la compréhensibilité– On doit souligner des évènements exceptionnels
• Erreurs communes– Utiliser la couleur pour communiquer le sens– La sur-utilisation de la couleur à l'écran.
• Recommandations– Borner le nombre de couleurs– Utiliser changement de couleur quand il ya un
changement d’état– Soyez prudent sur paires de couleurs
B.Shishedjiev - Génie logiciel 17
Les messages d’erreurs• Importance• Recommandations – poli, concise, consistent,
constructif. • Facteurs
– Contexte– Expérience de l’utilisateur– Niveau de compétence– Style – positif, de ne pas offendre– Culture
B.Shishedjiev - Génie logiciel 18
Bon est mauvais message• Supposons qu'une infirmière tape avec une
erreur le nom d'un patient dont les dossiers qu'il essaie de récupérer.
B.Shishedjiev - Génie logiciel 19
Error #27
Invalid patient id
OK Cancel
Message orienté vers le système Message orienté vers l’utilisateur
R. MacDonald is not a registered patientClick on Patients for a list of patientsClick on Retry to re-input the patient’s nameClick on Help for more information
Patients Help Retry Cancel
Conception de l’IU
B.Shishedjiev - Génie logiciel 20
Analyse d’utilisateur• Modèles des procédures de interaction
– Scénario– Diagrammes des séquences
• Interview– Individuelles – des questionnes ouvertes– En groupes
• Observation
B.Shishedjiev - Génie logiciel 21
Prototypes• En papier
– Des croquis de l’interface– Des bandes dessinées
• Prototypes sur ordinateurs– Simulation des scénarios– Programmation visuelle – exige certaine fonctionnalité– L’approche du “Magicien d’Oz”
B.Shishedjiev - Génie logiciel 22
Evaluation• Critères
– Facile pour apprendre
– Vitesse d’opération
– Robuste – tolérant vers les erreur d’utilisateurs
– Capacité de récupération après une erreur
– Capacité d’adaptation
• Techniques d’évaluation– Questionnaires
– Enregistrement vidéo
– Ajouter de code qui collecte information concernant la session
– Ajoute de code qui collecte les réactions des utilisateurs
B.Shishedjiev - Génie logiciel 23