Votre produit grandit, vos équipes aussi, et il est temps de poser des bases communes : une bibliothèque partagée, des couleurs et des espacements harmonisés, des composants que tout le monde peut réutiliser facilement.

C’est exactement ce que nous construisons ensemble en deux jours. Vous repartez avec les fondations de votre propre design system dans Figma : des composants souples, des variables pour piloter couleurs et espacements, des modes thématiques, et une méthode simple pour partager tout cela avec vos équipes et vos développeurs. On avance à votre rythme, sur votre vrai produit, avec des livrables utilisables immédiatement.

Votre formateur

Marie Gautheron
Formatrice UX Design & Brand designer
Voir le profil
Marie Gautheron est Head of Design et product designer senior. Après avoir dirigé le design et le produit d'AdopteUnMec, elle aide les entreprises à scaler leur production design et à garder un produit cohérent quand les produits et les équipes grandissent.

Programme adaptable à vos besoins

Un socle complet que votre formateur personnalise selon vos priorités, avec des exercices pratiques réalisés directement sur vos sites, campagnes ou projets web.

Jour 1

Cadrer et structurer son design system

matin
  • Ce qu'est un design system : comprendre son organisation, des fondations aux composants en passant par les patterns et les gabarits d'écran, et son rôle de référence commune pour les équipes.
  • État des lieux de l'existant : passer vos écrans en revue pour identifier les éléments récurrents et définir les priorités de structuration.
  • Organisation des fichiers et des bibliothèques : mise en place d'une structure multi-fichiers, gestion des pages et définition des conventions de nommage.
  • Cas pratique - l'architecture de votre système : audit de vos écrans réels et construction de l'arborescence de votre design system.

Construire des composants solides et réutilisables

après-midi
  • Composants, variants et propriétés : concevoir des composants flexibles capables de couvrir de multiples cas d'usage sans prolifération inutile.
  • Instances imbriquées et slots : exposer les bonnes propriétés pour rendre les composants véritablement réutilisables dans tous les contextes.
  • Auto layout avancé : maîtriser les contraintes et les comportements responsives au service de la réutilisation des composants.
  • Cas pratique - un bloc formulaire complet : construire un ensemble de champs et de boutons avec tous leurs états (par défaut, survol, focus, saisie, désactivé, erreur, succès) en exploitant variants, propriétés et slots. Ce bloc servira de fil rouge pour le jour 2.
Jour 2

Design tokens et variables Figma

matin
  • Les design tokens : comprendre leur rôle et leur périmètre, couvrant couleurs, typographie, espacements et rayons d'angle.
  • Variables et collections Figma : mettre en place vos tokens et les organiser en couches cohérentes au sein de votre système.
  • Les modes : comprendre et utiliser les modes Figma pour gérer thème clair et sombre, ou plusieurs identités de marque, depuis une seule et même bibliothèque.
  • Cas pratique - les tokens de votre marque : créer vos collections de couleurs et d'espacements, les appliquer au formulaire construit la veille, puis le faire basculer en mode clair et sombre sans modification manuelle.

Partager, faire évoluer et transmettre aux développeurs

après-midi
  • Publier et versionner sa bibliothèque : diffuser les mises à jour à toutes les équipes de façon maîtrisée, sans mauvaise surprise.
  • Faire évoluer le système : définir qui contribue, comment et selon quelles règles, pour éviter les doublons et maintenir la cohérence.
  • Préparer le relais vers les développeurs : exploiter le Dev Mode, rédiger une documentation claire et exporter des tokens directement exploitables côté développement.
  • Cas pratique - la mise en service : publier votre bibliothèque, simuler une mise à jour propagée et documenter le formulaire pour vos développeurs (états, tokens, comportements).
Formation personnalisable sur demande.

Un échange avec votre formateur définira le programme et les exercices dont vous avez besoin, alignés sur vos objectifs professionnels.

À qui s’adresse la formation ?

Public

Designers UI/UX et product designers, lead designers, intégrateurs et développeurs front-end travaillant sur des maquettes, responsables produit techniques, studios et agences, équipes design de startups et de PME souhaitant structurer leur production et gagner en cohérence visuelle.

Prérequis

Une pratique régulière de Figma est indispensable : maîtrise des frames, de l’auto layout, des composants simples et des styles. Cette formation n’est pas une découverte de l’outil, le rythme est soutenu et les deux journées sont denses. Un environnement graphique existant est un atout. Chaque participant doit disposer d’un ordinateur connecté et d’un compte Figma. Un échange préalable de 15 minutes permet de vérifier l’adéquation du niveau du groupe.

Moyens et outils

Moyens

La formation alterne démonstrations en direct et exercices pratiques réalisés sur votre propre produit, avec au minimum deux exercices par séquence et une correction commentée. Un fichier Figma de démarrage est fourni pour ne pas partir de zéro. Les cas pratiques s’enchaînent en fil rouge sur les deux jours autour d’un bloc formulaire issu de votre produit réel. Un support de cours PDF téléchargeable est remis à chaque participant.

Tarifs des formations

En présentiel ou distanciel, la formation s’organise dans vos locaux, dans un lieu loué pour l’occasion ou en visioconférence, selon vos préférences.

2 jours - 14 heures

à partir de 2500€ HT

Prêt à vous former ?

Demandez votre devis, de la demi-journée au format sur-mesure.

Obtenir un devis Réponse dans les 24h

Ce que vous apprendrez

Auditer sa production existante et poser l'architecture de son design system.

Créer des composants solides et réutilisables en exploitant variants, propriétés et slots.

Mettre en place des design tokens grâce aux variables Figma.

Utiliser les modes Figma pour gérer plusieurs thèmes ou plusieurs identités de marque.

Publier, versionner et faire évoluer une bibliothèque partagée entre plusieurs équipes.

Préparer le handoff vers les développeurs via le Dev Mode, la documentation et les tokens exportables.

Ce qu’on aime dans la formation

« Un design system, c’est un peu comme ranger une cuisine partagée. Tant qu’on est seul, on retrouve ses affaires. À plusieurs, si chacun range les assiettes dans son coin, il y en a partout et on finit avec 34 assiettes différentes.
On passe deux jours à décider ensemble où vont les choses, à construire vos premiers éléments et à les rendre faciles à retrouver et à utiliser. Rien de spectaculaire, mais après, ça change le quotidien de tout le monde. »

Marie Gautheron

Questions fréquentes sur la formation Figma Design System de Marie

Faut-il déjà avoir un design system pour suivre la formation ?

Non, c’est même souvent le point de départ. On part de vos écrans actuels, quels qu’ils soient, pour construire les premières fondations ensemble.

Va-t-on travailler sur notre vrai produit ou sur un exemple générique ?

Sur le vôtre. Vous repartez avec les premières briques de votre propre design system, directement applicables à votre contexte.

Dois-je installer un logiciel avant la formation ?

Non, Figma fonctionne entièrement dans le navigateur. Il suffit de créer ou de vérifier votre compte avant la session.

Un compte Figma payant est-il nécessaire ?

Certaines fonctionnalités comme les variables et la publication de bibliothèque dépendent du plan Figma de votre organisation. Un point est fait ensemble lors de l’échange préalable.

Avec quoi vais-je repartir à l'issue des deux jours ?

Les premières fondations de votre design system dans Figma, un fichier de démarrage, un support PDF et des mémos pratiques réutilisables au quotidien.

alfie, votre organisateur de formations au marketing digital

Nos formations vous apportent plus que de la simple théorie : astuces pour aller plus vite, études de cas, inspirations, bonnes pratiques du moment ou encore le résultat de notre veille.

4.85
Basé sur 203 avis
+2600 Apprenants
+794 Formations sur-mesure

Vous former avec alfie :

  • Des formateurs sélectionnés pour leur expertise métier et expérience du terrain.
  • Des programmes sur-mesure, grâce à un brief complet entre vous et votre formateur.
  • Un apprentissage par la pratique, pour mettre en application directement.

Financer sa formation

Les formations alfie sont finançables jusqu’à 100% par les OPCO, l’organisme financier des salariés du privé. Rapprochez-vous de votre RH ou de votre dirigeant avec votre projet de formation pour évoquer le budget OPCO disponible.

Toutes les entreprises sont aussi dans l’obligation de former leur salarié sous quelques manières que ce soit. Elles peuvent donc aussi faire le choix de financer votre formation avec leurs fonds propres.

Si vous souhaitez vous reconvertir, vous pouvez prétendre à un PTP (Projet de Transition Professionnelle) qui permet de réaliser une formation sur une durée longue en maintenant votre salaire et en finançant tout ou partie de votre formation. Le financement peut se faire par le biais de l’OPCO de votre entreprise.

➡️ Simulez votre budget formation !

Si vous êtes Freelance ou Indépendant, alors votre organisme de de financement s’appelle un FAF (Fonds d’assurance à la Formation), auprès duquel vous cotisez.

Il existe différents FAF qui dépendent de votre secteur d’activité. Pour le connaître rapprochez vous de votre expert-comptable ou identifiez la convention collective qui s’applique à votre branche. Vous y trouverez le nom de votre FAF.

Les 3 principaux FAF sont :

  • Le FIFPL : pour les travailleurs indépendants exerçant une activité libérale
  • L’Agefice : pour les dirigeants non-salariés du commerce, de l’industrie et des services
  • Le FAFCEA : pour les artisans non-salariés.

Les formations alfie ne sont pas éligibles au CPF (« Compte Personnel de Formation » désormais appelé « Mon Compte Formation »). Vous ne pouvez donc pas financer les formations alfie avec cette solution.

Les seules exceptions de financement par France Travail sont :

  • Le PTP (Projet de Transition Professionnelle),
  • Le PDC (Plan de Développement des Compétences),

Mais ne sont pas automatiques. Rapprochez-vous de votre conseiller FT pour connaître les financements auxquels vous avez droit.

 

Vous devez vous renseigner auprès de votre organisme d’intérim, qui peut vous faire avoir des droits auprès du Fonds d’Assurance Formation du Travail Temporaire (FAF.TT). C’est un organisme qui permet à tout salarié intérimaire d’accroitre ses performances et son employabilité en fonction des besoins du marché.

Les points forts des formations alfie

Sur-mesure

Votre formateur adapte le contenu et les exercices de sa formation, grâce à un appel téléphonique de 15 minutes avec vous, en amont de la formation.

Pratique & concret

Tous nos formateurs et formatrices s’engagent à réaliser au moins 2 exercices par séquence de formation. Tous consultants en activité, ils vous proposent des études de cas réels.

Aymeric Marquant, Formateur WordPress chez alfie formation
Enguerran Bachelot, Formateur Expert Looker Studio - Data visualisation chez alfie formation

Toujours à jour

Un questionnaire de satisfaction et une étude d’impact à 90 jours remontent vos retours aux formateurs pour actualiser en continu nos modules. Nos sessions sont programmées sous 8 à 10 jours, délai nécessaire aux convocations et formalités.

Finançable

Certifié QUALIOPI, alfie vous permet de faire financer votre formation jusqu’à 100% via les OPCO et vous fournit tous les documents nécessaires à la demande.

  • Durée 2 jours - 14 heures
  • Participants 1 à 4 participants
  • Difficulté Intermédiaire
  • Localisation Présentiel ou distanciel
  • Prix 2500€ HT
Obtenir un devis
4.85 (203 avis)
Des questions ? Appelez-nous : 02 55 99 46 86

Obtenir un devis

⚠️ Nos formations ne sont pas éligibles au CPF.

Brief complet, réponse rapide ! Pensez à inclure :

  • qui doit être formé,
  • quel niveau à l’apprenant sur le sujet,
  • l’objectif de la formation,
  • distanciel / présentiel (et le lieu).

On vous rappelle dans les 24h.

♿ Public en situation de handicap, nous écrire à bonjour@alfieformation.com



    Les informations recueillies à partir de ce formulaire sont traitées par alfie pour donner suite à votre demande de contact et dans le cadre de nos activités de prospection. Pour en connaitre plus sur vos droits et la gestion des données personnelles faite par ALFIE, cliquez sur la politique de protection des données à caractère personnel