Cours d'IHM - CSII 1ère année EPSI Bordeaux - Cours n°1

Description

• mémoire - matière potentielle : disponible
• cours - matière potentielle : ihm - csii

INTRODUCTION Cours d'IHM - CSII 1ère année EPSI Bordeaux - Cours n°1

• temps de développement
• mocking-bird ¶
• choix des couleurs et des polices de caractères
• caractère ergonomique de l'interface
• contraintes du humaines
• choix arbitraire
• accès à internet
• accès via internet
• accès internet
• interface
• interfaces
• couleur
• couleurs

Sujets

• cours

Informations

• Publié par: nosheng
• Nombre de lectures: 71
• Langue: Français
• Poids de l'ouvrage: 1 Mo

Extrait

INTRODUCTION
Cours d’IHM - CSII 1ère année
EPSI Bordeaux - Cours n°1QU’EST CE QUE LE DESIGN ?
• Une définition :
“Le design est la spécification d’un
Chaise Thonet n°14, 1859
objet, qui a pour but de remplir une
fonction, dans un environnement
particulier, en utilisant jeu de
composants primitifs et en étant
Ford T model, 1908soumis à des contraintes.”
Apple iPod, 2001L’OBJET
• Un programme informatique, un site internet, une
application embarquée, une API, une webapp...LA FONCTION
• La tâche remplie par l’objet : éditeur de texte, blog,
calendrier, gestion comptable, etc...
• Les fonctionnalités doivent être hiérarchisées, la tâche
remplie par l’objet doit être évidente.
• Il vaut mieux faire une chose “bien” que 100 choses
“mal” (“feature creep” ou “feature bloat”). L’ENVIRONNEMENT
• Le système d’exploitation : Windows, OS X, iOS, Android, le
navigateur internet, etc...
• La connectivité : accès internet, logiciel embarqué,
synchronisation, etc...
• Dans le cas des applications “cross platform”, il faut adapter
l’ergonomie au système (ex : Google docs vs MS Office).LES COMPOSANTS PRIMITIFS
• Les éléments d’interface : les briques fonctionnelles sur lesquelles est construite
l’application.
• Par exemple : menu, toolbar, combo-box, boutons, liens hypertexte, etc.
• Chaque système propose un jeu de composants qui influeront sur le design (web
app vs application de bureau vs application mobile).LES CONTRAINTES
• Les limitations techniques dans lesquelles doit s’inscrire le design :
• Contraintes matérielles : mémoire disponible, espace disque,
vitesse du processeur,
• Contraintes d’affichage : résolution de l’écran, nombre de
couleurs, espace réservé au éléments du système,
• Contraintes du humaines et financières : temps de
développement, force de travail disponible, budget, qualité
attendue.ÉVALUATION D’UNE INTERFACE
PAR HEURISTIQUES
• Usability : caractère ergonomique de l’interface.
• Discoverability : les fonctionnalités sont mises en avant et l’utilisateur est poussé a “explorer”
l’application pour les découvrir.
• Learnability : l’interface est constante, des fonctions différentes suivent un processus similaire de
complétion.
• Productivity : (de l’utilisateur) l’interface permet de réaliser des tâches répétitives rapidement, les
temps de latence sont limités au maximum.
• Readability : choix des couleurs et des polices de caractères, hiérarchisation de l’affichage (Gestalt).
• Tolérance à l’erreur.
• etc. La liste n’est pas exhaustive.LES “TRADE-OFFS”
• Un “trade-off” est le choix arbitraire de favoriser une heuristique par
rapport à une autre.
• En d’autres termes, on “sacrifie” une variable pour en favoriser une autre.
• Idéalement, le but est de n’en faire aucun.
• Ex : webOS vs iOS : learnability vs discoverability.LES OUTILS
• Le papier et le crayon.
• Un éditeur d’images (Photoshop, Gimp, Pixelmator, etc.).
• Il existe des outils spécialisés pour le maquettage :
Balsamiq Mockups
• Balsamic Mockups (balsamiq.com),
• Mocking-bird (gomockingbird.com),
• etc.
• Powerpoint n’est pas un outil de design.
Mocking-bird