fermer
Outils de développement

Figma ajoute de nouveaux outils de développement pour aider les designers et les développeurs

a313056d03f6e2734d587ee87c5a38c23936f8e5 5569x3132 1 scaled
Figma ajoute de nouveaux outils de développement pour aider les designers et les développeurs

L’éternelle lutte entre les rêves d’un designer et la réalité d’un développeur pourrait bientôt devenir un peu plus facile si Figma a son mot à dire. L’équipe à l’origine du célèbre outil de conception d’interface utilisateur a dévoilé un ensemble de nouvelles fonctionnalités destinées à rapprocher « la conception et le développement ».

Annoncé à ConFig 2023, le Dev Mode de Figma a été créé pour simplifier et accélérer les transferts entre les designers et l’équipe de développement, en leur permettant de travailler ensemble sur les mêmes fichiers tout en étant dans des modes différents.

Et ce n’est pas la seule fonctionnalité du logiciel de conception Web destinée à attirer les équipes de développement plus profondément dans l’écosystème Figma, alors que la société accélère ses conceptions pour construire un outil de développement de produits de bout en bout.

Le nouvel espace de travail est la première étape franchie par l’entreprise pour rapprocher deux mondes très différents. Figma a déclaré que lorsqu’il s’agit d’utilisateurs payants, les développeurs sont plus nombreux à visiter le site de maquettes que les designers, apportant avec eux un nouvel ensemble de workflows préférés que le Dev Mode est conçu pour prendre en compte.

2a32995868b3c48e1ce6d97d0cfb7374dd315850

Dev Mode est décrit comme « un inspecteur de navigateur pour votre fichier de conception, et il rapproche les concepts de conception — formes, couches et groupes — des concepts de développement tels que le code, les icônes et les jetons ».

De multiples outils disponibles

Les utilisateurs ont accès à un modèle de boîte CSS, à une syntaxe moderne avec une vue arborescente et à la possibilité de passer d’une unité de dimension à l’autre pour s’adapter à la base de code. Le mode ajoute également la prise en charge des plugins (utile pour ceux qui travaillent avec Jira et Github), et l’option d’inspecter les fichiers dans Figma pour VS Code, l’outil de développement Web et l’éditeur de texte de Microsoft.

d7030ef1a5de0aecccce8aa8b0fb5ddf057acaf2 1560x1248 1

Les variables et le prototypage avancé font également leur entrée dans Figma. Les variables sont essentiellement des jetons de conception — l’idée est de rationaliser la création et la maintenance de plusieurs marques, thèmes et appareils. Vous avez besoin de créer des modes clair et foncé pour une application, par exemple ? Les variables simplifieront ce processus auparavant complexe.

Le prototypage avancé, quant à lui, offre un moyen plus efficace de construire et d’itérer des designs dans le logiciel de conception graphique basé sur le Web en utilisant des fonctionnalités telles que la logique conditionnelle, les expressions mathématiques et les variables.

6442cd54f29583facd35ba015239e98e5a5e5162

« Avec moins de frameworks et de connexions, il est plus facile d’améliorer l’expérience de conception rapidement et souvent sans faire des allers-retours entre des outils ou des fenêtres distincts », a déclaré la société, ajoutant qu’elle « supprime la friction entre la conception visuelle et interactive afin que les équipes puissent voir davantage de leurs conceptions prendre vie ».

Tags : ConFig 2023Figma
Yohann Poiron

The author Yohann Poiron

J’ai fondé le BlogNT en 2010. Autodidacte en matière de développement de sites en PHP, j’ai toujours poussé ma curiosité sur les sujets et les actualités du Web. Je suis actuellement engagé en tant qu’architecte interopérabilité.