{"id":3490218,"date":"2026-06-24T16:15:00","date_gmt":"2026-06-24T16:15:00","guid":{"rendered":"https:\/\/techingeek.com\/index.php\/2026\/06\/24\/figma-introduces-code-layers-enhances-animation-support-and-incorporates-additional-ai-features-in-latest-update\/"},"modified":"2026-06-24T16:15:00","modified_gmt":"2026-06-24T16:15:00","slug":"figma-introduces-code-layers-enhances-animation-support-and-incorporates-additional-ai-features-in-latest-update","status":"publish","type":"post","link":"https:\/\/techingeek.com\/index.php\/2026\/06\/24\/figma-introduces-code-layers-enhances-animation-support-and-incorporates-additional-ai-features-in-latest-update\/","title":{"rendered":"Figma introduces code layers, enhances animation support, and incorporates additional AI features in latest update"},"content":{"rendered":"
\n

On Wednesday, Figma revealed an update that introduces a new coding layer, capabilities for motion and shaders, along with the option to develop custom plug-ins for various functions utilizing AI.<\/p>\n

The design platform has been dedicating time to incorporating code integration into its toolkit for some time. Last year, Figma introduced an AI-based prompt prototyping tool, Figma Make, and has subsequently initiated partnerships with Claude Code and Codex to enhance the transition between coding and design.<\/p>\n

The company is now integrating code layers right into the collaborative canvas, allowing teams to duplicate repositories and transfer flows from code to design layers for testing purposes.<\/p>\n

Image Credits:<\/strong>Figma<\/span><\/figcaption><\/figure>\n

According to Figma\u2019s chief product officer, Yuhki Yamashita, code layers facilitate easier iteration for designers, product managers, and developers, allowing them to concentrate on brainstorming ideas rather than merely crafting immaculate production-ready code.<\/p>\n

\u201cWe believe the multiplayer canvas is incredibly effective because this environment doesn\u2019t emphasize code quality. If you’re quickly experimenting or exploring numerous new avenues, this spatial approach enables that. We anticipate this feature will encourage different interactions not only among designers but also with engineers and PMs,\u201d he remarked during a call.<\/p>\n

Figma is now enhancing supports for animations, transitions, and 3D transformations. Previously, designers had to create animations in separate software and convert them into code compatible with the application. Now, designers can incorporate animations and transitions straight into Figma.<\/p>\n

Image Credits:<\/strong>Figma<\/span><\/figcaption><\/figure>\n

Users can now utilize AI to create some assets, and the update includes support for adding shader effects and fills with AI as well.<\/p>\n

Last year, Figma acquired the node-based tool Weavy, which assists designers in executing workflows through various models for output comparison, and is currently striving for improved integration between the two applications. In an update set to roll out later this year, users will have the capability to generate Weavy workflows straight within Figma.<\/p>\n

The company is also rolling out features to enhance the usefulness of its AI assistant on the collaborative canvas. Users can now input text prompts to create repeatable skills that AI agents can utilize. Additionally, users can integrate tools such as Notion, Granola, Excel, and GitHub, or attach files to provide the AI bot with more context about your desired actions.<\/p>\n

Moreover, the company is introducing a function that aids users in crafting custom plug-ins, like layout generators or vector path tracers, guided by prompts.<\/p>\n<\/div>\n

When you purchase through links in our articles, we may earn a small commission. This doesn\u2019t affect our editorial independence.<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"

\n

On Wednesday, Figma revealed an update that introduces a new coding layer, capabilities for motion and shaders, along with the option to develop custom plug-ins for various functions utilizing AI.<\/p>\n

The design platform has been dedicating time to incorporating code integration into its toolkit for some time. Last year, Figma introduced an AI-based prompt prototyping tool, Figma Make, and has subsequently initiated partnerships with Claude Code and Codex to enhance the transition between coding and design.<\/p>\n

The company is now integrating code layers right into the collaborative canvas, allowing teams to duplicate repositories and transfer flows from code to design layers for testing purposes.<\/p>\n

Image Credits:<\/strong>Figma<\/span><\/figcaption><\/figure>\n

According to Figma\u2019s chief product officer, Yuhki Yamashita, code layers facilitate easier iteration for designers, product managers, and developers, allowing them to concentrate on brainstorming ideas rather than merely crafting immaculate production-ready code.<\/p>\n

\u201cWe believe the multiplayer canvas is incredibly effective because this environment doesn\u2019t emphasize code quality. If you’re quickly experimenting or exploring numerous new avenues, this spatial approach enables that. We anticipate this feature will encourage different interactions not only among designers but also with engineers and PMs,\u201d he remarked during a call.<\/p>\n

Figma is now enhancing supports for animations, transitions, and 3D transformations. Previously, designers had to create animations in separate software and convert them into code compatible with the application. Now, designers can incorporate animations and transitions straight into Figma.<\/p>\n

Image Credits:<\/strong>Figma<\/span><\/figcaption><\/figure>\n

Users can now utilize AI to create some assets, and the update includes support for adding shader effects and fills with AI as well.<\/p>\n

Last year, Figma acquired the node-based tool Weavy, which assists designers in executing workflows through various models for output comparison, and is currently striving for improved integration between the two applications. In an update set to roll out later this year, users will have the capability to generate Weavy workflows straight within Figma.<\/p>\n

The company is also rolling out features to enhance the usefulness of its AI assistant on the collaborative canvas. Users can now input text prompts to create repeatable skills that AI agents can utilize. Additionally, users can integrate tools such as Notion, Granola, Excel, and GitHub, or attach files to provide the AI bot with more context about your desired actions.<\/p>\n

Moreover, the company is introducing a function that aids users in crafting custom plug-ins, like layout generators or vector path tracers, guided by prompts.<\/p>\n<\/div>\n

When you purchase through links in our articles, we may earn a small commission. This doesn\u2019t affect our editorial independence.<\/em><\/p>\n","protected":false},"author":2,"featured_media":3490219,"comment_status":"open","ping_status":"closed","sticky":false,"template":"Default","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-3490218","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/techingeek.com\/index.php\/wp-json\/wp\/v2\/posts\/3490218"}],"collection":[{"href":"https:\/\/techingeek.com\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/techingeek.com\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/techingeek.com\/index.php\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/techingeek.com\/index.php\/wp-json\/wp\/v2\/comments?post=3490218"}],"version-history":[{"count":0,"href":"https:\/\/techingeek.com\/index.php\/wp-json\/wp\/v2\/posts\/3490218\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/techingeek.com\/index.php\/wp-json\/wp\/v2\/media\/3490219"}],"wp:attachment":[{"href":"https:\/\/techingeek.com\/index.php\/wp-json\/wp\/v2\/media?parent=3490218"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/techingeek.com\/index.php\/wp-json\/wp\/v2\/categories?post=3490218"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/techingeek.com\/index.php\/wp-json\/wp\/v2\/tags?post=3490218"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}