Formation UX/UI Design, pour des interfaces Web intuitives et attractives

Ergonomie d’une interface Web

Définition de l’ergonomie
Présentation des critères ergonomiques de Bastien et Scapin
Prise en compte des critères d’accessibilité et de qualité des interfaces Web

Analyse de la cible

Définir les utilisateurs, recenser leurs besoins et envies pour établir les contenus, services et fonctionnalités
Présentation de la technique des personas
Cas pratique : analyse de fiches de personas pour en déduire les scénarios type d’utilisation

Architecture de l’information

Structurer le contenu en fonction des attentes des utilisateurs
Fournir une arborescence du site permettant de trouver rapidement l’information
Présentation de la technique du « Card Sorting » ou tri de cartes
Cas pratique : réalisation d’un tri de carte en groupe puis d’un tri individuel en ligne et analyse des résultats

Conception de l’interface

Permettre à l’utilisateur d’atteindre son objectif : le guider, gérer ses erreurs, réagir à ses actions et lui laisser le contrôle.
Concevoir le système de navigation
Concevoir les éléments d’interaction : saisie et sélection de données, manipulation d’informations affichées,
déclenchement de fonctionnalités et de services
Organiser l’espace : définir clairement les zones (zoning), y placer les éléments d’interface, établir la hiérarchie visuelle
Outil de Wireframe (maquette fil de fer), adaptation aux tablettes et smartphones
Cas pratique : étude d’exemples en ligne, évaluation de l’interface d’un site en ligne à l’aide d’une check-list
reprenant les critères étudiés

Conception graphique

Créer une expérience utilisateur agréable
Choix des couleurs, techniques de mise en évidence, incitation, utilisation des images et icônes
Lisibilité : contraste de couleurs, typographie, interlignage et justification
Cas pratique : construction et évaluation d’une charte graphique

Contenu éditorial

Adapter l’écriture pour être lu
Structurer et hiérarchiser le contenu, liens explicites, images illustrant le contenu
Utiliser les micros-contenus : titre, accroche, chapeau
Règles des 5W et pyramide inversée
Cas pratique : amélioration du contenu éditorial d’un site en ligne

Tests utilisateurs

Déroulement d’un test utilisateur
Définir les scénarios de test
Cas pratique : réalisation d’un test utilisateur, application d’un scénario de test sur un site en ligne