ERGONOMIE DES INTERFACES (UI) ET EXPÉRIENCES UTILISATEUR (UX) - 4 jours (28h) - en présentiel ou à distance

Appliquer la méthodologie UX (expériences utilisateur).
Acquérir les notions essentielles d’ergonomie des interfaces (UI).
Prototyper des applications ou des sites Web avec Adobe XD.

Le design d’expérience utilisateur est un travail réalisé dès la conception sur la qualité de l’expérience vécue lors de l’usage d’un site web, d’une application mobile ou tout autre élément demandant une navigation de l’utilisateur.

PRÉSENTATION ET FONDEMENTS DE L’UX DESIGN
PRÉSENTATION DE L’UX / UI
- Préambule
- Quels intérêts ?

LES INTERFACES ERGONOMIQUES
- Sites Web
- Sites mobile
- Intranets
- Écrans tactiles

ORGANISER L’INFORMATION
- Checklist d’évaluation
- Étudier les pratiques par écrans
- La page d’accueil

CONCEVOIR LE SYSTÈME DE NAVIGATION
- La conception centrée utilisateur
- Bonnes pratiques et recommandations

SAISIES ET FORMULAIRE
- Étudier les informations
- Analyse des points de blocage et déclencheurs
- Adaptation des parcours
- Principes d’utilisabilité

LANGAGE HOMME-MACHINE
- Feedback, Affordance et Mapping
- Guidage et découverte progressive
- Prévenir l’erreur
- Construire la narration

MISE EN AVANT DU CONTENU
- Wireframes
- Famille d’interface
- Design pattern
- Orienter l’interface
- Structure de la page et le header
- La Navigation
- Le Fil d’Ariane
- Éléments d’interface
- Approche ludique du formulaire

L’APPROCHE
LES PERSONAS
- Définition
- Impact des personas sur l’interface
- Plusieurs personas
- Exemples de personas

PROTOTYPAGE
Le prototypage nous permet de dessiner la structure d’information et les parcours utilisateurs en phase de conception.
- Usage du prototypage dans un projet
- Évolution du prototypage : Zoning / Wireframe / Mockup
- Panorama des outils en ligne/hors ligne, gratuit/payant, desktop/mobile
- Organisation du livrable

UTILISATION D’ADOBE XD
- Préambule
- Les possibilités
- L’espace de travail
• les outils
• les écrans
• le plan de travail
• les raccourcis
- Import / Export
• importer depuis d’autres logiciels
• exporter en plusieurs formats
- Concevoir un prototype interactif
• liens interactifs entre écrans
• prévisualisation

LA DÉMARCHE COMPLÈTE
Démarrage du projet :
- Analyse du brief/données et Analytics si site existant
- Qualification des utilisateurs
Pratique :
- Prototype
- Réalisation des wireframes
- Création des contenus
Analyse :
- Test
- Outil de recueillement de données
- Lecture des données recueillies

MISE EN OEUVRE
À partir d’un projet existant en phase de développement, réaliser l’étude complète de l’UI et l’UX jusqu’à finalisation complète de la phase de préparation du projet.