现在让 AI Agent 生成一个页面已经很容易了。生成之后想把它拿到设计稿里继续改，本来就有两条挺顺手的路：如果拿到的是静态 HTML 文件，直接把文件拖进 Refore 网页转设计插件就能导入；如果页面已经在浏览器里跑起来了，用浏览器插件录制再导入也一样。这两种方式都快捷、方便，还原也准。
真正费劲的是另一类活儿：想让 AI 按你的要求，从一堆页面里挑出某几个页面、某几个模块导入；或者把一个操作流程上会经过的页面全都导入。这时候用 MCP 更省精力——给你的 Agent 配上 Refore 网页转设计 MCP，在对话里说一句「帮我导入到 Figma 里」，剩下的它自己跑。
MCP 也有缺点：比上面两种常规方法慢很多。所以它适合的是这样的场景——你希望 Agent 智能地把你要的那些页面导进设计稿，而时间上并不着急，比如：让 Agent 干活，你去吃个饭。
例子一：WorkBuddy 刚生成的页面，一句话进设计稿
在 WorkBuddy 里让它生成一个登录页，页面出来之后，紧接着一句「帮我导入到 Figma 里」：
不用保存文件，也不用切窗口——就在同一个对话里往下说一句。
上图在 Figma 里的样子：页面已经落在画布上，帧的名字是「登录 - imported by Refore HTML to Figma(MCP)」，插件面板里能看到是哪个 Agent 连进来的、导入任务跑到哪一步了。
例子二：让 Agent 走完一个流程，边走边导
这才是 MCP 最能发挥作用的地方——多页面、带交互的流程。
比如把「打开某个页面，把添加用户的整个流程导入设计稿」交给 Claude Code，它会自己打开页面，先导列表页；点「添加」按钮，把弹出的弹窗导进去；在表单里填内容、做勾选，把填好的状态也导一份。流程走完就停。你在设计稿里拿到的是三张独立的设计帧。
同样的思路也可以用来「把这个页面下所有的 tab、弹框、下拉菜单挨个点开并导入」——这些以前要一个个手动点开再抓的状态，现在交给 Agent 去跑就行。
上面两个例子的完整过程，都在下面这段视频里：
什么时候不适合用 MCP
得说清楚代价。让 Agent 一页页「爬」很省心，但它比你自己用浏览器插件录制再导入要慢；而且导入哪些内容、什么时候算「这一页可以了」，都是模型当场判断的，同一个页面跑两次结果不一定完全一样。
所以：要稳定的高还原度，用浏览器插件录制并导入，或者直接把 HTML 文件拖进插件，这两条路都比走 MCP 强。MCP 的价值在别处——你完全不用亲自操作，以及它能和 Agent 生成页面的工作流无缝接上。
另外，导入页面会消耗免费额度，付费用户则不限量。
Figma、MasterGo、Pixso、即时设计都支持，操作完全一样。