手搓AI生图网站，出海赚美金！实操玩法真实分享

一周前，我从杭州参加生财的AI出海活动回来，就决定All in出海用AI做应用，彻底放弃国内的市场和用户。

所以，这一周来我做了三件事。

首先，我写了一篇活动的复盘《7倍利润，出海赚美刀！》，没想到上了微信的推荐，爆了1.3w阅读量。

其次，我分别用AI套壳做了两个出海网站，一个是AI对话/生图的工具站，套用了Qwen的大模型，一个是AI导航网站，从Github找了个开源项目，用AI简单修改后直接上线了。

到今天为止，这个AI工具站，是我提交Google的第三天，已经有了收录索引，Google Analytics显示有了一些北美、香港的用户访问。

最后，就是花了一点时间，看了不少Google的SEO官方文档和一些相关的SEO文章，不过没觉得有什么太大收获，因为这和我当年刚学SEO时学的东西一样，只是这些内容过于基础。

以我的经验来，对百度没啥大用，速度也太慢，对Google是否有效，我还需要靠时间来验证。

这就是我最近一周做的事，总结完了，来分享一下，我如何用AI手搓这么一个网站的方法。当然，看懂下面的内容，需要多少了解一些AI编程工具的使用方法。

首先，我开发的这个网站用到了两个AI编程工具，一个是blot.new，一个是Cursor。

blot.new用来完成的网站UI的样式，Cursor做的网站的功能。不得不说blot.new做的网站效果是真的好看。

看这情况，做前端和UI设计，不少人在未来会面临失业危机，如果我是老板，我肯定不会花钱在找前端和UI了，20美刀一个月的blot.new交给一个懂后端的码农就足够了，能少发俩人的工资，少说省掉一年三四十万的成本。

我整个网站总成本150港币，这是在Godaddy买了一个域名的费用。网站代码放在github上的仓库里，免费部署在Vercel。

搓出整个网站的第一个版本，我只花了2个小时时间，就做出了网站几个页面的前端样式，以及核心的AI对话功能。

对于一些网站的细节我没有做深入调整，所以不少地方还是比较粗糙，因为过去做网站的经验告诉我，不要将时间和注意力放在这些东西上面。

因为，你只需要记住一句话，用户不在乎你这个是红色还是绿色，是大了还是小了！特别是从搜索过来的用户，好看的网站UI样式，以及良好的交互只是锦上添花，最核心的还是信息、功能能否满足用户的需求。

就好比有人会因为动作片满屏幕花花绿绿的广告，气愤的关闭网站不看吗，所以不要在意网站好不好看，细节怎么样，这些东西完全可以在后面慢慢再打磨，更何况blot.new做出的网站UI效果也不差。

我为什么会做这么一个网站，因为我在Google搜索框看到了AI Answer Generator这个联想词。

于是，我在GoogleTrends里查了下搜索趋势，发现有一定的搜索流量。

然后，在Ahrefs中查了下在北美的竞争情况，竞争不是很大。

于是，我就做了这么一个网站。

目前使用的是Qwen的免费大模型，生图功能，用的是在硅基流动的免费生图模型，效果差强人意，但是好在它是免费的，对于现阶段来说也够用了。

这就是我为什么会做这样一个网站。总结方法，就是现在搜索框中找到一些可能有搜索流量的联想词，然后根据搜索结果中网页的Title拓展一下关键词，在GoogleTrends中判断一下全球的流量趋势，以及在Ahrefs看看竞争情况就决定是否可以做了。

额外说一句，我为什么会做个导航网站，我其实不太喜欢做导航站，我多年前做网站的时候，最讨厌的就是导航站，因为我觉得导航站这东西的存在有点反人类。

但是发现出海做网站还就绕不开导航站，因为新站上线需要外链，而海外的一些导航站提交一次外链至少几十一百美金，价格不便宜，所以基于成本，以及运营层面的考量，我决定做一个导航网站。

最终的目的是将所有开发的网站，形成一个流量矩阵，导航站作为流量的源头之一为其他网站输出流量。

所以，我做出海做网站，并不是像很多人想的那样做单一网站的罗列，而是形成一套矩阵的体系，包括后面我也会去做一个Google插件，做一个插件版的浏览器导航给产品矩阵输送流量。

当然，我也打算试试开发一个iOS版的Chrome套壳AI浏览器，用web的SEO流量带动APP的下载，从而形成一个手机端到移动端的流量闭环。

在网站初步有一定稳定流量后，我会做一些这方面的尝试。

因为出海做网站，我觉得找需求，不如确定打法，因为找需求的行为具有巨大不确定性，而且效率很低。我的策略和过去做网站站群玩法一样，就是确定一个玩法，直接矩阵化干到底！尽量减少不断重复0到1的过程。

有了具体的方向后，下一步就是用Blot.new实现网站的页面设计了，其实这一步的操作非常简单粗暴！

因为文章篇幅有限，所以不能细致到每一步操作，如果觉得看着吃力的话，建议先收藏，再对着文章一步步操作。

第一步，就是先在claude3.7，或其它任何一个AI大模型和它沟通你的想法，告诉AI你想做个什么样的应用，它有哪些功能，有什么样的使用方法，你希望它有什么样的设计风格等等。

将你的想法聊明白了，然后让claude3.7，给你总结成用于blot.new的网页UI、UX的开发提示词！

这里要注意的是，AI生成的结果具有随机性。所以，最好认真看一下提示词的内容是否符合你的要求，如果不对的话还要再对话微调细节。

描述的越具体你得到的生成质量也就越高！

下面做一个简单的演示，提示词参考：

下一步，只需要将claude3.7生成的提示词复制粘贴发给blot.new就行了，然后，你就会得到一个比较好看的网站样式，如果对哪里不满意，可以在对话中用自然语言描述，继续完善整个网站的设计。

blot.new有个好处就是网站里的图片、图标会自动给你创建。

下一步，点击Export > Download ，将所有代码导出，保存到本地。

下一步，打开Cursor，打开导出的项目文件的根目录，然后使用ASK模式，在对话框中使用@codebase模式，告诉AI：

你是个资深的工程师，请你完整阅读整个项目的所有文件，然后和我介绍这个项目的每个文件作用，以及如何一步步运行整个项目，我是个技术小白，请你用最简单直白的语言告诉我。

这一步，一般AI会告诉你先安装next.js的网站运行环境。

一般命令是"npm install"，然后再使用"npm run dev"运行网站，你就能在本地浏览器中查看网站的效果了。

下一步，就是让Cursor逐个实现网页中的功能了。如果你的网站中包含订阅、登录注册等功能，那么第一个版本可以先略过不做，先将核心功能做出来快速将网站上线。

对于我们这个网站来说，最重要的是AI生图功能，所以这里我以硅基流动为例，说一下如何让网站调用AI大模型的API能力，如果你想要实现吉卜力风格的图片的话，那你得用Gpt的API。

不过不管哪个AI大模型，实现过程是一样的，非常简单，不需要懂任何技术，也不需要你手写一行代码，就能直接实现。

首先，打开硅基流动平台，创建API-key，找到一个AI生图的大模型，点击API文档。

在Cursor中创建一个文件，命名为API.md。

然后，将我图中红框圈起来地方的代码复制粘贴过去，还有大模型的名称，你的API-key的密钥。

下一步，在Cursor中使用Agent模式，使用Claude-3.7-sonnet-Think模式，告诉AI：请你根据API.md文档中的内容，调用硅基流动平台的API，实现网站的AI生图功能，这是「xxx」API的开发文档。

到这一步，如果顺利的话你就实现了AI生图的功能。

下一步，将网站上线到Vercel中，这样你的网站就可以在互联网中被所有人访问使用了。

首先，安装Git，具体的安装过程非常简单。你可以问AI"我是个技术小白，我不懂如何安装Git，请你一步步指导我，我完成一步你说下一步"

其次，注册登录Github账号，然后在Github中点击右上角的+号，点击new repository创建仓库，

Repository name输入项目名称，选择Private，点击Create repository创建仓库。

下一步，你会得到一个Github的仓库链接，复制粘贴发送给Cursor，使用Agent模式，告诉AI：这是我的Github仓库链接，请你将我的项目推送上传至Github仓库。

在Agent模式下，AI会将你的代码上传至Github，如果是首次使用Git的话，AI会让你创建并绑定Github的账号。

下一步，打开Vercel官网，使用Github账号登录，点击Add new > projece，选中我们上传到github的项目，点击import导入> deploy部署，你的网站就上线了，Vercel会为你的项目自动分配一个域名，通过这个域名你的网站就能被全球用户访问了。

如果说需要设置独立域名，则需要在Vercel的项目里点击设置中的Domains添加域名，并在域名服务商那里，根据Vercel的提示添加解析记录，即可完成绑定。

到这一步我们就完成了整个网站从设计、开发到上线的所有操作环节。

整个操作，完全不需要懂技术，即使是个零基础的小白也能实现！因为熟悉的兄弟都知道我的英语水平和编程技术是啥样的，所以我都能做出来，你也完全可以。