Figma 中的 AI 代理:从读取原型到自主设计创建
Figma 更新后的 MCP 服务器 beta 版扩展了 AI 代理的功能。现在,它们不仅能分析设计文件,还能使用组件、变量和设计系统令牌在画布上创建新元素。该功能在 beta 期间免费提供,计划通过按使用付费模式变现。
以前,MCP 服务器仅限于读取原型数据以用于后续代码生成。新 API use_figma 允许代理直接编辑画布:代理加载团队的组件库,并基于它构建原型。补充此功能的是 generate_figma_design 工具,它将 HTML 转换为可编辑的 Figma 图层。
技能:可执行的设计指南
核心机制是技能:定义代理行为的 Markdown 指令。它们指定步骤序列、元素操作规则以及遵守团队规范。技能将静态指南转化为 AI 可执行的代码。
任何 Figma 专家都能创建技能。Figma 提供了基础的 /figma-use 和社区示例。一个基础技能示例可能如下所示:
# /figma-use skill
1. Zagruzit biblioteku komponentov.
2. Withzdat frame with auto layout.
3. Razmestit komponenty by setke.
4. Primenit peremennye for tsvetov and tipografiki.
5. Proverit on sootvetstvie tokenam.
这确保了无需手动干预的设计一致性。
自我校正机制,实现精确迭代
代理实现了自我校正循环:生成屏幕、创建截图、与参考比较并进行调整。由于工作使用原生 Figma 结构(组件、自动布局、变量),更改会在整个系统中传播,而非局限于栅格编辑。
该方法的优势:
- 系统性:编辑更新整个设计系统。
- 迭代性:代理校正直到满足标准。
- 集成性:使用现有库,无需导入外部资源。
- 可扩展性:适合生成多个屏幕。
集成与 MCP 服务器访问
MCP 服务器已集成到流行开发环境中:
- Claude Code。
- OpenAI Codex。
- Cursor。
- Copilot CLI。
- VS Code 和其他。
这是 Figma 最近几周的第三次重大 AI 集成:2 月的 Claude Code,3 月的 Codex。Figma 画布正从设计工具演变为人类与代理协作的平台。
中高级开发者可以立即开始测试:连接 MCP 服务器,编写技能,并在真实项目上运行代理。要求最低——只需具有库访问权限的 Figma 账户。
关键要点
- API 扩展:
use_figma允许 AI 创建和编辑原生 Figma 元素。 - Markdown 技能:将指南转化为一致设计的可执行代码。
- 自我校正:结构级别的迭代编辑,而非像素。
- 集成:与 Claude Code、Codex、Cursor 和 IDE 的即插即用连接。
- 画布演进:设计师与 AI 代理的协作工作。
— Editorial Team
暂无评论。