Vous dupliquez encore vos maquettes pour gérer une version claire et une version sombre ? Vous passez un temps considérable à ajuster manuellement vos écrans pour le mobile, la tablette et le desktop ? Les variables Figma résolvent ces deux problèmes grâce à une seule et même fonctionnalité. Cette formation vous propose une méthode éprouvée pour construire des interfaces qui basculent en un clic entre light et dark mode, et qui s’adaptent à toutes les tailles d’écran sans dupliquer le moindre composant.

Votre formateur

May Navarro
Formatrice UX, UI & IA
Voir le profil
Designer depuis 20 ans (Ikea, SNCF, Starbucks, etc.), formatrice depuis 10 ans (Le Wagon, Ynov, l'école de design de Nantes, Ubisoft, etc.), je partage avec vous ma passion pour le webdesign avec un enthousiasme communicatif.

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.

Programme

Première demi-journée : comprendre et construire avec les variables figma

  • Comprendre les variables Figma : découverte des quatre types de variables (couleur, nombre, string, booléen), organisation en collections et gestion des modes.
  • Construire une palette de couleurs avec des variables : création d'alias, configuration des modes light et dark pour une gestion centralisée des couleurs.
  • Cas pratique - palette et bascule light/dark : créer une collection de couleurs et faire basculer un set de composants existant entre mode clair et mode sombre.

Deuxième demi-journée : variables numériques, composants et responsive design

  • Variables numériques pour l'espacement, le dimensionnement et les rayons d'angle : structurer et centraliser les valeurs de mise en page à l'aide de variables numériques.
  • Lier les variables aux propriétés des composants : appliquer les variables aux propriétés de padding, gap, corner radius, couleurs de texte et de fond pour des composants entièrement pilotés par variables.
  • Construire un système responsive avec variables et Auto Layout : combiner les modes de variables et l'Auto Layout pour créer des déclinaisons mobile et desktop sans duplication.
  • Cas pratique - interface responsive et multi-mode : concevoir un écran (carte ou interface) qui s'adapte automatiquement entre mobile et desktop tout en basculant entre light et dark mode.
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

UX/UI designers, product designers et design system managers souhaitant structurer leurs interfaces. Graphistes en reconversion vers le digital, développeurs front-end désireux de comprendre la logique des design tokens. Freelances et étudiants en design intéressés par les bonnes pratiques de conception scalable.

Prérequis

Une connaissance de base de l’interface Figma est nécessaire : manipulation des calques, des frames et des composants. La maîtrise de l’Auto Layout est un plus, mais pas obligatoire — un rappel express est prévu en début d’après-midi. Les participants doivent disposer d’un ordinateur avec accès à internet et d’un compte Figma gratuit (la version web suffit).

Moyens et outils

Moyens

La formation se déroule sur Figma en version web, accessible gratuitement sans installation. Un support de cours au format PDF est fourni à chaque participant. Un fichier Figma d’exercices partagé, incluant un set de composants de départ, est mis à disposition. Des ateliers pratiques guidés en direct alternent avec des corrections collectives pour ancrer les apprentissages.

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.

1 jour - 7 heures

à partir de 1800€ 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

Comprendre le fonctionnement des variables et des modes dans Figma.

Construire une palette de couleurs pilotée par variables pour gérer le light et le dark mode.

Mettre en place des variables numériques pour l'espacement et le dimensionnement.

Lier des variables aux propriétés des composants (couleur, padding, radius, gap).

Concevoir une interface responsive en combinant variables et Auto Layout.

Organiser une collection de variables structurée et réutilisable, sur le modèle des design tokens.

Ce qu’on aime dans la formation

« Les variables sont, à mes yeux, la fonctionnalité qui a le plus transformé ma façon de travailler sur Figma ces dernières années. Une fois la logique comprise, on ne revient plus en arrière : un seul fichier, un seul jeu de composants, et des déclinaisons light/dark ou mobile/desktop qui se font en un clic. En une journée, je vous transmets une méthode concrète pour structurer vos propres variables et gagner un temps précieux sur tous vos projets à venir. »

May Navarro

Questions fréquentes sur la formation Figma de May

Quels outils vais-je utiliser durant la formation ?

Uniquement Figma dans sa version web : aucune installation de logiciel n’est nécessaire, un compte gratuit suffit.

Avec quoi vais-je repartir à la fin de la formation ?

Vous repartez avec un fichier Figma personnel contenant une collection de variables fonctionnelle (couleurs et espacements), les composants light/dark et responsive réalisés pendant la journée, ainsi qu’un support PDF récapitulatif.

La formation est-elle axée sur la pratique ?

Oui, plus de la moitié du temps est consacrée à des exercices guidés et à deux cas pratiques complets, pour que vous puissiez appliquer immédiatement chaque concept abordé.

Ai-je besoin de connaître l'Auto Layout avant cette formation ?

Ce n’est pas obligatoire : les bases indispensables sont rappelées en début d’après-midi, juste avant d’aborder la partie responsive design.

Cette formation couvre-t-elle également les composants et les variants ?

La formation se concentre sur les variables et leur application au light/dark mode ainsi qu’au responsive design. Les composants et les variants sont utilisés comme support des exercices, mais ne font pas l’objet d’un enseignement détaillé — ce sujet est traité dans une formation dédiée.

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
+767 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 1 jour - 7 heures
  • Participants 1 à 6 participants
  • Difficulté Débutant à expert
  • Localisation Présentiel ou distanciel
  • Prix 1800€ 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