Formation Ergonomie des Interfaces Utilisateur, Design System et UX/UI : Créez des IHM performantes

Programme de la formation
Ergonomie des Interfaces Utilisateur, Design System et UX/UI : Créez des IHM performantes

• Introduction à l'UI/UX Design et à l'ergonomie des IHM

  - Définition UI, UX, IHM, et leurs différences
  - Rôle de l'UI/UX Designer dans un projet digital
  - Importance de l'ergonomie pour l'expérience utilisateur
  - Comprendre les attentes et comportements des utilisateurs

• Principes fondamentaux de l'ergonomie des interfaces

  - Lois de Fitts, Jakob Nielsen, et Gestalt
  - Les 7 principes de Don Norman (Affordance, Feedback, etc.)
  - Constance et cohérence visuelle et fonctionnelle
  - Accessibilité numérique (Critères WCAG 2.1)

• Le processus de conception UI/UX

  - Cycle de vie d'un projet UI/UX (Recherche, Définition, Idéation, Prototypage, Test)
  - Méthodologies agiles appliquées à l'UI/UX
  - Place de l'UI dans la conception centrée utilisateur (CCU)
  - Collaboration avec les équipes techniques et produit

• Analyse et recherches utilisateurs pour l'UI

  - Méthodes de recherche (interviews, sondages, focus groups)
  - Création de personas et de parcours utilisateurs (User Journey)
  - Analyse de la concurrence et bonnes pratiques UI
  - Définition des objectifs UI en lien avec les besoins utilisateurs

• Wireframing et prototypage basse fidélité

  - Qu'est-ce qu'un wireframe et son utilité
  - Outils de wireframing (Figma, Sketch, Adobe XD)
  - Création de maquettes filaires pour différentes plateformes
  - Prototypage interactif simple pour valider les flux

• Introduction au Design System

  - Qu'est-ce qu'un Design System et pourquoi l'utiliser
  - Composants clés d'un Design System (principes, tokens, composants)
  - Avantages pour la cohérence, l'efficacité et la scalabilité
  - Exemples de Design Systems connus (Material Design, Atlassian)

• Éléments du Design System: Tokens et Composants

  - Définition et création de Design Tokens (couleurs, typographies, espacements)
  - Structuration et organisation des composants UI réutilisables
  - Gestion des états des composants (actif, désactivé, hover)
  - Intégration des icônes et illustrations dans le système

• Typographie et hiérarchie visuelle en UI

  - Choix des polices et combinaisons harmonieuses
  - Création d'une échelle typographique cohérente (Tailles, graisses, interlignes)
  - Gestion de la hiérarchie visuelle de l'information
  - Lisibilité et accessibilité du texte

• Couleurs, images et iconographie

  - Théorie des couleurs et psychologie des couleurs en UI
  - Création de palettes de couleurs UI harmonieuses et accessibles
  - Intégration d'images, illustrations et icônes
  - Utilisation des icônes pour l'intuitivité et la navigation

• Grilles, espacements et mise en page

  - Utilisation des grilles pour une mise en page structurée
  - Gestion des espacements et des alignements (White Space)
  - Principes de mise en page réactive (Responsive Design)
  - Optimisation de la densité d'information

• Prototypage haute fidélité et interactions

  - Réalisation de maquettes UI haute fidélité
  - Ajout d'animations et de micro-interactions
  - Création de prototypes cliquables et testables
  - Outils avancés de prototypage (Figma, Axure)

• Tests utilisateurs et amélioration continue de l'UI

  - Méthodes de test utilisateur (test d'utilisabilité, A/B testing)
  - Collecte et analyse des retours utilisateurs
  - Itérations et ajustements de l'interface
  - L'importance de la veille UI et des évolutions technologiques