Figma新增代码层和AI插件工具

TechCrunch AI··作者 Ivan Mehta

关键信息

代码层旨在帮助团队克隆仓库,并把代码中的流程提取到设计层中进行测试,而不必担心生产级代码质量。Figma还允许用户连接Notion、Granola、Excel和GitHub等上下文来源,或附加文件,让AI助手能基于更具体的信息执行任务。

资讯摘要

Figma在周三发布了一次重要产品更新,重点是进一步打通设计、代码和AI。最引人注意的新功能是代码层,它把代码直接带到协作画布中,让团队可以在Figma里处理软件行为本身。公司表示,这将帮助团队克隆仓库,并把代码中的流程提取到设计层里进行测试和探索。首席产品官Yuhki Yamashita说,这个方向的目标,是让设计师、产品经理和程序员更容易快速迭代,而不用纠结于把代码打磨到生产环境可直接使用的程度。

Figma此前已经在朝这个方向推进,例如去年推出了基于AI提示词的原型工具Figma Make,并接入了Claude Code和Codex来改善设计与编码之间的交接。此次更新还加入了对动效、过渡、3D变换和着色器的支持,而这些内容过去往往需要先在其他工具中制作,再转换成应用能理解的代码。除此之外,Figma还在扩展它的AI助手,新增了可通过提示词定义的可重复技能,以及连接Notion、Granola、Excel和GitHub等外部工具的能力。公司还表示,用户可以通过提示词创建自定义插件,例如布局生成器或矢量路径追踪器,并计划在今年稍晚让用户直接在Figma中生成Weavy工作流。

Figma新增代码层和AI插件工具

资讯正文

Figma 于周三展示了一项更新,新增了代码层,支持动效和 shader,并且能够利用 AI 为各种任务创建自定义插件。

这家设计平台在将代码集成到其工具中的方向上已经推进了一段时间。去年,它发布了基于 AI 提示的原型工具 Figma Make,此后又推出了与 Claude Code 和 Codex 的集成,以改善编码与设计之间的交接。

如今,公司正将代码层直接加入协作画布,帮助团队克隆仓库,并将代码中的流程提取到设计层中进行测试。

Figma 首席产品官 Yuhki Yamashita 表示,代码层让设计师、产品经理和程序员更容易围绕想法进行迭代,而不是专注于创建可直接投入生产的精致代码。

“我们认为多人协作画布非常强大,因为在这种环境里,你其实并不太在意代码质量。如果你是在快速探索,或者需要探索很多新的方向,你就可以用这种空间化的方式来做。我们希望这个功能不仅会改变设计师的行为,也会改变工程师和 PM 的行为,”他在一次电话会议中说道。

Figma 现在也支持动画、过渡效果和 3D 变换。此前,设计师必须在其他软件中创建动画,再将其转换成应用能够理解的代码。现在,设计师可以直接在 Figma 中集成动画和过渡效果。

现在,你还可以使用 AI 来创建其中一些资源,而这次更新也增加了使用 AI 添加 shader 效果和填充的支持。

去年,Figma 收购了基于节点的工具 Weavy,该工具帮助设计师通过不同模型运行工作流以比较输出结果;公司现在正努力更好地整合这两款应用。在今年晚些时候推出的一项更新中,用户将能够直接在 Figma 内生成 Weavy 工作流。

公司还为其 AI 助手添加了新能力,以便它在协作画布中的作用更大。用户现在可以编写文本提示,创建可重复使用、供 AI 代理调用的技能。你还可以连接 Notion、Granola、Excel 和 GitHub 等工具,或者附加文件,为 AI 机器人提供更多上下文,帮助它理解你希望它做什么。

公司还在添加一项功能,帮助用户通过提示创建自定义插件,例如布局生成器或矢量路径追踪器。

来源与参考

  1. 原始链接
  2. Figma adds code layers, support for animations, more AI features in new update | TechCrunch

收录于 2026-06-25