Appearance
现在市面上几乎所有通用大模型的 AI 产品都能生成流程图,但今天分享的方法是可以直接在你们自己的 Figma 中快速自动生成 FigJam 的,打开直接修改,想怎么改就怎么改!
为什么要在 Figma 中生成
如果在 Claude 中直接输入生成流程图的指令,结果往往显示不全,还不能修改。因为缺少了重要的一步——将 Claude 与 Figma 打通。
打通后,Claude 会在你的 Figma 账号中自动创建一个 draft,打开之后和自己创建的 FigJam 一模一样,直接可以编辑修改。
三步打通 Claude 和 Figma
Step 1:打开 Connectors
在 Claude 左上角依次选择:
Customize → Connectors → 右上角"+"号 → Browse ConnectorsStep 2:选择 Figma
在出现的页面中选择 Figma
Step 3:登录 Figma 账号
点击后会进入 Figma 登录页,输入自己的账号就可以。
看到以下页面就说明 Claude 和 Figma 打通了:
不敢不同意使用方法
方法一:自动使用
打通后,直接输入提示词,Claude 会在结果里自动打开 Figma 窗口。
方法二:手动指定
如果有的时候 Claude 没有自动使用 Figma 绘制,可以在提示词中加入**"使用 Figma 绘制"**,Claude 就会在你的 Figma 账号中自动创建一个 draft。
生成结果
点击「在 Figma 中编辑」,直接就可以跳转到 Figma 中编辑。
这样 Claude 和 Figma 合为一体:
| 能力 | 说明 |
|---|---|
| 流程图 | AI 生成,可直接修改 |
| 原型图 | 自动布局,可编辑 |
| UI 界面 | 生成后可精细调整 |
一句话总结
Claude + Figma = AI 生成的流程图直接变成可编辑的 FigJam 文件,抓起来改就行。
