Badge Webflow Award Winner 2023

Nouveautés Figma Juin 2022 : widgets, API, partenariat Google

Publié le 
24/7/2022
Modifié le 
24/3/2023
Temps de lecture : 5 min
logo figma avec des exemples de widget sur fond blanc
Écrit par
Thomas Labonne avec un T-shirt Digidop

Thomas Labonne

Co-fondateur

Juin 2022 a été marqué par de nombreuses nouveautés pour Figma. Nous reprenons dans cet article les principaux changements de l'outil : intégration des widgets, nouvelle doc API, partenariat avec Google, nouveaux plugins.

Points clés à retenir

Figma ne cesse d'accélérer les sorties de nouvelles fonctionnalités, mises à jour de modules existants, développements de partenariats.

Faisons le point sur les nouveautés Figma du mois de Juin 2022.

3 plugins Figma à tester à la fin de l'article !

Intégration des Widgets à Figma !

plusieurs widgets figma posés sur le canva

Déjà présents sur FigJam depuis les nouveautés de la Config 2022, c'est à présent les fichiers Figma qui pourront accueillir des widgets ! L'intégration de widget à Figma se traduit par des dizaines de fonctionnalités supplémentaires qui permettront de mieux collaborer, travailler en temps décalé, connecter vos outils et intégrer des workflows depuis vos designs.

Les Widget sont des outils interactifs que l'on peut facilement glisser / déposer sur le canvas Figma. Contrairement aux plugins que l'on peut essentiellement utiliser seul pour un besoin précis, les widgets ont l'avantage d'être collaboratifs. Vous, votre équipe, et toutes les personnes présentes sur le fichier pourront ainsi les utiliser pour faire évoluer la maquette en live.

Découvrez tous les widgets Figma

Quelques widgets cool qu'on a tester et qui pourraient vous servir !

Widget Figma : Voice Memo

Laissez des messages vocaux directement sur le canvas. Idéal pour faire des feedbacks et travailler en décalé !

Tester Memo

Widget Figma : Approve

Fini les pastilles vertes, rouges, oranges sur les maquettes ! Approve est un simple bouton avec deux statuts "Revision" et "Approved". Placez ce bouton prêt d'une section ou d'une maquette pour la faire valider par votre équipe ou client. Un simple clic sur le bouton vous permet de passer d'un statut à l'autre. D'autres widgets proposent également cette fonctionnalité comme RAG Status, Checkbox, Status.

Tester Approve

Widget Figma : Notion ticket

Connectez Notion à Figma avec le plugin Notion ticket ! Vous pourrez facilement ajouter des nouvelles cartes Notion à votre maquette, intégrer une description, rattacher une personne et indiquer le statut. Un widget qui facilitera la vie d'un grand nombre d'utilisateurs de Notion !

Tester Notion ticket

Widget Figma : Simple vote

Compliqué de vous mettre d'accord ou de regrouper tous les feedbacks au même moment ? Laissez simplement la possibilité à vos équipes de voter pour trancher. Le plugin Simple vote est un bouton que vous pouvez positionner à côté de plusieurs designs différents. Il suffira tout simplement de cliquer dessus pour voter.

Tester Simple vote

Widget Figma : Asana

Sur le même principe que Notion ticket, le plugin Asana vous permet de directement connecter l'outil à vos fichiers Figma. Des fonctionnalités simplifiées vous permettront ainsi de faire évoluer en live vos projets Asana depuis vos maquettes : créer une nouvelle tâche, définir une deadline, tagger des personnes, gérer des projets, etc.

Tester Asana

Intégration des components, widgets et plugins à la barre d'outils

barre d'outil figma avec outil plugins sélectionné et plusieurs plugins affichés

Enfin plus besoin d'aller chercher vos plugins en faisant un clic droit ou de vous rendre sur tous les plugins pour en installer de nouveaux ! Figma vient presque de résoudre un problème d'accessibilité avec cette nouvelle fonctionnalité. Vous pourrez maintenant retrouver tous vos plugins, widget et composants depuis la barre d'outils. Un nouveau bouton a été ajouté pour simplifier l'accès à ces fonctionnalités.

  • Coté Plugins : installer et lancer des plugins en deux clics
  • Coté Widgets : intégrez n'importe quel widget par simple glisser déposer
  • Coté Components : glissez déposez n'importe quel component de vos fichiers

Nouvelle documentation API

capture d'écran de la documentation API de Figma

Figma revoit sa documentation API en la simplifiant. L'objectif est de démocratiser son utilisation auprès des développeurs. Pour résumer en 3 points cette refonte :

  • Nouvelle navigation dans la doc
  • Plus de ressources
  • Possibilité de copier du code facilement

L'API Figma sert par exemple à la création de plugin, widget, etc.

En savoir plus sur l'API Figma

Lancement d'un partenariat avec Google

capture d'écran d'un post twitter de sundar pichai pour annoncer le partenariat google figma

Figma a pour vocation de démocratiser le design, notamment pour les nouvelles générations. Pour ce faire, Figma et Google ont développé ce partenariat directement sur Chromebook. Un outil très populaire et utilisé par les étudiants pour l'apprentissage. Les licences Figma seront ainsi proposées gratuitement et pourront être gérées depuis les  Google Admin Console.

Accédez gratuitement à Figma pour étudiants et enseignants

De nouveaux plugins

capture d'ecran du plugin figma supa palette avec des couleurs bleu et violet

Plugin Figma : Supa Palette

Les couleurs... Un enjeux de taille pour tous designers ! Créer une palette de couleurs originale, n'est pas toujours une tache facile. Entre harmonie des couleurs, accessibilité, goûts, etc. difficile de faire un choix.

Supa Palette est un plugin tout en un qui vous aidera à trouver, créer, faire évoluer les couleurs de vos designs et de votre charte graphique. L'outil vous propose de nombreuses fonctionnalités pour répondre à des besoins divers :

  • 8 modes de couleurs (RGB, LRGB, HSL, HSV, etc.)
  • Test d'accessibilité WCAG et APCA
  • Générateur de palette de couleurs
  • Color system
  • etc.

Tester Supa Palette

Plugin Figma : Perspective Toolkit

Donnez de la perspective à vos éléments Figma avec ce plugin ! Figma en 3D, c'est possible finalement.

Tester Perspective Toolkit

Plugin Figma : Illustrations

Plus de 120 illustrations en format SVG à intégrer gratuitement sur vos maquettes Figma !

Tester Illustrations

projet Flomodia by Digidop
projet Coudac by Digidop
projet Heka by Digidopprojet Flaw by Digidopprojet Morfo by Digidop