Editorial illustration for Figma launches AI motion graphics, shader tools, code layers, and new creative materials
Figma launches AI motion graphics, shader tools, code...
Figma launches AI motion graphics, shader tools, code layers, and new creative materials
Figma used its annual Config conference to roll out a suite of updates that blur the line between design and development. While the company touts a “reimagined canvas” optimized for full‑stack work, the real shift comes from new AI‑driven features that promise to shave hours off repetitive tasks. Code layers let designers tweak actual code without ever leaving the Design canvas—clone repos, generate directions with Figma’s agent, extract flows into editable layers, then sync changes back to the codebase.
Motion tools add another layer: describe an animation to the chatbot and watch it materialize, or fine‑tune it on a timeline that’s already tied to design systems and ready for production. The shader editor follows the same prompt‑based approach, letting users craft custom fills and visual effects on the fly. All of these pieces sit under a single interface that Figma says brings “teams, AI agents, tools, and materials together in one place.” The rollout is ambitious, but whether it will streamline workflows or add new complexity remains to be seen.
You can read more about all the new product updates over on Figma's website. Otherwise, here's Figma's overview of everything that was announced: New creative materials to express ideas ● Code layers: Work directly with code on the Figma Design canvas. Clone repositories, generate new directions with Figma's agent, extract flows into editable design layers, and sync changes back to code.
● Motion: Design animations, transitions, and 3D transforms collaboratively, directly from Figma. Prompt to create animations with AI, apply preset styles, or adjust manually on a timeline. Motion is connected to design systems, code-backed, and ready to ship.
● Shaders: Prompt to build shader effects and fills, custom visual treatments powered by WebGPU. Effects that weren't available in Figma before, like dither, pixelate, and various blur types can now be created directly on the canvas. ● Figma Weave workflows: Generate consistent and high-quality visuals in Figma with 20 plus integrated Weave tools, turning complex AI workflows into simple tools on the canvas.
This is the first step towards a full integration between Figma and Figma Weave, expected later this year.
Why this matters
Figma’s new AI motion‑graphics and shader tools promise to shave hours off routine visual work, but whether they truly “push ideas further” remains to be proven. By embedding code layers directly onto the design canvas, developers can clone repositories and generate variations without leaving the UI—a step toward tighter design‑code integration that could streamline full‑stack workflows. Yet the announcement offers no detail on how AI agents will interact with existing codebases or what limits the automation may encounter.
For founders, the promise of a single space where teams, tools, and materials converge sounds efficient, but adoption will hinge on the reliability of the AI‑driven features and the learning curve for designers accustomed to traditional pipelines. Researchers might find a testbed for studying AI‑assisted creative processes, though the article does not disclose any evaluation metrics or open‑source components. In short, the updates broaden Figma’s scope beyond static design, but the practical impact on productivity and collaboration is still uncertain for our community.
Further Reading
- Figma to Advance Animation With AI! – AI Motion Design Tools - YouTube
- Figma product news and release notes - Figma
- animations in Figma Make & Sites | Motion React - Motion.dev
- Magic Animator • AI Animation Generator for Figma - Figma Community
- Your Creativity, unblocked with Figma AI - Figma
Related Reading
Research & Benchmarks Hermes Agent tops use as Nous Research’s self‑improving model leads OpenRouter
Research & Benchmarks DeepMind spinoff’s AI‑designed drugs enter human trials after AlphaFold 3
Research & Benchmarks Google AI Advisors Let Users Probe Performance with Conversational “Why” Queries
From Archives NVIDIA RTX PRO 4500 Blackwell GPUs Power New Amazon EC2 G7 Instances
From Archives