Ergonomie & design web

INTRODUCTION À L’ERGONOMIE

Définitions et objectifs

• Interface Homme-Machine (IHM)
• Perception, cognition, utilisabilité
• User Experience (UX), flow

Idées reçues

• Quiz sur les 10 idées reçues de l’UX Design

Centré utilisateur : l’être humain

• Théories de la Gestalt
• Loi de Fitts – Nombre de Miller / Loi de Hick
• Affordance – Visibilité et lisibilité

DÉMARCHE ERGONOMIQUE

Les 5 plans

• De la stratégie à la réalisation

Stratégie

• Objectifs
• Personas
• Analyse concurrentielle

Spécifications fonctionnelles et stratégie de contenu
Interactions et architecture de l’information

• Attentes de l’internaute
• Différentes navigations
• Architecture : lister, regrouper, structurer
• Plan du site

Design d’information – Design de navigation et d’interface

• Lecture et écriture sur le Web
• Zoning, Wireframes et maquette dynamique
• Grid design : une grille pour structurer spatialement
• Responsive design (adaptatif) : internautes, tablonautes et mobinautes
• Outils de wireframes et prototypage (Figma…)

Design visuel

• Tendances – Composants d’interface

FIGMA

• Création d’un plan de site, d’un wireframe et d’une maquette
  dynamique avec Figma (version gratuite)