elsaddik 1 Unit A-Introduction (c) elsaddik SEG 3520 Conception et analyse des interfaces usagers...

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik

1Unit A-Introduction(c) elsaddik

SEG 3520

Conception et analyse des interfaces usagers

Prof. Dr.-Ing. Abdulmotaleb El Saddik

University of Ottawa (SITE 5-037)

(613) 562-5800 x 6277

elsaddik @ site.uottawa.ca

abed @ mcrlab.uottawa.ca

http://www.site.uottawa.ca/~elsaddik/

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


Unité A: Introduction à HCI

1. Pourquoi étudier le design d’interfaces usagers ?

2. Histoire

3. Buts de HCI

4. Cinq idée clés dans HCI

5. Illusions optiques

6. Comprendre les utilisateurs

7. Productivité de l’utilisateur

8. Disciplines contribuant à HCI

9. Ingénierie du HCI : une branche du génie logiciel

10. Défauts de fonctionnements des UI

11. Études de cas : défaillances dans une interface usager

12. Points clés à reviser

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


Définition

L'étude des personnes et de l’ordinateur et leur influence les uns sur les autres

Un ensemble de processus, dialogues et actions par lesquelles une personne utilise et interagit avec l’ordinateur

Une discipline concernant la conception, l'évaluation et l'exécution de systèmes interactifs pour l'usage humain avec l'étude des phénomènes majeurs qui les entourent

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


1. Pourquoi étudier interface usagers?

• 75% ou plus des efforts de développement concernent les UI • 40% à 70% est typique

• Spécialistes en conception d’interface sont nécessaires

• Tout le monde doit connaître les fondations sur lesquelles se basent le logiciel d'interface usagers

• Logiciel d'interface usagers devient plus compliqué• La complexité des UI croît plus rapidement que d'autres aspects

des systèmes

• Les interfaces usagers graphiques (GUI) ont fait le plus grand saut en terme de complexité

• Les applications tendent à grossir pour utiliser les ressources informatiques disponibles

Il y a des avantages financiers directs à améliorer ses interfaces usagers

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


Avantages financiers et coûts pour améliorer des interfaces usagers

• Augmente la productivité de l’utilisateur• Économie directe d’argent

• Augmente les revenues des ventes• Le système est plus attrayant et la satisfaction du client est plus

grande• Diminue le prix de support et d’enseignement (training)

• Le système est plus intuitif • Diminue le prix de maintenance

• Le système fait ce que l’utilisateur demande• De nombreuses améliorations du système concernent l’UI: mieux

vaut investir un peu au début que beaucoup après la distribution du produit.

Mais• L’équipe de développement doit connaître les bases de

l’analyse et la conception d’UI• Les utilisateurs doivent participer au développement• Des outils de conception d'UI sont nécessaires

Les bénéfices sont presque toujours supérieurs aux coûts

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


2. Histoire

• Dans les premiers jours de l’ordinateur:• Les ordinateurs coûtaient plus que les programmeurs

• Les ordinateurs avaient peu de fonctionnalité

UI n’était pas important• Début des années 1970

• ‘Man Machine Interface’ (MMI) est né

• Le terme est graduellement changé en ‘User Interface’ (UI)

• Idées pour utiliser ‘Graphical User Interface’ (GUI) pour la première fois ont été développées

• Dynabook at Xerox• Fin 1970 et années 1980

• Produits sont appelés ‘user friendly’

• Termes non scientifiques : il s’agit seulement de marketing (‘marketing buzzword’)

• Développement du premier vrai GUI• Xerox Star --> Smalltalk et Macintosh

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


2. Histoire (suite)

• Pendant les années 1980• Le terme «interaction Humain-Ordinateur» (HCI pour «Human-

Computer Interaction») est né

• MS-Windows, X-Windows a suivi Mac

• Recherches intenses dans le domaine de HCI• 1990 et début 2000

• Réalité virtuelle, sons et reconnaissance de la voix, entrées/sorties, etc.

Bien!

MAIS de mauvaises UI continuent à être développer!!!

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


3. Buts de HCI

Améliorer la productivité et diminuer les coûts à travers:• Sûreté :

• Est-ce que le système a prévu le danger?• Fonctionnalité:

• Combien des choses le système peut-il faire?• Efficacité:

• Combien de ressources a-t-on besoin pour terminer la tâche?• Convivialité :

• Est-il facile d’apprendre à utiliser le système?

Mais• Haute fonctionnalité (plusieurs manières de faire la même

chose) peut réduire la convivialité• En causant de la confusion

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


4. Cinq idées clés dans HCI

Visibilité• UI doit toujours aider l’utilisateur à comprendre...

• l’état courant du système

• quelles opérations peuvent être réalisées• par exemple:

• En positionnant le curseur au-dessus d'un point sur l'écran, se qu’il se produira en cliquant avec la souris devrait être clair

• Plusieurs directives de design de l'unité ‘E’ aideront à améliorer la visibilité

Rétroaction (Feedback ) • Quand quelque chose change, ça devrait être évident

• quand vous supprimez un dossier, le système ne devrait pas simplement dire «OK»

But (Goal)• Un état que l'utilisateur veut atteindre

• parler avec quelqu'un au téléphone

• enregistrer un dossier

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


4. Five Key Ideas in HCI (Cont’d)

Affordance • Ensemble des opérations et des procédures qui peuvent être faites à

un objet • ‘Perceived affordance’ est ce que les utilisateurs pensent qui peut être

fait à un objet • Faut-il tirer ou pousser la porte pour l’ouvrir?• Que signifie cette icône?

• Pour améliorer la visibilité / rétroaction (feedback), il faut : • Choisir les objets avec la bonne perception (a good Perceived affordance)• Concevoir l'UI pour obtenir une meilleure perception

tâche (Task)• Une action que l’utilisateur veut réaliser

• pour appeler quelqu'un• pour enregistrer un dossier

• les buts engendrent des tâches, les tâches engendrent des buts.

Unité C discute de «l’analyse des tâches» et donne des bon modèles conceptuels qui aideront à atteindre ceci

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


5. Illusions Optiques

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


5. Illusions Optiques (suite)

The quick brown

fox jumps over the

the lazy dog.

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


5. Illusions Optiques (suite)

• Maintenant lisez la phrase suivante en comptant à voix haute les "F" à mesure que vous les rencontrez (1... 2... etc..).

• Comptez-les UNE FOIS SEULEMENT• Ne revenez pas en arrière! ! !.

• OK - ALLEZ !

FINISHED FILES ARE THE RESULT OF YEARS OF SCIENTIFIC STUDY COMBINED WITH THE EXPERIENCE OF YEARS.

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


6. Comprendre L’utilisateur

Théorie des «doubles processeurs»:• Chaque système interactif est un système distribué s’exécutant

sur deux processeurs:

• La conception d’interfaces usagers précise / contraint:• Comportement des usagers

• Comportement du système

• Nous devons comprendre la nature des «processeurs» humains

• différent modes devraient être considérés en concevant l'UI

user

interface

Computer System

Human User

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


6. Comprendre l’utilisateur (suite)

Utilisateur peut être catégorisé par:• Par classe

• Déterminé par exemple par:• administrateur, étudiant, professeur, client

• Par type de personnalité• timide / extraverti• offensif / défensif• designer!

• Par capacité• Handicap physique

• --> des I/O innovatives peuvent être nécessaires• Daltonien (Colourblind)

• --> ne pas seulement utiliser les couleurs pour transmettre de l'information

• Problèmes cognitifs• --> gauche vs droit !

• Illettrisme• --> utiliser des icônes

• Ignorance du domaine

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


7. Productivité de l’utilisateur & Convivialité

Productivité de l’utilisateur =Fonctionnalité (qu’est-ce que l’ordinateur peut faire)

*Convivialité (qu’est-ce qu’on peut faire avec l’ordinateur)

Si un des deux est zéro, le système est inutile

• Facteurs influençant la productivité de l'utilisateur:• le nombre et les caractéristiques des tâches

• Caractéristiques des utilisateurs (capacités, expérience etc...)

• Environnement de travail (distractions etc...)

• Formation et documentation

• Fonctionnalité et convivialité des logiciels et matériels disponibles

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


A Model of Usability Factors

usability

enjoyability satisfaction

acceptability

ergonomics

primary functionality

efficiency of use

extensibility/customizationlearnability

ease of usefamiliarity

fit to task

fit to user

cognitive load

error handling

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


Critical Usability Factors

High staff turnover Learnability critical

Discretionary use Fit to task critical

Prolonged or frequent use Efficiency critical

Creative use Ease of extension and customization critical

High functionality Higher usability needed

Infrequent discretionary use of highly functional system with staff turnover

A problem!

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


8. Disciplines contribuant à HCI

• Psychologie cognitive • Possibilités et limitations des sens et des processus humains

• Ergonomie • Efficacité des logiciels et hardware et sûreté/sécurité de

l’environnement pour l’usager• Linguistique

• Syntaxe et sémantique des commandes• Entrées/sorties de sons et voix

• Intelligence artificielle• Entrées/sorties de sons et voix• Estimation intelligente de ce que l'utilisateur veut • Représentations des connaissance des utilisateurs

• Sociologie et psychologie sociale• Assister des personnes pour travailler en groupes avec le logiciel• Assurer que de logiciel fonctionne de la même façon dans

différentes cultures• Ingénierie et design industriel

• Approche basée sur les mesures• Esthétique• Story-board etc.

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


Système cognitif humain

Perception et représentation

• Certains affichages peuvent être difficiles à comprendre• Bleu avant-plan (foreground)

• Illusions d’optiques

• Contrastent dans les couleurs

• Trop de couleurs• Il y a 2 façons d’utiliser les graphiques:

• Pour la modélisation

• images directes des concepts

• Pour la codification

• représentant des idées fondamentales, par exemple montrer des données quantitatives

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


Système cognitif humain (suite)

Distractions

• Personnes peuvent être distraits facilement• Indiquer clairement les points importants

• Personnes peuvent être perdus si le système est très complexe• Structurer l’information pour qu’elle soit facile à lire rapidement

• Pas trop d‘informations

• Pas trop peu d‘informations

• Groupez l‘informations logiquement• Personnes multitâches

• Indiquer l’état du système clairement pour que les usagers s’y retrouvent facilement

• Certains processus mentaux sont automatiques, ou le deviennent (contrairement aux processus commandés)

• il est très difficile d’oublier ces processus

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


Système cognitif humain(suite)

Limite de la mémoire

• La mémoire à court terme peut contenir 7±2 unités d’information

• Eviter les situations où l’utilisateur doit se rappeler plus

• Grouper l’information logiquement pour en faire des unités

• Plus c’est significatif, plus c’est facile à retenir (les éléments familiés, les images et l'uniformité aide à mieux comprendre)

• Utiliser des noms et des icônes efficaces

• Associer icônes et mots

• Les icônes peuvent être des analogies, des exemples ou des abstractions mais ne doivent pas être arbitraires

• Attention aux différences culturelles (par exemple le symbole indiquant des toilettes n’est pas le même partout!)

• Les gens reconnaissent plus facilement qu’ils ne se rappellent • Utiliser des menus, des icônes

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


Quelques points d’organisation

E-MAILS:

• doit commencer avec :• SEG 3520: xxxxxxxxxxxxxxxx

• Est-ce que vous avez un/e associé(e) pour les projets?

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


Quelque points d’organisation

• Les TAs sont:• Anwar Hossein

• [email protected]

• Yong Zhong

• [email protected]

IMPORTANT pour Devoir #1• Vous n’évaluez pas les humains (usagers)• Vous évaluez SEULEMENT le logiciel pour

trouver les défauts de fonctionnement

• N’oubliez pas de signer « Informed Consent Form »

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


9. Ingénierie du HCI : une branche du génie logiciel (Unités C et D)

Un modèle conceptuel du processus de développement des interfaces usagers :• Modèle «Star»• Évaluation est le processus central

• UI est révisée chaque fois qu’un problème est soulevé

Evaluation

Implementation Task analysis/ functional analysis

Requirements specification

Conceptual design

Prototyping

Detailed design

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


Un modèle conceptuel d’UI à cinq niveaux

À chaque niveau:• Design doit être fini• Problèmes peuvent survenir

Les niveaux sont:• Niveau des tâches

• Que veut faire l’usager• Niveau conceptuel

• Modèle du système tel qu’imaginé par l’utilisateur• Niveau du style d’interaction

• éléments du design qui sont répétés dans tout le système :

• commandes, menu de navigation, manipulations directes, hypermédia

• Niveau d’élément d’interaction • Fenêtres spécifiques, dialogues, commandes, menus

• Niveau d’élément physique • Bitmaps, caractères, structures des données, procédure de

rappel

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


Évolution du simple SW- à ing. conviviale

• Développement normal du logiciel (impliquant UI)• se concentrer sur les éléments d’interaction et les éléments

physiques

• le modèle « Waterfall » domine (séquentiel), modèle «Spirall»

• évaluation par la revue et les tests des spécifications fonctionnelles

• Développement des interfaces usagers• se concentrer sur les utilisateurs et les tâches

• le modèle « Star » domine (itératif)

• évaluation par la participation continu des usagers

• conduit par l'heuristique et les directives

• intègre la psychologie etc.

• influence la fonctionnalité• Convivialité (Usability) engineering

• Se base sur des objectifs précis et rigoureux

• pousse fonctionnalité

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


Système d’architecture du modèle conceptuel de UI

• Pourquoi des couches?• Simplifie le développement et la maintenance du logiciel

• Les deux couches:• sont développées en parallèle• influence l'une l'autre• sont inclus dans les spécifications du système complet• sont évaluées en même temps

• Évolution des couches:• La couche fonctionnelle change peu pendant le développement du

système• Les deux couches peuvent avoir besoin d’être modifiées si on mod

les fonctions principales du système

User interface layer

Functional layer(s)

API (low-level commands)

(focus of task analysis and conceptual modelling)

(focus of functional analysis)

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


Caractéristiques des produits et applications

• Chaque genre d’applications demande une réponse/adaptation différente du concepteur d’UI :

• application pour usage interne vs produit destiné à la vente

• service générique vs outil spécialisé

• niveaux de connaissances requis (sans apprentissage particulier vs produit spécialisée pour un domaine)

• Quelques défis de design:• Adapter un produit de service générique de sorte qu’il devienne un

outil tâche-spécifique pour l'usage interne et vice versa

• Convertir une application exigeant des utilisateurs spécialisés en une application facile à apprendre et utiliser

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


10. Défauts de fonctionnements des UI

Idée clé:

« Il n’y a pas de bonnes interface usagers ... il n’y que des interfaces qui s'adaptent au besoin actuel»• Une interface utilisateur véritablement mauvaise ne s'adaptera

jamais• mais parmi les bonnes, peu conviendront à une tâche ou une

autre

Pour maximiser l’adaptation, nous devons réduire au minimum l'occurrence des «défauts de

fonctionnements » dans le contexte de l'utilisation prévue du système.

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


Définitions: défauts de fonctionnements (Défaillances)

“Un désaccord entre ce que l'utilisateur veut, a besoin ou prévoit et ce que le système fournit.”

“Une panne de convivialité”

“Un obstacle pour accomplir une tâche désirée”

Il faut savoir que:• les défauts de fonctionnements occasionnels sont normals• les défauts de fonctionnements systématiques ou fréquents ont besoin

d'être corrigés

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


Idées relatives aux ‘défauts de fonctionnements’

• Erreur : Erreur identifiable de la part de designer• Défaut : Une déviation de ce que l'utilisateur a besoin

• Une défaillance est une panne de convivialité:• Un défaut dans le fonctionnement régulier du système

• Les utilisateurs peuvent ne pas se rendre compte de plusieurs défauts de fonctionnement

• les défauts de fonctionnement peuvent seulement être isolés par des analyses soigneuses

• ils peuvent être subtiles

Discussion détaillée sur les défaillancesdans l’unité B

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


11. Études de cas : défaillances dans une UI

Désastres aériens • Le pilote de la ligne aérienne de la Chine perd le contrôle :

• On s'attendait à ce que l'humain agisse en tant que moniteur, mais les humains sont de mauvais moniteurs (obtenez alésé)

• Les humains ont besoin de contrôler les choses et d’obtenir une réponse

• US Vincennes a abattu un avion iranien: 290 morts • informations critiques concernant l’avion affichées sur différents

écrans

• en recueillant les faits pertinants de différents endroits, on s’aperçoit que plusieurs informations se contredisent

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


12. Points clés à reviser

• Buts de HCI: améliorer• Sûreté

• Fonctionnalité

• Efficacité

• Convivialité • Visibilité et rétroaction • Affordance et perceived affordance• But = état ; tâche = action• Humain/ordinateur comme un système de 2 processeurs• Types, classes et capacité des utilisateurs• Productivité de l’utilisateur = Fonctionnalité * convivialité• Facteurs de la convivialité

• Exemple: simplicité d'apprentissage, fit, acceptabilité• Disciplines contribuant

• Exemple: linguistique, Intelligence artificielle

ww

w.s

ite.

uo

ttaw

a.ca

/~el

sad

dik


12. Points clés à reviser (suite)

• Système cognitif humain – limité par:• perception

• attention

• mémoire• Analyse des tâches vs. Analyse des fonctions • Modèle «Star» avec évaluation au centre• Niveaux UI• tâches

• Modèle conceptuel

• style d’interaction

• élément d’interaction

• élément physique • Convivialité engineering• UI Couches avec API• Défauts de fonctionnements (Défaillances) comme une déviation de ce

que l’usager a besoin

Date post:	04-Apr-2015
Category:	Documents
Upload:	gringolet-calvez
View:	105 times
Download:	3 times

elsaddik 1 Unit A-Introduction (c) elsaddik SEG 3520 Conception et analyse des interfaces usagers...

Documents