Figma推出代码图层与AI动画功能 加速设计与开发协同

关键功能概览

• 代码图层：在协作画布上直接嵌入可编辑代码，支持从仓库克隆、从代码抽取交互流并同步到设计层，帮助设计师、产品经理和工程师在同一视图中快速迭代。
• 动画与 3D 变换：原生支持运动、过渡和三维变换，省去导入第三方工具再转换的环节，设计稿可即时预览并导出对应代码。
• AI 生成着色器与填充：通过提示词生成自定义 shader 效果，AI 自动完成纹理与颜色填充，降低手工调参成本。

AI 助手与插件创新

Figma 将 AI 助手能力扩展为可编写可复用 Skill，用户仅需文字指令即可让 AI 完成布局生成、矢量路径追踪等任务。新插件创作功能支持在画布内直接用提示词生成插件原型，未来还将实现 Weavy 工作流的“一键生成”。此外，Figma 已集成 Claude Code 与 Codex，在设计交付阶段自动生成对应代码片段，提升设计‑开发交付效率。

行业影响与前景

此番更新把设计平台从“视觉原型”提升为“代码‑设计一体化”工作空间，符合企业对快速 MVP 与跨职能协同的需求。随着生成式 AI 能力的持续渗透，设计工具将逐步承担更多开发前置工作，降低开发前期的沟通成本。分析师预计，具备 AI 编码与动画能力的工具将在未来 12 个月内获得约 15% 的企业采购增长，尤其在 SaaS 产品和内部工具建设领域表现突出。

“我们希望通过代码图层让团队在空间化的画布上自由探索，而不必担心代码质量。” — Figma 首席产品官 Yamashita

总体来看，Figma 本次更新不仅丰富了设计师的创作手段，也为工程团队提供了更直接的代码入口，标志着设计与开发协同进入 AI 驱动的新时代。