用 AI 快速实现一个 MVP

MVP：最小可用产品。
在做开发产品时，应该先用最低成本做出一个 MVP，目的是为了快速验证需求。
现有的 AI 编程工具，足以实现一个简单的 MVP。

产品开发流程

一个简要的产品开发流程如下：

构思产品 idea
设计原型
开发
上线运行

构思产品 idea

只需要一个简单的 idea，让 AI 帮助我们来构思产品。
这里不需要高难度的提示词工程，只要将我们的想法告诉 AI，并告诉他做一个 MVP 产品就好了。
如果不说明只做 MVP，AI 会设计一大堆比较复杂的功能。
有任何不满意，可以和 AI 一直探讨，直到生成满意的 MVP 功能描述
mvp-idea

设计原型

以前开发一个项目要先画线框图，再做低保真原型图，最后绘制高保真原型。在这个过程中，需要产品经理和 UI 设计一起合作。
现在借助 AI 工具，可以直接生成高保真原型。

工具选择

在这方面，目前比较的流量的工具有：

这个 3 个工具的使用方法基本一样。功能方面我觉得都差不多，没有那一个明显强于其他。
每个工具有自己的调教和风格偏好，同样的提示词，不同工具生成的效果也不同。
选择自己喜欢工具即可。
推荐使用 v0，注册送 5 美元额度，基本够做几个小项目了。其他 2 个的免费额度很少，对话几次就没了。
另外 v0 和 Next.js、Vercel 是同一家公司出品，与这两个结合的很好。而 Next.js 和 Vercel 是做海外工具站几乎一定会用到的工具。

Stitch

另外推荐一款 Google 出品的 UI 设计工具：Stitch。Stitch 的审美比上面介绍的 3 个工具都要好。
与上面 3 个工具不同的是，Stitch 生成的是静态页面，无法实现具体的功能。而那 3 个工具，都可以生成动态交互的页面。
可以先用 Stitch 来设计好 UI，然后再用 v0 做出可以交互的页面。

设计 UI

和 AI 讨论，确定 MVP 功能后。写一个清晰的提示词，告诉 AI 我要做一个网站，功能是什么，页面风格有什么要求，然后让 AI 帮我们做设计。
具体可以参考下面的这个例子。

我想做一个「实时工资计算器」，产品形态是网站。帮我设计这个网站

# 产品功能
- 有一个输入框，供用户输入月薪
- 点击「上班」按钮，计时器开始计时，累计用户的上班时间。在计时器下方，同时显示出根据用户月薪计算出的当前实时收入
- 有个「暂停」按钮，点击后暂停计时器，同时暂停月薪计算 - 点击「暂停」后，按钮文字变为「继续」，点击后回复计时
- 有个「下班」按钮，点击后结束计时，展示出一个酷炫的庆祝效果，然后突出显示当天累计工作时间与总收入

# 界面要求
- 同时兼顾移动端和pc端，保证手机访问和电脑访问一样美观
- 参考苹果公司的设计风格
- 因为是与收入相关的项目，页面风格配色要与金钱相关

打开 Stitch 输入上述提示词，再次确认后，生成了如下的界面。
ui-design

生成原型

然后打开 v0，复制 Stitch 生成的设计图，将提示词修改为：

我想做一个「实时工资计算器」，产品形态是网站。

# 产品功能
- 有一个输入框，供用户输入月薪
- 点击「上班」按钮，计时器开始计时，累计用户的上班时间。在计时器下方，同时显示出根据用户月薪计算出的当前实时收入
- 有个「暂停」按钮，点击后暂停计时器，同时暂停月薪计算 - 点击「暂停」后，按钮文字变为「继续」，点击后回复计时
- 有个「下班」按钮，点击后结束计时，展示出一个酷炫的庆祝效果，然后突出显示当天累计工作时间与总收入

# 界面要求
- 同时兼顾移动端和pc端，保证手机访问和电脑访问一样美观
- 按照图中的设计来做

粘贴到 v0，让 Ta 去生成可以交互的页面。
生成后可以在浏览器中直接预览，如果有不满意的地方，直接让 v0 改就好了。v0 会保存每一次改动生成的版本，改坏了也不怕，直接退回到之前的版本即可。

开发

通常我们做得产品都不会这么简单，只用 v0 这类工具是无法实现全部功能的
一个通用的流程是：先用 v0 做好前端页面，然后把代码下载下来用 cursor 做进一步修改。
上面的例子比较简单，直接用 v0 就可以完成了。

上线

v0 的上线比较简单。点击右上角的「Deploy」按钮，可以将生成的网站一键部署到 Vercel，Vercel 会自动分配一个 URL，这样就可以让别人也能访问这个网站了。
点击下面的链接，就可以看到 v0 生成的实时工资计算器。
https://v0-real-time-salary-calculator-iota.vercel.app/

总结

以上就是使用 AI 工具快速实现一个 MVP（最小可用产品）的流程。
一个复杂的系统，总是从最简单有效的形式开始的。
simple-system
开发更加复杂的系统，整体上也是这样的流程，不过会用到更多工具，过程也要复杂一些。
后面的文章，会进一步介绍复杂项目的设计、开发与上线方案。