出海独角兽

我把 Figma 链接交给 Bolt,它生成了工具站页面

文章目录 · 5 节
  1. Bolt 当时给了一个 Figma 入口
  2. 我粘贴链接,也写清了要做什么
  3. 原文记录的结果,自动解析并生成页面
  4. 这次没有做的验收
  5. 参考资料

粘贴 Figma 链接、补充当时的工具站需求,让 Bolt 自动解析并生成页面;不把未做的响应式和上线验收补进去。

前一步,我已经把 Stitch 设计粘进 Figma,并拿到分享链接。到了 Bolt,我没有重新写一篇完整 PRD,也没有从空白提示词开始画页面。我做的是把这条 Figma 链接交给 Bolt,再告诉它要开发什么。

Bolt 当时给了一个 Figma 入口

打开 Bolt.new 后,首页输入框下方有 Figma 和 GitHub 两个导入入口。我点的是 Figma。

Bolt 首页当时的 Figma 导入入口

这个入口会打开 Figma 导入弹窗。原截图里粘贴的是一条真实 Figma URL,包含文件标识。正文使用的裁图已经把这段链接排除,只留下导入动作。

我粘贴链接,也写清了要做什么

手册里给的当时需求如下。

请参考这个 Figma 设计稿的 UI 风格和布局,帮我开发一个[你的具体功能]网站。

也就是说,Figma 链接提供视觉和布局参照,文字告诉 Bolt 这个页面最终要服务什么功能。两者缺一个,结果都容易跑偏。

在弹窗里粘贴链接后,我点击 Import Figma frame into Bolt。

粘贴链接后导入 Figma frame

原文记录的结果,自动解析并生成页面

手册随后记录,Bolt 会自动解析设计链接、编写代码,并还原出一个工具站页面。这是这次流程的最终页面结果。

但原文没有留下生成后的页面截图,也没有记录构建日志、代码文件、交互测试或部署地址。因此我只能说“当时记录为已经生成页面”,不能进一步写成“完整应用已交付”或“线上已经可用”。

Bolt 当前官方帮助仍支持从首页或聊天框导入 Figma Frame。粘贴 URL 后,Bolt 会处理设计,并根据布局生成项目。官方也提醒,清晰的页面结构和必要提示有助于结果,但这不等于功能逻辑会从设计稿里自动长出来。

这次没有做的验收

  • 没有桌面端与移动端的响应式对照。
  • 没有逐个按钮测试交互。
  • 没有核对真实数据和后端逻辑。
  • 没有部署到线上并访问验收。

所以,这篇的终点很明确。Figma 链接被 Bolt 接收,工具描述被提交,原手册记录 Bolt 自动解析并生成了页面。响应式、功能和上线,都要有下一轮证据再写。

参考资料

如果你也在做 AI 出海、独立开发或海外业务,欢迎关注「出海独角兽🦄」。

这里继续分享工具、收款、增长和运营里能直接照着做的步骤。

同系列

继续阅读「Figma」

相关推荐