最近听了一期播客，挺有意思的。

天下行

最近听了一期播客，挺有意思的。


嘉宾是 Notion 的设计师 Brian Lovin，他分享了一个很有趣的话题：怎么用 AI 工具帮设计团队快速做原型。

你可能会想，设计师不都用 Figma 吗？

确实，但 Brian 提到了一个痛点，做 B2B SaaS 产品的时候，光在 Figma 里画画是不够的。

你得让设计尽快接触真实场景，看看实际用起来是什么感觉，不然等到开发做完了才发现问题，那就太晚了。

所以他给团队搭了个原型游乐场，让所有设计师都能用 Claude Code 快速把想法变成可以点击的原型。

下面我挑几个我觉得特别有启发的点👇

1️⃣ 设计不能只停留在画板上

Brian 说了一句话：设计要尽早接触现实。

你在 Figma 里画得再漂亮，也只是静态的图。真正的产品是动态的，有交互、有数据、有各种边界情况。尤其是做 AI 产品的时候，你根本没法在 Figma 里模拟那些智能交互。

所以他们团队的做法是，设计师直接用代码做原型。

不是说要设计师变成工程师，而是借助 AI 工具，让做原型这件事变得更容易。这样一来，设计师可以更早地测试想法，更快地发现问题。

2️⃣ 一个仓库搞定所有原型

他们的原型游乐场其实就是一个 Next.js 应用，所有设计师的原型都放在同一个代码仓库里，每个原型就是一个页面。

这样做的好处，首先是便于共享。你做的组件，别人可以直接拿去用。

其次是便于维护，不用到处找文件。而且因为都在一个项目里，部署起来也很方便。

Brian 还提到，他们会定期清理不用的原型，保持仓库的整洁。

3️⃣ 教 AI 自己做事

这是我觉得最有意思的一个点。Brian 说，每当 AI 让你做什么的时候，你就应该教它自己做这件事。

举个例子，一开始 Claude 可能会说：请你创建一个新文件，然后把这段代码复制进去。但你可以告诉它，你应该自己创建文件并写入代码。久而久之，AI 就学会了自己动手。

这个原则听起来简单，但其实很深刻。

我们用 AI 工具的时候，很容易陷入一个误区：把 AI 当成助手，让它告诉我们怎么做。但其实更高效的方式是，让 AI 直接帮我们做。

Brian 还分享了一些具体技巧，比如用 plan mode 让 AI 先规划再执行，用自定义命令简化重复操作。这些都是实战经验，很实用。

4️⃣ 从 Figma 到代码的自动化

这个功能听起来有点黑科技。他们做了一个 /figma 命令，可以直接把 Figma 设计转成代码。

当然，不是说一键生成就完美了。Brian 说这个过程大概能做到 80% 的自动化。剩下的 20% 需要人工调整，比如一些细节的样式、交互逻辑等等。

但即便如此，这也大大提高了效率。以前可能要花一天时间手写代码，现在可能半小时就搞定了。而且 AI 还会自动验证生成的代码是否符合设计稿，这个验证循环特别有用。

5️⃣ 部署也能一键搞定

最后说说部署。

Brian 做了一个 /deploy 命令，可以自动处理 git 分支、创建 PR、跑 CI 检查等等。

这个其实解决了一个很现实的问题，设计师可能不太熟悉 git 操作，让他们手动提交代码、创建分支，门槛还是有点高。

但有了这个命令，只要输入 /deploy，剩下的事情 AI 全帮你搞定。

这种简化流程的思路，我觉得非常值得学习。

听完这期播客，我最大的感受是：AI 工具真的在改变我们的工作方式。

Brian 的这套玩法，给了我们一个很好的参考。如果你也在做产品设计，或许可以试试类似的思路。