Figma dévoile des outils de motion design par IA et de shaders WebGPU
Figma transforme fondamentalement le pont entre le design et le développement en intégrant des capacités d'IA avancées directement dans son canevas principal. Lors de sa conférence annuelle Config, le géant du design a annoncé une suite d'outils haute fidélité, incluant du motion design piloté par l'IA et des effets de shaders, conçus pour automatiser des flux de travail créatifs complexes.
Combler le fossé grâce aux Code Layers et à l'optimisation full-stack
L'un des changements les plus significatifs dans l'écosystème de Figma est le canevas réimaginé, désormais optimisé pour le développement full-stack. L'introduction des « Code Layers » permet aux designers et aux ingénieurs de travailler dans un environnement unifié, effaçant ainsi la frontière entre une maquette visuelle et une base de code réelle.
Les développeurs peuvent désormais cloner des dépôts, générer de nouvelles directions de design à l'aide de l'agent IA de Figma et extraire des flux complexes en couches de design modifiables. Crucialement, ces mises à jour permettent un flux de travail bidirectionnel où les modifications peuvent être synchronisées avec le code. En intégrant des agents IA et des outils de codage dans un espace unique, Figma s'éloigne de son statut de simple outil de prototypage pour devenir un hub central pour l'ensemble du cycle de vie du développement produit.
Motion génératif et animation pilotée par l'IA
Figma s'attaque à l'un des aspects les plus chronophages du design UI/UX : le mouvement. Les nouveaux outils Motion permettent aux équipes de concevoir des animations, des transitions et des transformations 3D de manière collaborative, directement au sein de la plateforme.
Plutôt que de créer manuellement chaque image clé (keyframe) pour chaque mouvement, les utilisateurs peuvent s'appuyer sur une interface de chatbot pour « prompter » des animations. Cette approche alimentée par l'IA permet aux créateurs de décrire une transition — comme un rebond ou un glissement spécifique — et de laisser le logiciel générer l'animation automatiquement. Comme ces ressources de mouvement sont connectées aux design systems et reposent sur du code, elles sont « prêtes à l'emploi », réduisant considérablement les frictions lors du passage de relais entre le design et l'ingénierie front-end.
Visuels haute fidélité via les shaders WebGPU
Repoussant les limites de la fidélité visuelle, Figma a introduit de nouveaux outils de shader alimentés par WebGPU. Cela permet la création de traitements visuels et de remplissages personnalisés qui étaient auparavant impossibles compte tenu des contraintes de l'outil.
Les utilisateurs peuvent désormais utiliser des prompts pour construire des effets de shader complexes, tels que le dithering, la pixellisation et des types de flou sophistiqués, directement sur le canevas. Cette capacité permet aux designers de mettre en œuvre des effets visuels haut de gamme et performants, ancrés dans les standards web modernes. Pour compléter cela, « Figma Weave » propose une suite de plus de 20 outils d'IA intégrés, conçus pour transformer des flux de travail IA complexes et multi-étapes en actions simples et intuitives sur le canevas.
Pourquoi cela est important pour le paysage de l'IA
L'évolution de Figma signale une tendance plus large dans l'industrie : le passage de « l'IA comme assistant » à « l'IA comme moteur intégré ». En intégrant des capacités génératives dans des domaines spécialisés comme le mouvement et les mathématiques des shaders, Figma démontre comment les LLM et l'IA générative peuvent être appliqués à des flux de travail professionnels hautement techniques. Ce développement établit une nouvelle norme sur la manière dont les logiciels créatifs peuvent augmenter l'expertise humaine plutôt que de simplement automatiser des tâches simples et répétitives.
Points clés à retenir
- Flux de travail unifié : Les nouveaux Code Layers permettent aux développeurs de synchroniser les modifications de design directement avec le code, simplifiant ainsi le processus de transfert (handoff).
- Motion génératif : Les designers peuvent désormais utiliser des prompts en langage naturel pour créer des animations et des transformations 3D complexes reposant sur du code.
- Visuels avancés : L'intégration de shaders alimentés par WebGPU permet des effets haute fidélité comme le dithering et la pixellisation via de simples prompts d'IA.