Maîtriser le process et le vocabulaire

Le Design Thinking et l’UX Design puisent leur racines dans des courants pluridisciplinaires parallèles depuis le début des années 60’ (Psychologie cognitive, Anthropologie et ethnographie, Informatique et le design industriel, Ingénierie et Architecture). En 1990, l’agence IDEO, inventeur du Design Thinking, a été la première agence à ‘packager’ la boîte à outils parfaite du designer à destination du business afin de concevoir rapidement des produits ou des services désirables, viables et faisables, c’est-à-dire innovants. 

• Introduction, jargon & méthodologie
• Histoire
• Une boîte à outils et les modes d’application des méthodes
• Argumentaire : pourquoi c’est important ?

Recherche utilisateur

Tout projet commence par une phase de recherche auprès des utilisateurs et des parties-prenantes. Il s’agit d’abord de comprendre les usages, freins, attentes des utilisateurs, mais aussi de les confronter aux contraintes, objectifs avant de proposer des solutions.

Formaliser cette synthèse des besoins est essentielle pour consolider les fondations d’un projet (process, produit, organisation).

• Intégrer le brief et la vision business de la thématique
• Se méfier des préjugés à propos des utilisateurs
• Connaître les méthodes de recherche utilisateur
• Adapter les méthodes de recherche au projet
• Identifier le(s) utilisateur(s) cible(s) : les proto-personas
• Préparer le recrutement des utilisateurs 

Ateliers pratiques de la journée

• Reformuler la définition de l’UX Design
• Reformuler le brief client en questions centrées sur les potentiels utilisateurs
• Évacuer ses préjugés sur les utilisateurs
• Définir ses objectifs de recherche utilisateur

Entretien individuel

L’entretien exploratoire individuel permet de recueillir des informations solides pour comprendre les utilisateurs : leurs comportements, leurs attentes, leurs freins. 

• Préparer sa grille d’entretien 
• Animer un entretien avec un utilisateur, adopter le bon savoir être
• Restituer à son équipe les enseignements de la recherche

Synthèse des entretiens 

Une fois la recherche utilisateur effectuée, plusieurs méthodes permettent de synthétiser les besoins des utilisateurs cibles à travers les grandes étapes de leur parcours. Les méthodes de cartographie de l’UX permettent de représenter visuellement les enjeux de l’expérience et les comportements des utilisateurs. 

• Analyser et restituer les informations collectées
• Le persona comme synthèse de la recherche 
• Synthétiser les composantes clé des utilisateurs : l’empathy Map

Écoconception

L’Écoconception est une composante qui devient essentielle pour aborder tout projet de design numérique. Nous abordons concrètement les implications environnementales d’un projet digital et les marges de manœuvre du designer.

• Définition de l’écoconception 
• Rôle du design et bonnes pratiques 
• Regard critique sur un parcours numérique

Ateliers pratiques de la journée 

• Conception de la grille d’entretien
• Mener un entretien exploratoire
• Restituer les entretiens 
• Concevoir une carte émotionnelle d’une expérience utilisateur 
• Audit d’écoconception d’un parcours digital

Introduction à l’ergonomie des interfaces 

L’ergonomie est l’art de rendre les interfaces simples, confortables et intuitives pour que chaque parcours utilisateur devient naturel.

• Découvrir ce qu’est l’ergonomie des interfaces
• Comprendre les caractéristiques des facteurs humains
• Faire la différence entre les standards et les tendances
• Connaître les critères d’ergonomie pour guider la conception

Faire un audit ergonomique

• Connaître les standards ergonomiques des interfaces courantes
• Auditer votre site via des outils en ligne 

L’accessibilité numérique 

Cela consiste à rendre une interface utilisable par toutes et tous, quels que soient les capacités, contextes ou équipements. Concevoir accessible, c’est inclure davantage d’utilisateurs tout en améliorant l’expérience de chacun.

• Comprendre les enjeux de l’accessibilité
• Intégrer les situations de handicap dans sa réflexion de design 
• Connaître les critères d’accessibilité 
• Savoir auditer l’accessibilité d’un site  

Focus sur l’ergonomie des interfaces mobiles

• Comprendre l’approche Mobile first
• Concevoir pour les interactions tactiles
• Définir la bonne stratégie de conception (App vs. responsive)

Ateliers pratiques

• Audit d’accessibilité 
• Audit ergonomique basé sur les critères de Bastien et Scapin

Lancer la conception avec l’idéation 

L’idéation est la phase où l’on génère, explore et combine des pistes pour résoudre un problème utilisateur. On passe du “quoi” au “comment” en alternant divergence (produire beaucoup d’idées sans autocensure) puis convergence (sélectionner selon impact, faisabilité, accessibilité et contexte).

• Comprendre les enjeux de la créativité collective 
• Maîtriser les règles de collaboration pour la facilitation d’ateliers
• Passer par des phases individuelles et collectives d’idéation
• Prioriser les idées en fonction de la connaissance des utilisateurs
• Définir ses objectifs de prototypage en vue des tests utilisateurs

Co-concevoir une solution 

Améliorer l’engagement et la collaboration entre les équipes grâce à des design workflows plutôt que sur des maquettes

• Ne pas précipiter la réalisation de l’interface
• Mettre en œuvre une succession d’atelier de co-conception
• Prendre des décisions sur le choix des contenus et les fonctionnalités
• Définir le parcours utilisateur
• Rédiger les contenus 
• Dessiner l’interface 
• Construire le prototype à tester

Ateliers pratiques

• Faire émerger les opportunités de design : How might we?
• Idéation : Crazy 8’s
• User flow
• Priority guide (clarifier le contenu)
• Maquette papier d’interface
• Rendre interactif le prototype papier (avec POP by Marvel ou Figma)

Le test utilisateur permet d’observer des personnes représentatives réaliser des tâches sur une interface (maquette, prototype ou produit) pour révéler incompréhensions, frictions et opportunités.
L’évaluation porte sur l’usage réel : ce qui fonctionne, ce qui bloque et pourquoi, afin de prioriser les améliorations et réduire les risques de conception. Durant cette journée, vous serez mis en conditions réelles : vous mènerez des sessions de tests à distance avec de vrais utilisateurs, que vous aurez recrutés spécialement pour évaluer votre projet réalisé en formation.

Tester : pourquoi ? comment ? et après ?

• Comprendre le contexte, les objectifs et enjeux des tests utilisateurs.
• Mettre en place la méthodologie préparatoire.
• Recruter les bons utilisateurs.
• Organiser des Tests Utilisateurs en présentiel.
• Connaître les Tests Utilisateurs à distance.
• Connaître les tests utilisateurs en mode Guerilla, AB testing
• Savoir adopter la bonne posture pour animer un test utilisateur (savoir être)
• Synthétiser les résultats des tests

Ateliers pratiques

• Définition des objectifs de test
• Élaboration du protocole de test
• Rédaction de la grille d’observation
• Animer un test utilisateur
• Analyser les résultats et les restituer

Les fondamentaux du branding et leur rôle en UI Design

• Positionnement et différenciation de marque
• Comprendre pourquoi le branding conditionne les décisions d’interface
• Les briques de l’identité visuelle : logo, couleurs, typographies, formes et iconographie
• Images, illustrations et vidéos au service de l’identité

Prendre en main l’écosystème Figma

• Découverte de Figma Design et FigJam
• Collaboration, idéation et organisation des fichiers

Lire et décoder un brief

• Cerner le secteur et les enjeux à partir d’un brief
• Enrichir sa recherche avec les bons mots-clés
• Réaliser un benchmark ciblé du secteur

Atelier fil rouge : Cadrage & direction créative

• Choix du projet – site vitrine ou application mobile – à partir de deux briefs
• Conception d’un moodboard et définition d’une première intention visuelle
• Réalisation d’un benchmark ciblé

Design émotionnel

• Les trois niveaux du design émotionnel de Don Norman : viscéral, comportemental et réflexif
• Psychologie des couleurs et des formes
• Construire une hiérarchie émotionnelle dans une interface

Construire les fondations d’un projet dans Figma

• Styles de couleurs et hiérarchie typographique
• Grilles, espacements et principes de mise en page
• Poser des fondations graphiques cohérentes et réutilisables

Accessibilité

• Les règles essentielles du RGAA
• Intégrer les principes d’accessibilité dès la conception visuelle

Générer une première maquette avec Figma Make

• De l’idée à une première maquette haute définition
• Découverte d’un workflow de conception par vibe coding
• Générer, affiner et critiquer une proposition par le prompt

Atelier fil rouge : Fondations & première maquette

• Mise en place des styles et fondations du projet
• Génération de premiers écrans via Figma Make
• Itérations et amélioration des propositions par le prompt

Tendances actuelles en UI

• Découverte et analyse des tendances contemporaines
• Développer son regard critique et enrichir sa culture visuelle

Mise en page dans Figma Design

• Structurer et hiérarchiser ses écrans
• Organiser efficacement ses éléments d’interface

Atomic Design et composants

• Comprendre la logique de l’Atomic Design
• Créer, organiser et réutiliser des composants
• Assurer la cohérence entre les différents écrans

Design tactile et responsive

• Concevoir pour différents supports
• Adapter les interfaces aux usages web, mobile et tablette

Produire ses assets UI

• Trouver, créer et décliner des visuels
• Utiliser Figma Weave pour assurer la cohérence entre les différents assets
• Explorer Figma Community et les principales ressources utiles

Atelier fil rouge : Écrans clés & système de composants

• Amélioration et déclinaison des écrans principaux du projet
• Création des composants et adaptation responsive
• Production et mise en cohérence des assets avec Figma Weave

Les micro-interactions comme vecteur émotionnel

• Comprendre leur rôle dans l’expérience et la perception d’une interface
• Donner du feedback, guider et engager l’utilisateur

Prototyper au plus près du réel dans Figma Design

• Créer des interactions et des parcours réalistes
• Faciliter les tests utilisateurs et la projection dans l’expérience
• Travailler le réalisme perçu d’un prototype

Créer des animations avancées avec Figma Motion

• Enrichir ses interfaces par le mouvement
• Concevoir des animations cohérentes avec l’identité et l’expérience

Éco-conception appliquée à la conception visuelle

• Comprendre les principaux enjeux de sobriété numérique
• Identifier les choix visuels ayant un impact sur la conception responsable
• Effectuer une passe d’éco-conception sur une interface

Présenter son travail en lui donnant du sens

• Argumenter ses choix de conception
• Construire un récit autour de son projet
• Créer des slides de présentation efficaces

Atelier fil rouge : Interactions & récit

• Ajout de micro-interactions et d’animations sur les écrans clés
• Passe d’éco-conception sur le projet
• Construction du fil narratif de la présentation

Prototypage interactif avancé

• Finaliser les interactions et le parcours du prototype
• Vérifier la cohérence globale de l’expérience

Collaborer et transmettre aux développeurs

• Les bonnes pratiques de handoff
• Préparer et documenter ses fichiers
• QA : accompagner l’intégration et contrôler la qualité de la réalisation

Design System

• Structuration d’un Design System
• Adapter ses fondations et composants à différents univers de marque
• Comprendre les enjeux du multi-branding

Design-to-code

• Comprendre et lire ce que Figma produit
• Explorer le passage de la maquette au code
• Travailler avec un LLM tel que Claude ou Cursor pour générer du code à partir d’une maquette et de données structurées / JSON

Continuer à progresser

• Comptes à suivre et sites de référence
• Ressources et outils pour développer sa pratique
• Ouverture et débat sur l’évolution du métier et des outils

Atelier fil rouge : Restitution finale

• Finalisation du prototype
• Préparation du handoff
• Finalisation des slides de présentation
• Présentation du projet et restitution collective

Comprendre et définir la problématique

1. Présentation du Système IA du projet : s’approprier les fichiers contexte du client (company-id, users, competitors, guidelines, current-bet) et activer votre équipe d’agents dans le Projet sur Dust.
2. Brief du commanditaire
3. Diagramme d’affinité : Recueillir le brief et le business challenge
4. Business Challenge : Quels problèmes cherche-t-on à résoudre ?
5. Interview : Adapter le script d’interview et mener une interview en binôme
6. Jobs-to-be-done : Synthétiser les insights et enrichir avec les transcripts d’interview sur Gemini Note
7. Sprint Challenge : Reformuler la problématique du Sprint en prenant en compte le besoin principal des clients et les objectifs et freins de l’entreprise, confrontée aux métriques business du client

Ateliers : Co-créer des solutions

1. Benchmark : Analyser la concurrence selon le nouvel angle du challenge, et étendre la recherche avec les analogies avec Perplexity
2. Crazy 8’s : Idéation individuelle sur papier
3. Matrice d’impact :Prioriser collectivement les solutions grâce à des matrices de décision
4. Pitch au commanditaire sur les axes : Inviter le commanditaire à prioriser les solutions
5. Proposition de valeur : rédigée par le groupe
6. Story-board : Définir le scénario général avec les hypothèses à valider par le prototype (J3) pendant les tests (J4)
7. Userflow : prioriser les contenus, tâches sous forme d’une séquence de prompts

Ateliers : Transformer les idées en un prototype MVP avec le vibecoding

1. Priority Guide : définir l’architecture d’information et des contenus du prototype
2. Vibecoding : organiser le flow sous forme de prompts,
3. Prototype interactif haute définition : vibecoding sur Lovable

Les agents activables : @Sora (stress-test et synthèse des tests), @Clara (cohérence du protocole), @Noa (wording des consignes)

Cours sur les tests utilisateurs (quali)

• Contexte et enjeux
• Méthodologie préparatoire
• Recruter les bons utilisateurs
• Organiser des Remote User testing (test distants et comparaison avec le présentiel)
• User testing (1-to-1 / focus group / guerilla)

Atelier : Tester le MVP

1. Protocole de test : rédiger les consignes et adapter sa posture au cours du test
2. Tests blancs : tester votre prototype entre les groupes
3. Tests à distance : Animer 2 à 3 tests utilisateurs par groupe, enregistrés par @Sora
4. Debrief à chaud : synthétiser les retours selon les critères de compréhension, utilisabilité, appétence

Atelier : Priorisation et restitution

1. Start Stop Continue : prioriser ce qui a marché et ce qui n’a pas marché
2. Document de Restitution : préparer en équipe ses recommandations
3. Répétition générale : pitcher face au commanditaire simulé avant la restitution
4. Restitution orale de chaque groupe auprès du commanditaire
   • Justifier les recommandations en tant qu’équipe projet,
   • Présenter le prototype et les résultats des tests utilisateurs,
   • Recommander les améliorations possibles et axes stratégiques au client,
   • Présenter les bénéfices de l’approche centrée utilisateur
   • Expliquer la méthode du Design Sprint
   • Rassembler tous ces éléments pour commencer à créer un portfolio

• Introduction à la philosophie agile : valeurs et principes du Manifeste Agile.
• Panorama des cadres agiles contemporains : Scrum, SAFe, Lean/Produit, Shape Up, Triforce, logiques et contextes d’usage.
• Focus Scrum : rôles (Scrum Master, Product Owner, développeur·euse·s, designer·s), rituels (sprint planning, daily, review, rétrospective), artefacts (product backlog, sprint backlog, increment).
• Ce que l’agilité n’est pas : les dérives courantes à identifier.
• Introduction aux impacts de l’IA sur les cérémonies agiles.

Exercices pratiques

• Auto-évaluation des connaissances
• Cartographie des cadres agiles (avantages, limites, impacts pour le design)
• Diagnostic d’une équipe produit fictive

• Le rôle du Product Designer dans une équipe agile : périmètre, responsabilités, contribution.
• Les différences et complémentarités entre Product Owner et Product Manager et leurs implications pour le/la designer selon les organisations. 
• Ce que l’IA redistribue et ce qui reste irremplaçable côté designer
• La rétrospective comme levier stratégique pour faire évoluer sa place dans l’équipe. 
• Dette UX : définition, identification, priorisation, outil de légitimité autant que de qualité.

Exercices pratiques

• Répartition de tâches PM / PO / Product Designer
• Analyse critique d’une synthèse générée par IA
• Simulation de brief produit ambigu avec fiches de rôle product manager et product designer

• Recherche utilisateur en contexte agile : formats “light” et arbitrage de l’effort
• Sprint de discovery : définition, intégration dans le backlog, négociation avec le produit
• Construction d’insights actionnables : du verbatim à la recommandation
• Présentation des résultats en contexte de sprint (grooming, planning)
• Intégration de la voix des utilisateurs dans les rituels produit
• Modèles de backlog UX et organisation du travail design
• Introduction à Jira : rendre visible le travail du design
• Usage de l’IA pour accélérer la synthèse, avec un regard critique

Exercices pratiques

• Construction d’un insight board à partir de données (verbatims, analytics, support)
• Utilisation critique de l’IA pour la synthèse
• Simulation de présentation en grooming

• Le Design system comme infrastructure critique en contexte IA : composants, tokens, cohérence
• Lien entre design system et qualité des outputs générés par IA
• Accessibilité intégrée dès la conception : WCAG, FALC, heuristiques
• Intégration de l’accessibilité dans les design systems et les prompts IA
• Principes de RAG et de prompt system appliqués au design
• Figma Dev Mode : évolution du handoff et des spécifications
• Outils de génération de code (ex : Cursor) et impacts sur la collaboration
• Revue UX et recette graphique en contexte agile

Exercices pratiques

• Exercice comparatif avec et sans design system
• Exercice de rédaction d’un prompt system avec heuristiques d’accessibilité
• Simulation complète de handoff designer/développeur·euse 
• Revue UX et recette graphique

• Échanges avec un Product Designer expérimenté sur la réalité du métier et ses pratiques quotidiennes.
• Analyse et décryptage du marché de l’emploi en Product Design.
• Conseils et méthodologie pour valoriser ses compétences dans un portfolio.
• Accompagnement guidé pour préparer sa recherche de poste et réussir sa transition professionnelle.