修改现有网页设计：用 Refore 网页转设计插件录制，在 Refore Make 中让 AI 继续设计

我们之前推送了一篇文章，介绍了如何用 Refore HTML to Figma、Refore 网页转设计 将 AI 生成的页面导入到 Figma/MasterGo：《大厂产品经理都在这么做：AI 生成设计稿，导入到 Figma/MG 接着编辑》，但这里其实有个很大的问题。

「问题：每次都从零开始」

现有的 AI 生成页面的方法，都有一个问题：都是从零开始生成。所以，哪怕写很长很长的 Prompt，加上来回对话调整，你都无法得到你想要的页面，这很浪费时间和 token。

事实上，你想要的页面，在现实中往往已经存在参考对象（这也是 Refore 的 HTML to Figma/MasterGo/Pixso 系列插件很受欢迎的缘故）。正如这用户跟我们提到的：

完美的应该方式是：

你只需要告诉 AI：“把 xxxx 的页面改成 yyyy 的样子”，“把 xxxxx 的所有页面里的商品标题都改成随机生成的母婴产品名” 等，然后 AI 就能按照你的要求生成页面

「解法：Refore 网页转设计 + Refore Make」

现在，你可以通过 Refore 网页转设计 插件做到这一点。它提供了独特的能力：将现有的任意一个操作流程里的所有页面提供给 AI 大模型（哪怕是需要登录的页面），让 AI 按你的要求对它们做修改，甚至批量修改，从而生成你想要的页面设计或业务流程。

这让 AI 不再是凭空猜测或基于模糊描述进行设计，而是能在你提供的真实、具体的页面上下文基础上，再进行修改和调整，从而显著提升 AI 辅助设计的精准度和效率。

简言之：Refore 网页转设计为你的 AI 设计流程提供更精确、充分的输入，因此也能得到更满意的效果。

「例子 1：修改 UI 风格 」

这是原页面：

通过 Refore 网页转设计插件将页面录制下来，再交给 AI 修改，要求改为 shadcn 黑白风格后：

「例子 2：修改一个操作流程里所有的页面内容并添加一个新步骤」

修改前的有赞微商城测试店铺短信催付流程，第一页： 最后一页:

要求按照蒙牛牛奶的场景做内容调整，并在最后新增一个步骤，添加一个短信催付的弹框后：

「如何使用 Refore 网页转设计插件让 AI 修改现有页面」

典型的使用流程如下，详细文档可参考 《录制网页以继续修改设计》：

1. 确保浏览器已安装 Refore 网页转设计 插件。打开插件后能看到两个录制按钮：

   • 录制单页：只录制当前页面。
   • 录制连续多个页面：记录你的点击和页面内容，适合调整整个流程的设计。

2. 录制完成并上传后，会弹出成功提示。点击下方的 “在 Refore Make 里让 AI 修改后再导入” 按钮，即可跳转到 Refore Make。

3. Refore Make 会自动把录制的页面作为一个新项目打开，你可以直接输入 prompt 让 AI 改版。

4. 如果对 AI 修改结果不满意，可以以 Chat 的方式让 AI 继续调整，或者导入到 Figma 等设计软件里继续手动修改。参考：《大厂产品经理都在这么做：AI 生成设计稿，导入到 Figma/MG 接着编辑》