Démarrage rapide

Bêta fermée — variable Jar est pour l’instant accessible sur invitation. Rejoignez la liste d’attente pour être informé du lancement et obtenir un accès anticipé.

Le plugin synchronise Figma et variable Jar en un seul bouton. Importez vos variables Figma dans variable Jar pour les modifier comme dans un tableur, suivre leurs références dans le Graphe des tokens et gérer les traductions en équipe — puis synchronisez à nouveau pour renvoyer vos modifications dans Figma.

Étape 1 — Se connecter et relier un fichier Figma

Lancez le plugin variable Jar dans un fichier Figma qui contient des variables. Première fois ? Connectez-vous avec Continuer avec Google ou Continuer avec l’e-mail (code de vérification à 6 chiffres) : votre compte et votre espace de travail personnel sont créés automatiquement, sans inscription séparée.

Le panneau de connexion du plugin — Continuer avec Google ou Continuer avec l’e-mail
Le panneau de connexion du plugin — Continuer avec Google ou Continuer avec l’e-mail
  1. Si le fichier n’est pas encore connecté, l’écran Connecter ce fichier s’affiche.
  2. Choisissez Créer un nouveau projet et saisissez un nom de projet — laissez vide pour reprendre le nom du fichier Figma.
  3. Cliquez sur Créer. Le fichier est connecté et toutes ses variables sont envoyées automatiquement dans le projet.

Si votre équipe a déjà un projet, choisissez Connecter à un projet existant puis sélectionnez l’espace de travail et le projet.

L’écran Connecter ce fichier — Créer un nouveau projet ou Connecter à un projet existant
L’écran Connecter ce fichier — Créer un nouveau projet ou Connecter à un projet existant

Quelqu’un a déjà connecté ce fichier ? Sur l’écran « Déjà connecté », vous pouvez envoyer Demander à rejoindre en tant que traducteur (gratuit) ou Demander une invitation en tant que membre de l’équipe. Une fois la demande approuvée par un propriétaire ou un membre de l’équipe, cliquez sur Vérifier à nouveau pour vous connecter. Toutes les options sont décrites dans la section sur la connexion des fichiers de Synchronisation Figma, et les rôles dans Équipe et rôles.

Étape 2 — Ouvrir la grille Master dans l’application web

  1. Allez sur variablejar.com/app, saisissez votre e-mail et cliquez sur Envoyer le lien de connexion.
  2. Cliquez sur le lien de l’e-mail pour vous connecter — utilisez la même adresse que dans le plugin.
  3. Ouvrez votre nouveau projet depuis la liste des projets : la grille des variables se trouve dans l’onglet Master.
La connexion à l’application web — saisissez votre e-mail et appuyez sur Envoyer le lien de connexion
La connexion à l’application web — saisissez votre e-mail et appuyez sur Envoyer le lien de connexion
La liste des projets — ouvrez un projet pour accéder à son onglet Master
La liste des projets — ouvrez un projet pour accéder à son onglet Master

Étape 3 — Modifier dans la grille

  • Cliquez sur une cellule de valeur pour la modifier. Les chaînes sont du texte, les nombres une saisie numérique, les booléens des interrupteurs, et les couleurs ont un sélecteur ou une saisie hexadécimale.
  • Créez des variables avec le bouton + (Ajouter une variable) : choisissez un type et saisissez un nom.
  • Pour modifier beaucoup de cellules à la fois, voyez la sélection multiple et la saisie par lots dans Utiliser la grille.

Étape 4 — Synchroniser vers Figma

Revenez dans le plugin et appuyez sur Synchroniser.

Le panneau du plugin connecté — nom du projet, heure de la dernière synchronisation et bouton Synchroniser
Le panneau du plugin connecté — nom du projet, heure de la dernière synchronisation et bouton Synchroniser
  • Vos modifications web sont appliquées immédiatement aux Figma Variables, et une notification résume le nombre de modifications synchronisées.
  • Les variables modifiées dans Figma entre-temps sont elles aussi reprises dans le Master.
  • Si la même variable a changé des deux côtés, une notification indique combien de conflits attendent — voyez Synchronisation Figma pour les résoudre.

Pour aller plus loin