Design [email protected] (partie de la présentation basée sur des transparents d’Anastasia Bezerianos, Fanis Tsandilas et Michel Beaudouin-Lafon, Jeremie Garcia)
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Design
(partie de la présentation basée sur des transparents d’Anastasia Bezerianos, Fanis Tsandilas et Michel Beaudouin-Lafon, Jeremie Garcia)
L’art du Design
Conception centrée-utilisateur
Méthodes
Image par W. Mackay et M. Beaudouin-Lafon
Connaitre l’utilisateur et la situation
• Qui est l’utilisateur? • Quelle est la tache?
– Observer et tester ne pas imaginer. • Outils
– Carnet de note – Camera – Enregistrement audio
Conception participative Participation active des utilisateurs à la conception
Definissez le problème
• Centrez vous sur le problème et non la solution
• Choisissez le bon niveau de détail.
• Brainstorming – Utiliser des jeux – Des idées proches, – Des objets
• Bouger! – Sketcher – Construire des modèles – Jouer
• Les règles du jeu • Une conversation à la fois, encourager les idée, rester
concentré, ne pas juger, construire sur les idées des autres.
Genérez le plus de solutions possible
Brainstorming
Selectionner une idée • Définir l’importance de chaque idée
– Est ce que ça résoud le problem – Les utilisateurs l’appréciront-ils? – Le logiciel et le hardware est disponible?
• Classer les idées suivants ces critères
• Choisir le TOP 10.
Story-boards
Prototyper
• Basse fidelité (rapide pas cher, moche) – Papier, sketch,…
• Moyenne fidelité (slower, more expensive) – Flash, JavaScript, AJAX, …
• Grande fidelité (le plus cher, prend du temps) – Toute l’interaction
Prototyper
• sketches, papiers, modèles, mousse
• L’échelle: Plus basse à plus haute fidélité.
Prototyper
• L’échelle: Plus basse à plus haute fidélité.
Prototyper
Evaluation • Plusieurs types d’évaluation:
– Walkthroughs – Études Think-aloud – Wizard-of-Oz – Comparaison de performance
• Type d’évaluation à choisir selon le niveau d’implémentation.
Prototype Walkthrough papier
• http://www.youtube.com/watch?v=GrV2SZuRPv0
CRAP contraste, répétition, alignement, proximité
Slide deck by Saul Greenberg. Permission is granted to use this for non-commercial purposes as long as general credit to Saul Greenberg is clearly maintained. Warning: some material in this deck is used from other sources without permission. Credit to the original source is given if it is known. Major sources: Designing Visual Interfaces, Mullet & Sano, Prentice Hall / Robin Williams Non-Designers Design Book, Peachpit Press
CRAP
• Contraste
• Répétition
• Alignement
• Proximité
Robin Williams Non-Designers Design Book, Peachpit Press
CRAP • Contraste
Faire des choses différentes différents Maitre en évidence les élém. dominantes Faire élém. moins importants moins visible Créer un dynamisme
• Répétition
• Alignement
• Proximité
Robin Williams Non-Designers Design Book, Peachpit Press
1
2
3
4
5
CRAP • Contraste
• Répétition Conception repetée au long de l’interface Consistance Créer unité
• Alignement
• Proximité
Robin Williams Non-Designers Design Book, Peachpit Press
1
2 3
4
CRAP
• Contraste
• Répétition
• Alignement Créer un flux visuel Connecter élém.
• Proximité
Robin Williams Non-Designers Design Book, Peachpit Press
1
2
3
4
CRAP
• Contraste
• Répétition
• Alignement
• Proximité Groupes évidents Indépendants séparées
Robin Williams Non-Designers Design Book, Peachpit Press
1
2 3
Qu’est-ce que vous voyez d’abord?
• CRAP donne des indices sur la façon de lire le graphique
Robin Williams Non-Designers Design Book, Peachpit Press
title
subtext
three points
main point sub point
The design of everyday things (Norman, 1990)
Les objets quotidiens reflètent les problèmes de conception des interfaces
Introduit les notions d’affordance, de métaphore, de modèle conceptuel
Donne des règles de
conception
Métaphore Transfert d’une relation d’un ensemble
d’objets vers un autre ensemble d’objets
Affordances
Contraintes Nos modèles conceptuels de la physique et
la mécanique nous permettent à prédire et simuler l’opération des objets
Mappings Ensemble de relations possibles entre les objets
- Contrôle (widget) et résultat - Liée au feedback et causalité
Causalité (et feedback) L’état du système juste après une action est perçu
comme le résultat de l’action - interprétation du feedback
Principes de Norman (1990)
1. Rendre les choses visibles On peut connaître l’état d’un système en observant l’interface
2. Principe du mapping
3. Principe du feedback Informer l’utilisateur
Principes de Conception (Norman)
1. Visibilité : Puis-je le voir? 2. Feedback : Qu’est ce que ça fait? 3. Affordances : Comment je l’utlise? 4. Mapping : où suis-je où puis je aller? 5. Contraintes : Qu’est ce que je ne
peux pas faire? 6. Consistance (métaphore): Je crois
avoir déjà vu ça avant?
Related Documents
