Définir l'UI Design

Présentation de l'Interface Utilisateur (UI)
La place de l'UI au sein de l'UX
Les éléments de l'UX-UI
Le rôle de l'UI Designer

Comprendre l'interaction avec une interface

Les différents types d'interface
L'interaction selon les interfaces
L'évolution de l'IXD

Quid du “goût” en UI ?

Le goût
Le nombre d'or et la suite de Fibonacci
La règle des Tiers
Quid du “mauvais goût” ?

Atelier : Voir et formuler un besoin
Atelier : Formuler de premières idées à partir d'une carte d'empahie
Atelier : Atelier d’idéation basé sur la refonte d’un site web
Atelier : Réflexion projet fil rouge UI

Réfléchir et penser une interface

Les 10 principes de Nielsen
La psychologie cognitive
Les grilles de mise en page
Adaptative ? Responsive ? Mobile-first ?
L'affordance

Développer une interface 

Le six-to-one
Le crazy 8
Le design studio
Le maquettage

Prototyper avec Figma

Manipuler Figma
Les plugins Figma

Atelier : Projet fil rouge - Mise en place des premiers éléments UI sur Figma

Bonnes pratiques et notions d'accessibilité

Les guidelines
Les polices
Les couleurs
Focus : La psychologie des couleurs
L'iconographie
L'accessibilité
Les critères de Bastien et Scapin
La ligne de flottaison
Les gestes de navigation

Exemples de standards

Multiples de 8
Boutons
Grilles de mise en page web
Grilles de mise en page mobile
Grilles de mise en page tablette

Types d'éléments d'interface

Lexique
Déroulé des différents types d'éléments d'interface + exemples
Vocabulaire complémentaire

Atelier : Projet fil rouge - Figma Wireframe basse fidélité puis prototype graphique

Design system

Qu'est-ce qu'un Design system ?
Exemples d'éléments à fournir
Étapes que je conseille

Réaliser un audit UI / UX

Qu'est-ce qu'un audit UI / UX ?
Connaître sa cible
Focus : Les personas
Définir les objectifs de l'audit
Etablir un plan d'action
Réaliser l'audit

Atelier : Audit d'un produit - service - système

Au-delà de la conception

Les logiciels de prototypage
Mettre en avant ses projets UI
Réaliser et maintenir sa veille
Les challenges UI

Atelier : Projet fil rouge - Figma Faire évoluer son wireframe en prototype interactif

Notions complémentaires

Concevoir une application mobile
Le design persuasif
Le design éthique