IHM cours 5 : théories pour lergonomie
19 oct. 2023 ▷ mésinterprétation du code couleur. ▷ Solutions. ▷ respecter les codes usuels. ▷ vert : validation succès. ▷ rouge : alerte
ergonomie - Lisibilité des couleurs
IHM & EXPÉRIENCE UTILISATEUR: ERGONOMIE. Page 2. QUELQUES THÉORIES GÉNÉRALES DE L ➢ mésinterprétation du code couleur. ❑ Solutions. ➢ respecter les codes ...
10 étapes pour réussir vos IHM
IHM ? L'IHM -Interface Homme Machine- établit une communication entre un Créer votre propre code
Spécification des IHM pour la conduite le suivi et la maintenance
l'application sous la forme de voyants respectant un code couleur standardisé. Ces voyants sont complétés par des textes explicatifs. Page 8. EB03.64.130. /A.
Etude exploratoire du stylo électronique pour le contrôle aérien
22 juil. 2014 chercheurs en IHM. Pendant cette séance les caractéristiques techniques du ... de contrôle
Interface Homme Machine
Le codage couleur appelé aussi code des couleurs
IHM: Fondements des Interfaces Graphiques
Conversions entre espaces de couleur (RGB HSV
Laboratoire dautomatismes
commande IHM vrm c de l'IHM. Appui sur le Cliquer sur OK. Ergonomie. `a respecter. ATTENTION : Les codes de couleur sont définis de la mani`ere suivante : - ...
Série NS
Vous pouvez concevoir les applications hôtes avec les noms d'étiquette de l'API et de l'IHM. vous modifiez la couleur de l'arrière-plan de tous les objets ...
IHM-1 ID - 6 Composants de linterface / Elements dinteraction
Cours IHM-1. Conception des interfaces. 6 - Composants de l'interface. Éléments d L'idée du codage couleur (ou code des couleurs) est d'associer à chaque ...
Cours IHM
Cours Introduction l'IHM. Introduction. • Cours Conception Cours Éléments d'IHM – guides de style ... mésinterprétation du code couleur. ? Solutions.
Lisibilité des couleurs
à connaître pour concevoir évaluer et réaliser des IHM les couleurs ont une signification usuelle ... mésinterprétation du code couleur. ? Solutions.
NORMALISATION Code des couleurs pour boutons poussoirs
28 avr. 2009 Code des couleurs pour boutons poussoirs. 1/ Rôle. Les couleurs normalisées (NF EN 60204-1) ont pour rôle de définir la fonction attribuée ...
Algorithmique & programmation en langage C - vol.2 - Archive
14 juil. 2015 Votre fonction main doit contenir le code nécessaire au test de chacune des autres ... autre couleur que le texte affiché par le programme.
10 étapes pour réussir vos IHM
Créer votre propre code avec une même couleur pour un même type d'application. Ce code doit avoir un sens clair pour l'utilisateur
Interface Homme Machine
Le codage couleur appelé aussi code des couleurs
Guide dutilisation de la marque à lusage des Membres
Si vous devez ajouter de la couleur au logo n'utilisez que les couleurs Title: IHM Business Card_FR-SZFR ... Code postal
Critères ergonomiques
accessible depuis : http://www.telecom-paristech.fr/~elc/ihm impression haut de gamme : 6 couleurs ou plus car pigments imparfaits additif soustractif ...
SCIENCES DE LINGENIEUR
Code de couleurs : sur ces résistances sous forme d'anneaux en couleur suivant le code suivant : ... s'agit de l'interface Homme/Machine (IHM) ;.
?????? ????
t IHM graphique – courbes de tendance avec code couleurs t Écrans d'alarmes intégrés t Bibliothèque de textes – gestion d'alarmes.
1 Interface Homme Machine
Revenons sur le code de l’IHM La réalisation de l’interface graphique est commentée dans le code elle s’appuie sur le moduletkinter qu’on charge avec from tkinter import * La communication série avec la carte micro:bit s’appuie sur le module serial qu’on charge avec from serial import *
RGB to Color Name Reference - New Jersey Institute of Technology
Pale Green 143;188;143 8FBC8F Sea Green 35;142;104 238E68 Spring Green 0;255;127 00FF7F Free Speech Green 9;249;17 09F911 Free Speech Aquamarine
Number Color Codes Color Use Hex Codes RED GREEN BLUE
HTML COLOR CODE CHART RGB Number Color Codes Color Use Hex Codes RED GREEN BLUE 1 RED (fast) #FF0000 255 0 0 2 DARK RED (OK red) #8B0000 139 0 0 3 MAROON no humans #800000 128 0 0 4 TOMATO (vitalizing) #FF6347 255 99 71 5 VIOLET RED (crazy depression) #D02090 208 32 144 6 PALE VIOLET RED not me #DB7093 219 112 147
Cours 5
Stéphanie Jean-Daubias
Stephanie.Jean-Daubias@univ-lyon1.fr
INFO L3 31Cours Cours
Introduction
CoursConception
TPen équipes
Vidéoen équipes
CoursIHM maquettes
TPmaquettage
Conception
CoursTests utilisateurs
TPtest utilisateurs
Tests utilisateurs CoursTPévaluation ergo théories avec JADE
Coursguides de style
TP CoursTPévaluation ergo critères avec JADE
CoursTPnoté
CoursTPévaluation ergo mobile avec JADE
CoursTPmaquettage
Ergonomie
TPévaluation complète JADE
TPvidéo pédagogique
Préparation
deExamen
+ vraie vieDéroulement
2 31Plan du cours
Introduction
Faire une évaluation ergonomique
3 31Ergonomie des objets / du poste de travail
vise à adapter les postes de travail aux caractéristiques physiologiques et psychologiques de la personneErgonomie logicielle
(ergonomie de correction / de prospection / de conception) pour diminuer les erreurs, le temps d'apprentissage rendre le logiciel le plus facilement utilisablePoint de vue
UTILISATEUR
et non concepteur/développeur4 (grec)ergonomieɋɟɊɍɑ(nomos) : la loi
31Utilisabilité
degré selon lequel un produit peut être utilisé, par des utilisateurs identifiés, pour atteindre des buts définis dans un contexte efficacité: atteinte du résultat prévu prise en main du logicielInterface intuitive
utilisable dès la première fois, sans formation plus globale, intègre différents aspects 5 31Pourquoi des théories scientifiques ?
tests utilisateurs théories scientifiques mémoire(s) potentialité accès, localisation décision couleurs, texte 6à des théories scientifiques
31Plan du cours
Introduction
Faire une évaluation ergonomique
7MémoireʹMillerʹHickʹ2 secondesʹ3 clicsʹOisillonʹPotentialitéʹGestaltʹCouleursʹLectureʹFittsʹTexte
31LifIHM : SJD
LIRIS UCBLMémoire : court terme vs. long terme
Mémoire à court terme :
caractéristiques mémorisation 7 items accès séquentiel oubli rapide (15 à 30 secondes) progressif regroupement par motifs visuels lettres, chiffres, mots formes, taille couleur, localisation acoustiques son de début, rime 9Mémoire à long terme :
caractéristiques capacité infinie accès associatif durée de stockage illimitéeSolutions pour bénéficier de
la mémoire à long terme favoriser la répétition, la régularité, la cohérence constants, les points communsMémoireʹMillerʹHickʹ2 secondesʹ3 clicsʹOisillonʹPotentialitéʹGestaltʹCouleursʹLectureʹFittsʹTexte
31LifIHM : SJD
LIRIS UCBLNombre magique de Miller
La mémoire de travail peut contenir
7 items ±2
selon individu, fatigue...Risques
particulièrement pour les logiciels à utilisation peu fréquenteSolutions
établir des liens entre éléments
10MémoireʹMillerʹHickʹ2 secondesʹ3 clicsʹOisillonʹPotentialitéʹGestaltʹCouleursʹLectureʹFittsʹTexte
31LifIHM : SJD
LIRIS UCBLLoi de Hick
Principe
le temps nécessaire pour prendre une décision dépend du nombre et de la complexité des options proposéesRisques
Solutions
utiliser des messages concis11MémoireʹMillerʹHickʹ2 secondesʹ3 clicsʹOisillonʹPotentialitéʹGestaltʹCouleursʹLectureʹFittsʹTexte
31LifIHM : SJD
LIRIS UCBLLoi de Hick
Langage employé
Éviter les impasses
Éviter les abréviations
Les messages doivent être
concis homogènesà la voix active
à la forme affirmative
clairs, explicites polis 12MémoireʹMillerʹHickʹ2 secondesʹ3 clicsʹOisillonʹPotentialitéʹGestaltʹCouleursʹLectureʹFittsʹTexte
31LifIHM : SJD
LIRIS UCBLPrincipe des 2 secondes
Principe
la réponse du système ne doit mettre plus de 2 secondes à arriverRisques
Solutions
13MémoireʹMillerʹHickʹ2 secondesʹ3 clicsʹOisillonʹPotentialitéʹGestaltʹCouleursʹLectureʹFittsʹTexte
31LifIHM : SJD
LIRIS UCBLPrincipe des 3 clics
Principe
en 3 clics (web) rapidementRisques
Solutions
rendre les actions importantes accessibles directement ou au moins rapidement adapter à la situation 1416 clics / 3 clics
MémoireʹMillerʹHickʹ2 secondesʹ3 clicsʹOisillonʹPotentialitéʹGestaltʹCouleursʹLectureʹFittsʹTexte
31LifIHM : SJD
LIRIS UCBL (ou du rétroviseur) 15Principe
les utilisateurs ont tendance à rejeter les éléments ou env. non familiersRisques
rejet des nouvelles applications/versions stratégies de contournementSolutions
évolution dans la cohérence
accompagner le changementMémoireʹMillerʹHickʹ2 secondesʹ3 clicsʹOisillonʹPotentialitéʹGestaltʹCouleursʹLectureʹFittsʹTexte
31LifIHM : SJD
LIRIS UCBLPrincipe
signes implicites ou explicitesRisques
hésitation, perte de temps mauvais ou non-usageSolutions
aider à distinguer ce qui est cliquable/non-cliquable forme, libellé, couleur, localisation comportementPotentialité (affordance)
16MémoireʹMillerʹHickʹ2 secondesʹ3 clicsʹOisillonʹPotentialitéʹGestaltʹCouleursʹLectureʹFittsʹTexte
31LifIHM : SJD
LIRIS UCBLPerception
Théorie de la
Gestaltou psychologie de la forme
les processus de la perception et de la représentation mentale traitent spontanément les phénomènes comme des ensembles structurés (lesformes) et non comme une simple addition ou juxtaposition d'éléments complétion émergence de caractéristiques absentes des formes individuelles lois de la théorie de la Gestaltétudiées : proximité, similarité
autres : distinction figure-fond, continuité visuelle, symétrie, point focal17MémoireʹMillerʹHickʹ2 secondesʹ3 clicsʹOisillonʹPotentialitéʹGestaltʹCouleursʹLectureʹFittsʹTexte
31LifIHM : SJD
LIRIS UCBLThéorie de la Gestalt
proximitéLoi de proximité
le cerveau tend à associer ce qui est proche physiquementRisques
associer des concepts/actions opposésSolutions
rapprocher les éléments similaires / éloigner les éléments différents au niveau micro et au niveau macro 18MémoireʹMillerʹHickʹ2 secondesʹ3 clicsʹOisillonʹPotentialitéʹGestaltʹCouleursʹLectureʹFittsʹTexte
31LifIHM : SJD
LIRIS UCBLLoi de similarité
le cerveau tend à associer ce qui se ressembleRisques
confondre les objets ressemblantsSolutions
associer des points communs aux éléments similaires marquer les éléments différents avec des spécificitésThéorie de la Gestalt
similarité 19MémoireʹMillerʹHickʹ2 secondesʹ3 clicsʹOisillonʹPotentialitéʹGestaltʹCouleursʹLectureʹFittsʹTexte
31LifIHM : SJD
LIRIS UCBLLisibilité des couleurs
Principe
contrastecaractères/fond élevé caractèressombres sur fondclair de préférence caractères noirs sur fond blanc sauf en environnement peu lumineux (nuit, tâche particulière) nombre de couleurs limitéRisques
contraste insuffisant qui limite la lisibilité effet sapin de noëlSolutions
éviter certaines combinaisons de couleurs
limiter le nombre de couleurs (7 grand maximum, hors icônes) 20LoremipsumLoremipsum
LoremipsumLoremipsum
MémoireʹMillerʹHickʹ2 secondesʹ3 clicsʹOisillonʹPotentialitéʹGestaltʹCouleursʹLectureʹFittsʹTexte
31LifIHM : SJD
LIRIS UCBLPrincipe
les couleurs ont une signification usuelle exemple : rouge = stop / vert = go contre-exemple : en chine, rouge = joie ; au théâtre, vert = superstitionRisques
mésinterprétation du code couleurSolutions
respecter les codes usuels vert : validation, succès rouge : alerte, arrêt, échec faire attention aux spécificités locales, culturellesSignification des couleurs
21MémoireʹMillerʹHickʹ2 secondesʹ3 clicsʹOisillonʹPotentialitéʹGestaltʹCouleursʹLectureʹFittsʹTexte
31LifIHM : SJD
LIRIS UCBLPrincipe
utiliser les couleurs pour signifier quelque chose de façon pertinenteRisques
objets de même couleur associés à tort couleurs non/mal perçuesSolutions
combiner/expliciter les informationsPertinence des couleurs
22MémoireʹMillerʹHickʹ2 secondesʹ3 clicsʹOisillonʹPotentialitéʹGestaltʹCouleursʹLectureʹFittsʹTexte
31LifIHM : SJD
LIRIS UCBLPortabilité des couleurs
quotesdbs_dbs13.pdfusesText_19[PDF] principes fondamentaux de l'économie et de la gestion nathan corrigé
[PDF] l après dînée ? ornans description
[PDF] enterrement ? ornans analyse
[PDF] un enterrement ? ornans
[PDF] l'argent emile zola résumé
[PDF] l'argent citation
[PDF] l'argent définition economique
[PDF] emile zola le docteur pascal lecture analytique
[PDF] l'argent et le bonheur
[PDF] l'argent métal
[PDF] l'argile verte pdf
[PDF] • ensemble de règles minima pour le traitement des détenus
[PDF] l'argile qui guérit en cote d'ivoire
[PDF] instruments juridiques internationaux de protection des droits de l'homme