videcoding完如何上线

我用了一下午，做出了一个完整的网页应用，还部署上线了，任何人都能访问。关键是我一行代码都没写。今天我把整个过程拆解给你，跟着做你也行。整个过程就四步，第一步，明确需求。第二步，生成圆形。第三步，圆形转代码。第四步，部署上线。接下来我一步一步给你说清楚。 先说第一步，头脑风暴，明确需求。这一步是整个流程中最重要的一步，很多人会忽略它，但我必须告诉你，你最终做出来东西好不好，百分之八十取决于你这一步做的扎不扎实。具体怎么做呢？打开 excel， gpt、 cloud 或者 gemini， 随便选一个你顺手的就行。然后把你脑海中那个模糊的想法告诉他， 不用担心说的不够清楚，你就像跟一个朋友聊天一样，把你想做什么给谁用，大概用什么功能，一股脑说出来就行。关键在于你不要只聊一轮就结束了，你要多跟 ai 聊几轮，让他反问你，你没想到的地方，他会帮你想到，你不确定的地方，他会帮你分析利弊。 就这样一来一回聊个十几二十轮，你会发现你的想法越来越清晰了。聊到什么程度算够了呢？最好是能明确到你的应用有哪些模块，每个模块有哪些功能，一共有几个页面，每个页面上大概有什么内容，用户操作流程是什么样的。 当然，如果你觉得一次性选不了，那么全也没关系，你可以先只明确两三个核心的功能，先做出来，后面再慢慢加。 最后让 ai 把你们所有的讨论成果汇总成一份文档，这份文档有个专业的名字叫 prd， 就是 产品需求文档。 好，拿到这份 prd 之后，我们进入第二步，生成原型界面。这一步我们需要用到一个工具，叫 google stitch。 你 把刚才那份完整的 prd 文档扔给 stitch， 它会根据你的需求自动帮你画出应用的 ui 界面。生成之后，你看一下，如果觉得哪里不好看，或者不觉不合理，你就继续跟他说，让他调整。 比如你想要暗黑风格，你就告诉他，你觉得某个按钮位置不对，你也告诉他，就这样反复微调，直到所有页面让你 满意为止。这一步结束之后，你手上应该有一套完整的覆盖所有页面的应用原型。这个原型看起来已经十分接近最终成品了，但他还只是一个壳。接下来我们要把它变成真正能跑的代码。 进入第三步，原型转代码。在 stitch 里面有一个功能，可以直接把你做好的原型导出到 google as studio。 导出之后， google as studio 就 会基于你的原型文件，自动生成一整套可以运行的前端代码。它默认使用的技术栈是 react 加 type script， 你 不懂这些也没关系，不影响你使用。 如果你的项目比较简单纯，前端不涉及什么后端服务器之类的，那你甚至可以在 google as studio 里面就把所有事情做完，在里边预览、调试、修改都可以。 这里特别提一句， a s noodle 里可以一键把代码推送到 github。 这一步一定要做，相当于给你的代马上了个保险，改崩了随时能会退。如果你的项目比较复杂，需要接后端服务，或者需要更精细的调整， 那你可以把代码从 github 拉到本地，用专业编程工具继续开发。这里推荐几个工具， cloud code、 cursor tree 都可以， 选你喜欢的就行。遇到报错不用慌，把报错信息直接扔给 ai， 让他帮你修就行。记住一个原则，小步迭代，改一点，侧一点，不要一次性改太多东西。好！代码搞定之后，我们来到最后一步，部署上线。这一步超级简单，打 开 word 这个网站，用你的 github 账号登录，然后选择你刚才推送到 github 的 那个代码仓库。如果项目需要环境变量，比如一些 api， k 之类的，在部署页面填一下，然后点击部署， webster 会给你生成一个专属的网址，任何人通过这个网址能访问你的应用。到这里恭喜你，你已经拥有一个完全属于自己的网页应用。从一个模糊的想法到一个真正上线的产品，整个过程你可能一行代码都没有手动写过。 最后快速回顾一下，第一步，用查找 gpt 跟 ai 聊清楚需求，输出一份 prd 文档。第二步，把 prd 扔给 google switch， 生成完整的 ui 原型。 第三步，从 stitch 导出到 google a s 九九，自动生成代码推送到 github。 第四步，打开 word， 一 键部署上线。我知道你可能觉得些工具名字听着就头大，但你真正上手之后就会发现， 每一步其实只需要点几下鼠标，跟 ai 说几句话的事先照着做一遍，做完你就懂了。我把完整的提示词、工具链接、原代码全部整理好了，拿到就能直接用评论区扣个六，我免费发给大家。

使用 easywave 之前，我们需要安装 node， 点 j s， 选择 x 六四版本，点击 windows installer， 等待下载安装程序， 打开安装程序，全程选择 next， 这一步可以更改安装目录，勾选这个选项， 选择 next， 最后点击 install 进行安装。打开此电脑或我的电脑单机地址栏，按退格键，输入百分号 app data 百分号， 然后按回车键，找到 n p m 文件加复制文件加地址，查看高级系统设置，点击环境变量，点击系统变量里的 pass， 点击编辑， 点击新建，把复制的 n p m 文件加地址粘贴进去，然后全程点确定 power shell， 输入 n p m 空格杠 v 并回车，看到版本号就是安装成功了。打开浏览器，输入 easy web 的 github 地址， 单机绿色的 code 按钮，点击 download zip 选项，解压下载的 zip， 并打开解压后的文件夹，单机该文件夹的地址栏，按退格键，然后输入 c m d， 按回车， 输入 n p m install 并回车，等待文件加载。 加载完成后，输入 n p m run d e v， 然后按回车，继续等待加载。加载完成后，按住 ctrl 键并单机彩色链接， 然后等待浏览器加载主页面， 进入主页面后就可以开始使用了。再次使用，只需在 power shell 里重复 npm install 和 npm run dev 命令。

你敢相信吗？你所看到的这个独立站完全是由 ai 搭建的，在这期间没有用到任何的代码开发和 ui 设计 成本大大降低，以往光设计和交互可能就需要三四周的时间，现在网站部署搭建到完整上线，三天时间都用不了。二零二六年， webcoding 建站的时代真的来了。

相信很多非技术背景的朋友和我一样，以为学会 wipe coating 就 能轻轻松松上线产品了，直到我亲手把我的产品 journey 上线，才发现 wipe coating 才是最简单的一步。今天分享，我作为一个设计师，从最开始不太懂编程，到上线第一个产品，踩过了那些坑。 第一个坑就是不舍得花钱用最贵的模型。比如说有一段时间，我为了省钱就去用了谷歌的编程产品，但是谷歌产品在做后端的编程非常拉胯，在搭建数据库的时候，一个报错它能够修复三个小时以上。后面我一狠心，花钱买了 cloud code 的 max， 换成了最贵的模型， 同样一个 bug， 他 几分钟就给我修好了。所以技术小白如果要着急上线你的产品，千万不要不舍得花钱去用最贵最好的模型。第二个坑就是开发产品，其实百分之五十的时间你根本就不是在用扣顶斜功能， 其他一些非常琐碎的事情会很打击你的开发热情。比如说我给我的产品接入支付系统花了整整一个月的时间，各种支付平台都在驳回我的申请，然后我又不停的申诉，时间都浪费在这种无意义的事情上面，真的是非常打击我的开发热情。 除了支付系统比较麻烦之外，一些隐私协议、 i c p 备案也会让我们掉一层皮。所以你在上线产品之前一定要想好，即使 ai 能帮你写产品，这些琐碎的备案认证， ai 是 替代不了的，你能应付它们吗？ 第三个你需要的知道的事情是，上线一个产品，用 ai web coding 开发好这个产品只是一个起点，后面的运营才是一场马拉松。你做出来一个产品当然是要让大家来用它，那大家要怎么才能知道它？所以我们得做 seo 和 geo， 就是 你在用谷歌和百度搜索的时候能搜索到到它们， geo 则是你在问 ai 的 时候， ai 会推荐你的产品，所以如果这些不做，你的产品的用户量可能会少的可怜，而且这不只是一蹴而就的工作，而且需要你源源不断地持续运营才行。 你现在有没有在准备 white coding 上线一个产品呢？你有没有遇到和我一样的困难？欢迎在评论区告诉我，我会持续分享我的第一个上线产品，教你建的后续的数据与迭代，敬请关注。

webcoing 的 产品要上线，真的远不止要去学怎么部署，怎么搞上线这件事情。我自己其实上线了好几个小工具了，在小红书上发布的是有那个扩音工具，然后我自己归纳了一下哈，其实你要上线 webcoing 的 产品最重要的一个点，它是从一个人用变成了 n 个人用， 那这个变化点它其实需要你引入很多额外的功能才能支撑这个产品去给很多人用。我先列出出来这样一些我认为是至少需要增加的功能哈，首先登录注册系统，每个用户要单独隔开，第二 使用记录，第三支付系统。第四，你要去做一些 api 的 监控和限额，防止有哪些用户直接把你的 api 又爆了。第五，爆错和监控机制。第六才是部署上线。所以其实你看，真的远不是我们把部署上线学会了，就能把这个产品搞定了，不是这么一回事哈， 那你可能又会觉得，如果把这些事情所有都搞定的话，是不是你的上限会变得非常的慢，然后中间要隔很长的时间。我自己的一个策略是这样的，也是我近期在那个口语工具里面是 实践的哈，我把整个产品的阶段分成了需求测试、付费一元测试和正式上线，这是三个阶段，那需求测试的阶段其实就是我们直接 webco 定一个 demo 就 可以，然后这个阶段主要是你要发视频去去到媒体上测大家的需求。举个例子，就是我最开始发布的那篇口语工具的视频，然后让大家在评论区扣一那篇视频， 那这个阶段一旦他通过了，就是他的反馈数据达到你心目中的预值了，咱们就可以再继续进入到付费意愿测试这个阶段，那这个阶段你肯定是需要让这个产品给 n 个人用了，但是呢， 由于还没有到正式上线阶段，你其实可以只开放给小部分的用户去用，并且呢每个环节你都不用做的特别尽善尽美，就是可以用一些折中的方案快速去测。我的具体的做法是，比如说登录注册系统开发起来太麻烦了，我就直接用一个邀请的机制，就是我只开发一套配置文件，我再手动去分发这个 邀请，就能让整个事情先快速的运转起来，先快速的让很多朋友去用起来。第二个使用记录，这个其实可以先用那个 web book 来搞一下，先不用搞那么复杂 支付系统我用的方式就是直接挂个链接挂车，让大家通过社交媒体上的电商系统来走支付，就大家支付完了之后，你再手动邀请他就可以，因为支付你开发的话，他不仅是有代码的量，你还要涉及到一些什么各种商户的接入啊这些事情做对啊，然后 再往下一个 api 的 监控和限额。这个第一是我会在功能层面上去做一些限制，比如说我给大家开放的适用版的口语工具，就是每个邀请就是能用五次 功能上的限制。其次呢，我自己在谷歌的 api 的 截断页面那地方，你就可以做一个限额。那最后报警和监控机制，我就直接把所有下单的用户，我就给他们建立上联系，我会写好我所有的联系方式，他们有问题的话就可以很快的联系到我。比如昨天晚上就有个用户跟我说，那个报告页面就报错了，还在修 bug。 那最后一个，其实你是把上面这些都完善了之后，他才是能正式的进入到部署的环节。部署的环节我这次在长签版我就是用谷歌直接不说了啊，这样的话也会非常快，不需要你学习什么 很多的专业知识。 ok， 那 等我把所有这些东西都搞定之后，你会发现花的时间并不是很长，然后咱们就直接开始去测，到底有多少用户愿意去给你付费， 以及他们付费了之后他们是不是有留存，是不是愿意持续的去付费，因为只有持续的去付费的话，你的产品才能运转的起来吗？那当你把这一套全部都测到 ok 之后， 我们才走到正式上线的环节。那这个呢，也是我近期正在准备的一些内容啊，等我们这个口语工具的产品走到正式上线之后，再来跟大家分享，在正式上线的阶段，我们以上的这些环节应该怎么样去操作，怎么样去补充。 ok， 那 今天就分享到这，记得一键三连，下期见。

哈喽，大家好，我是七帅，今天呢给大家分享个零到一外部定制出来一个产品的流程和过程，整个流程步骤一共有八步，今天我们挨个去梳理一下，我们首先看第一个是发际需求， 我们在日常工作和生活中一定会有一些目前市面上有的产品不能满足我们的，那这些需求我们要梳理出来，看看能不能通过产品的形式去解决， 我们接下来看第二步，我们把我们的需求给了豆包，让我问一下豆包，我们这个需求看能不能用产品的形式去解决，如果说用产品的形式去解决，让豆包分析一下我们接下来应该去重点完善做哪些功能， 也让豆包去梳理一下我们未来这个产品的市场前景以及需求的重要的痛点。第三步，打开 openai 下载酷贷斯。目前为什么说推荐大家下载酷贷斯，因为酷贷斯目前相对来讲比较便宜，所以说我们接下来就看到第五步，去海鲜市场 大概八块到十块左右，可以买一个 team 团队的一个拼车，这个可以让我们去使用目前 openai codex 最先进的模型五点四， 但是五点四的模型它的额度消耗比较高，它是正常其他模型消耗的两倍。如果说你的 codex 一个团队用完，我推荐你再去买一个 team 的 账号，这样就像我的 codex， 我 现在有四个团队，我就切换为其他另外一个团队的账号。 第六步，我们刚才让豆包已经梳理完我们的需求了，梳理完以后我们就让豆包给出我们 mvp 版本的 promote， 为什么说要做 mvp 版本？毕竟我们是从零到一，也是第一次去 webcointing 出来一个产品，为了能够提高我们的自信心，所以说我还是大家先从简单的做出一个一个 mvp 版本的一个产品出来，整个 promote 也可以让豆包给的 promote 挨个一步一步的去粘贴到我们的酷黛斯的对话框里面。 第七步是和库黛斯对话调整，因为毕竟库黛斯第一次去生成的产品可能不是我们想要的，比方说 ui 一 些功能不是我们想要的，那么这个时候我们需要和库黛多人的去对话，去调整我们想要的产品。其中这里教大家一个对话技巧，如果说我们不知道去怎么描述，我们就 给库黛斯发了截图，给库黛斯发了截图中间我们也可以用框框来告诉他这个框里面东西怎么改和正常，我们把库黛斯当成一个正常的一个开发同事去对接，这样子对接的过程中呢，我发现其实库黛斯比有些同事理解起来更方便一些。 最后一个就是部署 windows 上线，这个相对来讲稍微比较复杂一些，不过我们可以把库黛斯当做我们的一个智能的小导师，有什么事情哪不会哪不懂的呢？让他给出详细的步骤，我们按照库黛斯的步骤一点点去部署于上线就行了。 目前这是这几步，就是从零到一 web 出来一个产品的过程，其中还有其他的一些小小的坑，我们等后面再分享。

这是我最新爆单出来的 web coding 零基础入门教程，完全免费开源，刚刚发布就爆了，可见现在 ai 编程有多火。这套教程足足有几十万字，上千张图，结合了我两年半的 ai 编程经验、多年项目开发经验和产品变现经验， 我的目标是帮助任何人快速掌握 ai 编程，哪怕完全零基础，也能开发上线自己的产品并盈利。 臭不要脸一下，我敢说，这套免费教程吊打百分之九十的付费内容，毕竟我投入了足够的时间和毛发，你不仅可以在线阅读，还可以获取到原始的教程文档。 有同学会问了，哎，什么是 web coding 啊？简单来说， web coding 就是 用人话和 ai 聊天，让 ai 帮你写代码， 你不需要记住任何语法，只要把需求讲清楚， ai 就 能帮你生成。以前学编程要几个月，现在学用 web 秃顶，几天就能上手。今天想到一个点子，今天就能做出来。 网上虽然有很多 ai 编程教程，但要么太碎片化，要么只讲工具不讲方法，要么缺少实战案例，这就导致大家学习只能东拼西凑，搜到一个学一招，很难系统地掌握 web 秃顶。 因此，我出手了。相比网上零散的 ai 编程教程，我的这套教程含带了歪不透顶的方方面面，我精心梳理了内容结构，能够让你一条龙学习， 从零基础入门，十分钟做出第一个项目。学会多种 ai 编程工具，实战各类 ai 项目，掌握 ai 编程核心技巧，跑通产品变现全流程，再搭配 ai 编程学习资源、 ai 知识百科常见问题解决手册， 能够帮你玩转 web targeting， 解决各种需求。教程以实战为核心，配有丰富的项目案例和大量的截图视例，不怕你学不会。 任何想用 ai 提升效率或者想要制作产品盈利的同学一定不要错过。我会把自己做过十多的自研产品，从零到二百万粉丝的经验都分享给你。我一直相信知识分享是互利共赢的。这套教程完全免费开源，希望能帮更多人打开 web targeting 的 大门。 但毕竟是我一个人编辑的，会有不足的地方，我也会持续更新和完善内容。那如果这套教程对你有帮助，希望能点赞或者 star 支持一下？别犹豫，现在就打开教程，十分钟后你就能做出第一个作品，跟着鱼皮一起开启 webtoon 之旅吧！

哈喽，大家好，我是七帅，今天分享一个教程，任何人都可以从零开始用口袋子开发一款 app， 上线 app store， 这是我大概用了大半天的时间做的一款产品决定转盘帮你做决定，这款产品现在正在审核中，今天把我做决定转盘帮你做决定。这个产品的完整的思路，从最初产品的构思到产品上线提审这全流程，用这一个视频给大家讲清楚， 这个视频的时间较长，希望大家能够看完。首先我们先看一下说我做 app 我 前期做了哪些准备。第一个是 apple 的 开发者账号，这个是前提，如果说你没有这个开发者账号，我们是没有办法提审 app 的。 第二个是拆的 gpt 的 会员，这个因为我后面用到的一些编程工具都是通过拆的 gpt plus 会员才能进行操作的。 接下来是扣贷，是客户端，下面这个是 mac 电脑，因为我们开发 ios app 必须得用 mac 电脑，所以说这个也是必须的硬性基础。下面是豆包，好的，现在我们开始讲第一步我是怎么构思这个产品的。 首先我做这个产品的目标是为了能够录一个从零到一做 app 的 一个教程，所以说我就给到豆包，我问，我想作为讲解视频，主要是讲解整个过程，我希望能从产品构想到最终上线到 app store。 我很明显的告诉他这是一个案例，也不用拿到多少下载量，只不过是一个产品，你认为我做一个什么样的产品合适？他回复我说，因为结合我之前我和豆包的聊天，他知道我大概的背景信息，他给我匹配了几个产品，第一个是邮票的管理，第二个是宝宝成长， 第二题里是做番茄，还有做每日记账。在整个独立开发者社区里面，大家都知道独立开发者社区的三件套，记事本、 to do list 还有记账，所以说我不想做这三个产品，那我接下来就问他， 你还有没有其他的思路，你还没有其他产品可以介绍给我的，他结合我自己的个人兴趣和身份，第一个是 ai 提示词，还有个设计灵感，接下来是健身打卡、 重要日子的倒计时等等，相关的这些其实我都不是特别感兴趣。接下来我就发现有一个我特别感兴趣的叫做决定转盘 app， 你 看这个 app 非常有可玩性，而且它比较简单，它相对来讲只有前端的页面，它不用做后端的接口，做后端的服务器，只要有一个前端展示就 ok 了， 那么我就决定做这个 app。 所以 接下来我就给豆包说，我接下来我要做决定 app， 把这些核心功能都转给他，说这个思路不错，你帮我详细介绍一下。他接下来就给我详细介绍一下，说主要的核心功能以及技术的讲解等等。其实这些我没怎么看，因为我也用不着， 接下来我就再给他输入提示词，把这个思路整合成一个我发给扣贷斯的提示词，因为我后面会用扣贷斯去帮我实现，所以说他就帮我去用扣，接下来他就帮我生成了一条适合给扣贷斯使用的提示词，就这样你看有那么多，接下来我就把这个完整给复制下来发给扣贷斯。 好，现在我们看到的是扣贷斯扣端，我再把刚才豆包给我的提示词粘贴到这里之前，我先给扣贷斯发那条命令 说你现在要新建一个项目独立的 ios app， 不要和我之前的项目有任何的混合。他回复我说已经创建了一个独立的 ios app 项目，具体地址在这里，其实这些我也看不懂，接下来我就把豆包刚才给我生成的提示词完整的粘贴到这里发给他。 特别注意一点，我开启的是计划模式，你看裤带也是完整的，按照我的这个提示词的要求帮我去做了，按照我的计划模式帮我去实施。做了那么多东西，写了很多啊，其实我都没怎么看， 做完以后我就告诉他，你实时计划吧，既然你看他处理了九分钟多，他把这个事情帮我做好了，做好以后我想把这个产品直接在我的 iphone 手机上帮我打开。 接下来他就回复我说，我现在还不能在我的 iphone 上打开，因为我的手机版本的系统和我这个叉扣的的系统是不一样的，所以说我的叉扣的里面需要去安装设备支持组建，需要安装 ios 二十六点四的组建。那接下来我就让他去帮我去安装 ios 二十六点四的组建。 他装装，装了很长时间，因为这个比较大，需要八点多，接下来很长时间，他思考了一会就说，那你先下载吧，下载完以后你骑会就行了。 等我下载完以后，我就给他说，我现在我已经完成了，你再看一下他，接下来接着去思考，就发现说我卡在签名用户， 后来我才发现其实我是开发者账号，为什么说会卡在我的签名账户，让我再让他再看一下。看完以后发现其实他是因为登录了我另外一个账户的开发者账号，导致于我的签名是有问题的。思考完以后，他把我这个有权限的这开发者账号的信息给登录上来了， 接下来他就把我这个产品就装在了我的 iphone 手机上，接下来我告诉他，你在我电脑上打开，接下来他又用我的电脑打开了模拟器，把这个 app 帮我跑了起来。我用模拟器打开看了一下，看完以后其实发现它里面是有些问题的，接下来我就告诉他， 你修复 bug 一 共有四个 bug， 这四个 bug 我 都很明确的发给他了，发给他以后他又处理了三个问题，都已经更新，模拟器和真机构建都已经重新通过了。 通过完以后我又发现我毕竟不能每次都打开手机，比较麻烦，那你再用模拟器打开给我看一下。打开模拟器看的时候又发现其实他又有些问题，你看他转盘里面是没有信息的。 第二个是做完以后这些信息是乱的，我就告诉他，你看这两个信息是是乱的，你善变不匹配的情况你要帮我修复，而且这次特别强调了一下，你自己多次测试以后，再打开个模拟器给我看，你不要总是做完以后就给我看，浪费我的时间。这个时候他又去处理，两分钟多把这个产品已经构建完毕了。 勾结完毕以后，结果我又发现了问题，没有，转之前的时候他是六个，当转完以后，结果这两个扇面他是没有信息的，所以说我就又明确的告诉他，这明明是六个选项，但是转盘里面两个选项不显示，而且内容还没有很好的匹配到这个转盘的扇面上， 让他去检查一下，或者是你换另外一种方式也行。最后我又强调了一下，你做好以后再打开模拟器给我看。 接下来他又去做，经过各种处理，最后他提醒我说，如果你愿意，可以把今天吃什么和其他的两个选项他自己过滤一遍，最后做一遍视觉验收。他这次处理时间比较长，处理的七分钟多。验收完以后呢，又发现我的桌面模拟器的桌面和我手机的桌面是没有 app 图标的， 那这个时候我就开始去做这个图标，接下来我再给大家分享我怎么去做这个图标的。好的，现在我们再次打开豆包去讲解我怎么去做应用启动图标的 前提，给大家说一下，我做这个图标全程都没有打开设置软件，全是通过 ai 帮我去完成的。首先我想做 锤子科技，锤子手机之前那个 smartinos 相关的那些你物理的图标，因为我当时忘记了这个 smartinos 当怎么打怎么写，所以说我先问豆包锤子科技的手机系统叫什么？他回答我顺带的给我一张图，这个图很好啊，我就把这个图发给了豆包，我说你看这组图标， 你要反向描述这个图标的提示词要精准，确保我按照你反向推理出来的提示词能够生成我想要的 icon。 接下来都包给我了一些提示词，首先是一个整组图标的提示词，还有单个同风格图标的生成提示词， 其实下面这些没有用，我直接用第二个中文提示词，我把这个单独给复制了下来，复制下来以后我就放到了，我就放到了我的拆的 gpt 里面图片生成模块，接下来讲怎么去用拆的 gpt 把这个图片生成，现在大家看的是拆的 gpt 的 外部端， 我把我刚才豆包给我的提示词放到下面，我告诉猜猜 ppt， 我 想要一个类似于抽奖转盘的 ios app 启动图标，要求如下，并且将宽高比设定为一比一。 这个时候他返给我一张图片，我认为这张图片做的已经相当不错了。接下来我就没有去做任何修改， 我就直接告诉他，因为你这张图片不是最终放在应用商店的可以用的，因为它周边有这么多白色的那个地方，还有投影，就是你把这张图放在社交平台上是没有问题的，但是其实你放到那个提审还是有点问题的， 那我接下来会给他说让这个 icon 充满整个画面，因为我只有这样，我拿到这张图，我才可以上传到我的 a b 十二里面去。接下来他给我返来这么一张图片， 我认为非常好。接下来我就把这个图片复制给了 codex， 让 codex 把这张图作为我 app 的 启动图标。现在我们回到 codex， 这个图就是刚才拆的 gpt 给我生成的图标，我直接粘贴过来，然后把这个图设置为 app 的 桌面启动图标。 思考完以后我就想你不能光生成，你在模拟器打开再给我看看，所以说它大概处理了十二分钟多，把这个事情给做好了， 接下来他问我要不要把这个图标重新安装到我的真机上，我也没回答他，我就想下一步我想直接把这个产品上架到 app store。 好 的，他接下来你看说按照能过审来收尾这个产品了。首先他说我上架之前先补齐这几件关键的事情， 有数据合规、产品的完成度等等相关的。其实我接下来也是按照他给我的建议去做的，他说我先别着急提审，先补这三样东西等着，因为我之前提审过产品，因为我知道需要隐私业的。接下来就让他去帮我去做这两件事情， 第一件和第二件生成一个可上架用的隐私政策的文案页。我突然间想到这个图标版权是我自己做的，我用 ai 做的，为什么会有版权？所以说你不要改我的图标了，你先给我上架用的隐私政策页才给我了一个。 其实这里有一个技巧，很多产品它需要做一个独立的网页去承载我们隐私政策的，但是我没有这么做，我是用非书文档，我把它给拉客档的这些文件全部给复制下来以后，我就直接创建了一个非书文档，把这内容给粘贴进去， 并开启了互联网的访问权限。因为我之前两个产品这么做都没问题的，所以这次我还是这么做的。 ok， 下面告诉他，你开始做。第二步，他也是把这个什么整个商家用的相关的产品都帮我去描述好了。描述完以后，这个时候其实需要我去 app store connect 里面去填写的， 上传 appstore 里面其实有很重要的一步，需要你上传几张你的 app 的 截图的，我们在应用商店看到的那几张图，你开始做 app 的 截图方面要上传，做着做着突然间我的那个 token 不 够用了，呃，我后来干脆想算了，那我自己用手机截图截了三张传上去了。 接下来我就把这个链接 appstore 的 这个链接发给他说，你现在打包上传到我的 appstore， 接下来开始打包开始构建产品 国家完以后他问我说你要不要直接上传？在上传的时候其实他需要横屏的，因为刚开始做的时候，我这里面是没有做横屏的，只是竖屏，但是插口的提醒我必须得有横屏的。所以说我接下来说，那你把竖屏提醒给清掉，再正式上传到 a、 b、 c 二。这次处理的时间特别长，三十一分钟他开始上传了， 但是卡在创建 app 记录这一步最主要的原因，因为我决定转盘这个名字已经被占用了。接下来他给了我三个选项，我就随机选了一个。接下来他开始帮我构建，构建完成以后， 这个其实这边已经没有什么太大问题了，已经开始收尾了。我上传 a、 b 十二时候发现其实有些信息我是懒得填，我就告诉他你把这些内容给我，他下面就开始把这些文本给我，我就直接粘贴过去就行了。 置顶完以后我就发现我这个图标，你看它是默认的，为什么没有显示我的图标，我就问这里怎么不显示图标呢？他告诉我说这是正常的现象，因为他上传上去以后需要一些时间的加载，等过了一会我去刷新了一下，发现那个图标真出现了，没有问题了。 接下来我在提审的时候又发现一个问题，必须上传 ipad 截图，还有年龄分级信息等等。 我又把这个截图发给他了，我说你要给我一个十三寸的 ipad 截图，再给我一个技术知识的内容， ipad 截图我拿到了，直接传上就行了。接下来是这个技术知识的 bug， 我 点开以后跟我刚才是一样的，我把这个也是放在了我的非书文档里面，创建了一个非书文档链接，把这个链接直接粘贴到提审技术知识 u r 里面就可以了。接下来你看他给了说正我这些都我都没看，我直接就直接粘贴复制过去了。 后来我又发现问题，你选择类别， a p p 信息里面设置内容，版权信息等等，它又给我提醒说类别怎么填，我又把它给填上去了，我按照它的信息去填，填完以后发现我整个 a p p 字号是没有问题的，完整的提上去了。 也就是说到现在为止，我是从最初产品公司到最终 app 的 上线，我都已经做完了，已经把这个流程也给大家完整讲述完。提审完以后，这里会看到一张图，是在审核中，这个时候如果说审核成功，这个产品直接上架了。一般情况下 我们提审完以后可能会遇到一些问题，他会给拨回，也告诉我们一些拨回的原因。那接下来我们把拨回的原因 完整的复制，再粘贴给 codex， 让 codex 帮我们去解决。行了，解决完以后再让他帮我们去把这个版本去提审，反正 你不折腾个两三次，一般情况下是不会过审的。我之前上传一个大概折腾了四五次才上线，所以说这个地方大家希望有一些耐心，多次跟 codex 沟通就行了。好，这次分享到这里，希望大家能够喜欢。

我用微博扣顶的方式上线了三个小程序，一个叫做马上表白，他主打的是祝福场景，通过发贺卡或者发表白信的形式发给对方。第二个呢是 m b t。 信息助手，主要打的是个人认知， 它这里面可以通过七十多道题去测试自己的 m b t i。 性格，会有八千多字的这种报告。除此之外呢，还包含了很多场景的测试，比如说恋爱、工作、社交、学习等场景，以及还支持具体的 m b t i。 的 人格，加上你具体的问题，找到个性化的解决方案。 第三个呢是保质期计时器，你可以输入你自己的一个物品的生产日期以及他的保质时间，会自动给你去计算还有多久过期，以及会给出相关的一些提醒。这三款产品呢，分别是从情感表达、 自我认知和日常效率这三方面去设计的。从构思到上线呢，我也跑完了整个从零到一的闭环。我个人认为在 ai 时代呢，没必要去追那种所谓最新的 ai 工具， ai 的 价值是解决实际的问题，而不是说你贵了多少个 ai 工具，我认为这才是 ai 时代的核心竞争力，你觉得呢？

非常开心的跟大家分享啊，我 web coding 的 个人网站已经正式上线了，那整个这个网站呢，是通过 ai 的 编程工具来全程实现的，我是没有写任何一行代码，包括这个网站的上线部署，也是我拿了三个 ai 同时问，不停地问， 对于一个没有任何运维背景的人来讲，帮助我实现了网站的上限。今天这个视频呢，跟大家分享几点。首先呢，我们来介绍一下这个个人网站，简单的介绍一下。其次呢，最重要的就是跟大家分享一下，我是如何用我的这个基于 cloud code 和 vs code 的 这套工作台把这个网站搭出来的，因为这个网站的编辑其实都是在 cloud code 的 工作台里边，理解了我原有的相关的一些资料，自动生成出来的。第三呢，就是分享一下我在做这个网站中的一些使用 ai 进行 web coding 的 感受啊， 我们先来看一下这个站点，这个站点网站的地址， p m 杨坤点 com。 进来了以后呢，也就是一个一般的个人网站或者是咨询类网站的结构啊，主要主要是我的个人介绍 啊，我讲过培训过的客户以及我的核心的课程，因为我主要工作还是给企业做咨询和授课。再往下呢，就是我的 webcrm native ui 的 crm， 这个 crm 过两天我也会把它放到这个站点上，让大家直接去能使用体验。再往下呢就是我做过的 skill 放在 excel 上面。 然后呢是我写的三本书，还有第三本书马上上市，还没上市呢。再往下呢，是我的公众号的几篇代表作的文章啊。最后呢，就是结尾部分啊，当然这每个板块会有更详细的页面可以点进去。这个除了 pc 版以外，还有移动端，我们现在切换一下移动端给大家看一下 啊，这就是移动端这个网站的移动版，它会自动的根据设备形态做切换，整体的布局内容都是挺好看的，是吧？ 除此以外呢，我还在这个网站里边植入了百度统计的代码，我可以去看这实时的访客，还有流量的一些情况。当然这网站没什么人看啊，因为就是我个人目前做着玩的，这 就是整个网站的一个内容啊，这也是一个很标准的网站，网站内容没什么多说的，我想分享的就是我是如何做出来的，因为这个制作的过程很有意思，大家如果看过我之前的视频的话，知道我非常推荐的就是 vsco 加 cloudco 以及 vsco 里边有一个 cc 的 插件。这么一套 工作环境啊，那我整个的这个网站的制作，其实我是没有给他提供任何素材的，因为我的这套工作环境之前已经把我的项目写的书，我的个人的履历全部都作为上下文沉淀下来了。所以其实我当时做这个网站的时候，只是把我脑海中的 一些想法和对这个板块的初步的预想规划告诉了 ai， 他 就去帮我自动完成了。当然这个板块的设计，其实 top 也给我出了很多方案和建议啊。那在这个 vsco 的 这个工作台里面，大家能看到 course， 其实就是我目前做个人网站的一个 项目文件夹，那在这里边呢，也会有 memory 的 记忆文件，这个记忆文件里边是 cloud code 自己整理的一些关于项目的情况以及一些约束等等。 box 下面也是 cloud code 的 自己整理的，可能是网站的一些部署啊。 design system 是 之前我在做这个 ui 调教的时候，一些沉淀下来的过程性的东西。这个网站的源代码呢，是在 site 下面， 它用了一个前端的静态纯前端的静态网站的架构啊，这咱也就不太懂了，这就是这个网站的结构，这个网站其实所有的东西都是来源于我已有的内容，比如说关于我个人的信息，其实主要是来自于 memory 下面我之前录进去的一个个人的信息，给大家看一眼啊， user life， user， my identity 啊，就是这些文件，它会从这些文件里边去呃，取到我的一些个人的 官方的对外的宣传介绍，这个都是我之前已经维护好的。那再比如说啊，我的课程信息，他是怎么拿到我课程信息的呢？因为我之前说过我经常要给客户去做一些课程，那其实我自己的完整的课纲就是在我这个 cos 下面，这个也是 ai 沉淀下来的上下文啊。 md 文件，大家可以看到我把它放大一点在这边啊，这个就是 我们来看一下啊，这个 quizhomepage 就是 我刚刚讲到的一些网站的目录，再往上呢，这个 quizworks， 其实下面就是我的一些比较零散的项目，比如说我写的文章啊，还有这个 course 就是 我的课程，那 ai 就 会从这里边去抓取我的课程信息，去生成那个课程的板块， 还有关于我的做的这个 sfa 的 crm 的 项目的信息，那那个项目的信息是从哪搞到的呢？它会自动的识别我在做的这个 crm 的 项目，也就是这个文件夹啊，大家能看到吗？这个文件夹里边有这个项目相关的情况，以及我的 做的这几个基于决胜弊端出的 prd skill， 目前在 github 上面都有一百多的 star 了，那它也是从我这个工作路径里边去抓的，就是在我的这个 quens skills 下面是 skill 的 信息。那以及这个网站中啊，里边不是还有一些我在公众号写的文章的精选吗？那那个东西是哪来的呢？因为我之前是让这个 cloud 把我的公众号所有的文章 从公众号里面抓取过一次，所以它是在这个 arte 的 wechat archive 这个文件夹下面，这个是我所有的历史的规章的文章，当时都是从这儿抓下来的， 那么他抓下来了以后，其实 ai 会自动去挑一些比较有代表性的，点击量比较高的文章，当时让我去挑啊，然后去看，呃，这个，呃选用哪几篇？当时我选用了几篇，那这个网站中最后一个板块的内容就是我的写的三本书，那三本书大家应该能看到他其实是，呃有这个书的封面，然后呢， 还有书的内容介绍，豆瓣的评分，甚至包括书的一些不同的购买平台的地址啊，这都是能打开的。这些信息是怎么抓的呢？这是我把豆瓣的网址扔给 ai 了以后，他自己去从豆瓣理解了内容，然后抓下来的，所以真的还是非常非常强啊，全程 我是没有提供什么素材的，基本上都是让 ai 来完成的。那当然也有个前提啊，就是我的 一些上下文的 context 是 比较丰富的，因为我其实这套工作台已经用了很久了，沉淀了很多我的上下文信息，如果你没有这些沉淀的话，可能你自己得手工去做很多很多的内容，但是有了我这套呃，这个上下文的管理体系，那 ai 帮我做这个个人网站就非常方便了啊， 那这个网站的部署也非常容易简单啊。就是，呃，如果想部署的话， ai 就 会给我一个命令，其实我打开 power share 一 输就是两条命令的事，一个是打包一下文件，第二个呢就是连接一下远程的虚拟机，然后输入一下密码，它就自动去把网站上传上去，然后马上就生效了，所以非常非常的方便容易。 那最后呢，我想讲一下，整个这个项目实操下来，我觉得和 ai 结合里边对于我来讲最大的一个难点和挑战。其实对于我来讲，做这件事情最大的难点不在于如何去做部署上线，如何去规划这个网站的内容，因为这些 ai 都可以直接给让我觉得能马上用起来的建议。 最难的一点反而是这个网站的 ui 设计，当时这个 ui 设计如何让它好看，符合我的审美要求，这个其实反而对我来讲花了比较多的时间，而且也给我造成了很多的困惑。因为我之前去用了一些 skill 官方的 github 上面的做网站的 ui skill， 但我发现它们都不太符合我的要求，不太好用。 呃，就是做出来东西不是让我很满意，但我其实我又说不清楚我想要一个什么，因为我毕竟不是做 ui 的， 对这块不是很懂， 最后是无意中怎么发现做出来现在这套 ui 的 呢？是我用了这个一些做 ui 的 skill， 无意中看到了作者的或者他们背后公司的官网，我一看说，哎，这套风格我比较喜欢，于是我 把那个 u r r 贴给 ai 了以后，让他去理解了这个做 ui 的 skill 背后公司的网站，我选了他的那套交互的风格和 配色的方案，作为我们现在这个站点的风格。所以我想说一个什么样的感受呢？就是我发现你想用好 ai 还是得自己得懂，如果你自己都懂不懂的话，你跟 ai 去沟通，你都表达不清楚你的观点和你想要什么。例如在做整个这个网站的 布局 ui 设计的时候，其实我感觉自己用起来还是很痛苦的，就是 ai 给出来的总是不符合我要求，但我又说不清楚让他往哪个方向改，那最后有可能把 ai 就 搞崩溃了，他就会说，你到底想干什么是不是？所以想用好 ai 还是需要自己首先得懂，如果你自己完全都不懂的话，你是驾驭不好 ai 的。 最后再说一个小彩蛋啊，我们来到我这个网站的关于部分，来到最底下，最底下，最底下，在这有一个小彩蛋， 点开以后就会发现，哎，这是什么呢？这是我高中的时候做的一个个人网站，其实我从初中就开始做做个人网站了，大概可能是两千年的时候。那这个个人网站是二零零四年的时候啊，这是当时纯手搓 html 加 css 代码， 这个网站我当时在百度云盘上，后来就备份了，一直没管过啊，前两天我就突发奇想把它下载下来了，然后呢，在本地跑是跑不了的，因为这个网站的代码架构太老了，所以 浏览器都打不开啊。后来呢，我就让 cloud code 帮我去修复了这个网站啊，然后他就能打开了。这是我曾经自己的个人主页，很有意思，我看了以后也觉得非常怀古啊，非常考古怀旧啊！对对，非常考古怀旧，非常好玩。 当时 cloud code 的 这个修复网站的时候很搞笑， cloud code 的 都有几次都崩溃了，因为它修来修去发现这个代码实在太老了，它可能修完以后不 一定能跑起来，当时也是做了很多轮。我就看 cloud code 说这个网站是用的零四年的 i e 的 一些 javascript 的 规范技术啊，我要尝试去修复，非常好玩啊！这是个小彩蛋，大家有兴趣可以去上一下我的个人网站。好，今天分享就到这里。

哈喽，大家好，你们跟朋友出门玩是不是也每次都去哪吃啥干嘛，问一个答一个，随便，最后刷好手机，各回各家。今天我们就做一个出门不随便网站，开启我们的定制之旅吧。 在见证目的里选择其他文本框内填入需求，请帮我制作一个出门不随便网站，适合和朋友出门纠结，不知道去哪，不知道做什么的时候使用。 当然我们也可以具体下来写，专为年轻人和好友结伴出门设计， 不用纠结，不用想。然后项目数量充足，至少二十个以上的出门事项不重复，适合两人或多人出发，立马能做的事不复杂，而且在日常里面都能做。点击下一步，在这里选择风格， 点击生成，再点击提交。 现在出来的是一个设计稿画面，我们可以用鼠标双击更改文字，比如朋友出门不随便， 或者我们可以单机图片进行更换图片的修改，而单机选择需要修改的地方，让 ai 帮我编辑。 一切完成之后，在左下角关闭设计，点击确认设计，等待完整的网站为我们生成。在网站生成之后，我们可以先查看预览效果， 比如看一下是否适配手机端， 或者看一下其他的功能是否也为我们展现了出来。 分享我的出门事项以及事项库。不合适的地方可以用右上角的神奇画笔勾选，让 ai 修改这个区域，或者直接在左下角对话框进行全部修改， 结束之后点击右上方发布网站按钮，可以一键部署生成网站链接。 有了这个网站，下次朋友问你去哪，你直接甩个链接过去，让他自己转，不用做完美的计划，随机的出发。这期内容就到这里，关注我，解锁更多灵感玩法。

保姆是 web coding， 自己的作品集网站来啦，几千人点赞收藏期待的。 呃，也是终于干出教学了。其实收到了很多留言，我没有想到很多同学和设计师朋友因为没有下载和了解过呃， codex 这种 ai 编程软件， 所以说在下载这一步就遇到了很多问题，那为了照顾到粉丝朋友啊，设计师朋友，外部小白这一期将不会下载任何的软件，用最简单的方法教你去搭建一个属于自己的可以随意创作的呃 ai 作品的网站。 那么首先先说结论吧，最简单的方法就是用谷歌的 a s studio 全程完成前灯大码和部署上线。首先 一开始点开他就是这样的一个界面，可以看到按钮还是比较多的。那作为一个保姆式教学的话，我就不告诉你们每一个按钮的作用了，你只需要知道在 build 的 界面的这个输入框描述你的想法，然后点击输入即即可。 比如说我现在输入的这一段就包含四个部分，一个作品的网站，第一个是联络信息，第二个是个人介绍，第三部分就是我的一个项目展示，第四部分就是我的一个技能展示，那我们点击开始就可以了，等待它去生成完毕。 ok， 其实可以看到它现在生成的 呃，已经是一个可用的框架了，对不对？包括我们的个人信息，呃，工作经历，项目展示，核心技能，还有联系我， 那，那其实它的使用就是这么的简单，那现在的话，可能它的效果没有那么的好，其最主要的原因就是因为我的贴纸非常简单，没有去规范它的一个视觉效果， 那如果想要一个很好的效果的话，我可以分享一个我的一个工作流，你们可以直接按照我的步骤就可以一键生成非常好的效果的。那我们可以首先打开这个网站，呃， motion size， 呃，可以看到里面会有很多好的一些效果的一些预设，那我们可以直接找到自己想要的一些模板， 比如说我觉得这个比较好，那我们就可以直接复制它的格式，然后来到我们的谷歌的 a s 丢丢，然后还是 build 的 这个描述，我们可以直接复制它提示，然后开始创建就可以好 生成了。这边好像是已经生成好了，哇，可以看到这个的效果还是很惊艳的， 对吧？其实到了这一步你的作品质感就已经很好了，后续只需要完善一些细节就好。其实无非就是两点，加内容和改内容。那例如说加内容的话， 比如说哈，我想做一个放置我图片和视频的步步流，怎么加呢？选择这个风格在下一页 好，可以看到他做好了看没有，在下一页他就会展示的这一个物流的一个选项。那第二个无非就是改内容，那比如说我们想改这一段文案的话， 对啊，我直接把它复制过来，然后说把这个玩意改成，嗯，改成兰兰，嗯，安迪吧，安迪然后发送，可以看这个应该非常的快， 可以看到它就是改好了。总之就是左边你用自然语言去描述你的需求，右边就会直接生成对应的修改， ok， 那 就无非这两点，就大家可以自由的发挥你的创意。 然后最后就是如何部署生成一个连接，可以发给 hr 或者业务呢？那其实也是可以在这里直接问的，比如说我说，呃，如何部署上线？说，啊，对，如何部署上线用中文回答，我可以看他本来就是用中文。 嗯，可以看到这里他就给了我一些回答，那么按照他一步步去做就可以了啊。这一点我想说的是，因为我经历过，一旦你去做好了自己的心仪的网站，后面跟着 ai 部署的每一步，你都会是开心的，因为他就像进度条已经走到了百分之九十五一样，你知道他要成了，所以说你一定不会觉得他麻烦了。 ok， 那 这应该就是全网最简单搭建 ai 作品网站了，说一下我的经验吧。 啊，我想说的是，首先第一步非常重要，因为一旦你开始做了之后，往往你就会沉迷其中，真的因为我甚至是当一些牛马下班了之后回家都想都会想玩玩玩扣顶。 第二点就是我的作品网站其实我觉得做的还是比较不错的，如果大家想要参考的话，可以看一看我往期的作品好。第三点就是说有些同学可能说他自己非常急用，短时间内做不出来，想问我可不可以去直接用我代码这个事情呢？首先我想说是 我是可以给一些小范围的人用的，但是肯定不可能是无偿的，而且我更希望你们都可以掌握这个技能，自己先试一试，因为能够帮助到你们才是一开始我做分享的一个初衷。 嗯， ok， 那 这期视频就到这里，那大家都去试一试吧，如果有什么问题可以打在评论区，然后我都会尽力一一去解答的。然后如果有一些问题出现的频率非常多，那我后期也会愿意专门出一期视频去进行分享。

太炸裂了，兄弟们给大家看一下我们最新上线的站点，这个站点所有的交互 ui 设计全部是由 ai 完成的，在这期间没有用到任何一行代码开发，连 ui 设计师都不需要了。 放以往这种效果的站点可能需要三到四个月的时间，而现在通过 ai 一 周都用不了。二零二六年， ai 建站的时代真的来了。

哈喽，最近我把手抽的工作流外扣顶做成网页，真正实现素材产出流程自动化来看效果。操作非常简单，第一步，上传想要参考的视频。第二步，上传产品的多细节图。 第三步，上传人物图。第四步，上传背景图。第五步，上传产品介绍。然后还可以选择是否需要口部文案 问题的话，开始生成 ai 就 会直接拆解出这一条视频的二四个分镜，再结合刚刚上传的产品图和产品信息，生成一版新的内容脚本。接着 ai 会继续裂变生图提子，直接生成十二分镜图，我们来看一下效果。首先我会从多维度判断这是不是一张合格的分镜图， 如整体的画面质感是否真实，产品的内外包装是否一致，以及分镜图的内容是否丰富。这一步没问题的话，下一步就可以选择继续开始生成后十二分镜图， 来看一下效果。那这个后十二分镜图更多体现的是产品的卖点细节。 ok， 那 前后两张分镜图都没问题的话，下一步我们就可以上传文案， 生成对应分镜图的视频贴纸。最后我们只需要复制贴纸粘贴到 cds 来生成视频就 ok 了。来看一下效果， 比外面店里做的还好吃，做法真的很简单，水开下面饼，我家常备的这个大碗面，它可不是方便面，是非油炸的，还是小麦粉做的，广东三十多年的老品牌了，吃着也放心。把目前这一套流程跑下来，我总结了几个产出素材的方法。首先，如果想实现好的视频效果 分进图里，一定要体现出真实感，包括画面真实感、产品真实感、人物真实感。这也取决于我们最开始上传的素材，我觉得重要的不是怎么写题词， 而是能不能总结出方法论，让 ai 帮我们稳定地产出适合自己产品的贴词。那么在后期人工就只需要负责审核以及准备好产品素材就 ok 了，基本的思路就这样。好了，以上本期视频内容就有用的话给我点赞关注，咱们下期见，拜拜！

前两天我发了条视频，说我花了两天的时间做出一个软件产品，没有写一行代码，花费成本大概是七百元。在视频的最后，我说如果你也不会写代码，你也想从零到一打造一个产品，那么在评论区告诉我 收到了非常热烈的反馈。那今天的视频我就来跟大家分享整个产品打造的流程。首先先给大家看我最后做的产品叫做 covermagic， 你 们现在已经可以访问这个网址了，网址是 covermagic 到 site， 翻译成中文大概就是魔法封面的意思。 这个工具是我自己每天都会使用的，因为我大量的生产视频，那视频需要高点击率的封面，不然你的视频内容再好，在小某叔这样的平台上没有点击率，后面的都是白费。我 自己之前尝试用作图工具去做，但是都不尽如人意，我也尝试想要去找个设计师，那设计师呢？一个是成本非常高，像我们一般一张可以发在朋友圈的一个手机屏的海报，成本都是几百元的人民币。第二个是跟人的沟通非常耗时，这个中间的来来回回的反复修改，可能每一个封面都要花几天的时间， 所以我一开始就想是不是可以借助 ai 来帮我生成封面。确实做到了，因为我现在的所有的封面都是我需要发布视频的时候，我借助这个工具去生成的。 有很多身边的学员包括我的粉丝在评论区提问说，哎，你用什么做的封面？可不可以给我用一下？但是这个工具本身成本是挺贵的，我每次点击那个开始生成封面，它生成三张或者六张图， 每张图的成本都是几十美分，所以我就想能不能把这个工具产品化，接上用户的登录注册系统，这样的话他可以查看自己过往的生成记录，他可以去充值，他可以去使用我的 a p i， 可以 去使用，我调试了很多遍，调试出来的这个生成的效果按需付费，同时呢也能让自己拥有更高点击率的爆款视 频封面，这就是这个项目的背景。先给大家演示最后的成品，选一下你的视频比例，然后你写一下你在这个视频的封面上想要放什么样的文字，比如说这个默认的，我靠这个赚了 一百万，如果说中间有空的，他会自动给你换行，这就是视频封面的大字。你可以想一下你希望你的人物出现在什么样的背景里面，比如说是在室内，在一个大豪宅里面，还是说在海滩边，这些你写在背景场景里，比如说我们说这个贵妇大豪宅里面， 你可以选择这个人物的情绪，如果说没有合适的表情，你可以自定义，你可以再展开的描述这个人是一个什么样的表情，比如说 捂嘴、惊喜，或者是怎么直接选一个他这里已经有个惊喜的表情，你再去上传一张你自己的照片，我选一张我之前的视频里面的截图，上传 风格参考图，这里是可选可不选，相当于是多了一个我们可以上传图片的位置。比如说有的时候我做播客的封面是两个人嘉宾和主持人对谈，那么我就会用上风格参考图，上传嘉宾的图片，他可以把我的主人物的图片和嘉宾图片拼在一起啊。在一张图上，有的时候，比如我看到网络上另外一个爆款很好看， 我把它截图下来，可以上传到风格参考图这里呢，把强制性的给到我这一次的生成一个要求，请按照这个风格来生成。除了这些之外，还有高级选项，就是做一些补充的说明，如果说你觉得有必要去补充的话，可以把补充信息写在这里，我们很多时候其实不需要这个时候就用不上高级选项，用不上风格参考图，然后呢，你点击生成就可以了， 点击生成的时候，他会邀请你登录，我们就先登录一下啊，登录一下我的账号。好，现在登录了以后呢，你就可以生成了，每次生成他会烧掉一个积分，生成以后你可以看下下面的结果，这个就是他第一次生成的样式了。如果说你觉得 ok 的 话，也可以点击 下载右下角的这个按钮。这个本身生成的图片是两 k 的 高清分辨率的图片，那这个就是我们一个大概的产品，是两 k 的 高清分辨率的图片。如果说要购买积分，我们这里可以支持 美元付款和人民币的支付宝付款。接下来就说这个工具是怎么完成的，首先我是用 google ads studio 生成了一版这个工具，我们就是用自然语言在 google ads studio 里面告诉他我要什么，只要你知道自己要什么，你就把你要的东西以大白话的形式写在 google ads studio 这里面的对话框里面。 这里需要补充一点，如果你脑海里面只有一个模糊的想法，你觉得你的需求并没有特别的完善，不清楚是不是有一些遗漏，那你完全可以借助跟 ai 的 写作来帮你去完善对一个产品需求的描述。 你就跟 ai 说，我想要去打造什么样的产品，你能不能通过跟我提问对话的方式，帮助我完善对这个需求的描述，然后我们出一个需求文档， 只要你有了完善的需求，再拿到 google i studio 或者 cloud code 或者任何的 web coding 工具里面做开发，就可以提高一次性成功的概率，减少返工。那我这里呢，有一段提示词，我就直接粘贴进来，根据我给你的图片和文字，设计什么样的风格，什么样的要求的视频封面， 写完提示词以后，你就直接点右下角的 build 就 可以了。我们现在看到的画面这里你可以在左下角的对话框里不断的去调整你要的效果，调试到你满意的效果以后，你就可以保存发布了。 那这里其实你就可以右上角有这个直接发布的 deploy app 的 按钮，如果说你已经部署了你的 app， 你 用这个链接把它公开分享给别人，那么别人就已经可以使用了，你自己也可以在你的手机端或者其他的浏览器里面去使用了，相当于是他已经帮你把这个工具部署在了谷歌的云端。 因为我们接下来要在 cloud code 里面进行下一步的动作，所以这里你要么下载你的代码，下载这个 app， 或者是把它同步到你的 github 上，像我在 google s 里面做的项目，我就已经把代码通过这个按钮啊同步到了我的 github 上，先存下来，那我们接下来就是去 set up cloud code。 cloud code 应该是截止到今天，也就是二零二六年的二月份，在编程领域最强的 ai 工具，我为了完成这个项目，尝试了多种不同的 ai 工具，在这上面花了不少的时间啊。 laibrapol 根本就做不到 google 的 antigravity 呢，卡在某一个 bug 上一直绕不出来。 cloud code 基本上是一次就过，所以后面的开发我就是只使用 cloud code 这个工具。 如果说你不知道怎么用，大家可以去看 cloud 的 官方网站 code dot cloud dot com， 你 可以找到这个中文的概览，一起怎么去快速开始？如果是苹果电脑，打开你的电脑上的 terminal， 按照这个快速开始的流程去操作一下。比如说苹果电脑 朝这一行， windows 朝这一行。如果命令行对你来说是比较陌生的东西，你可以去问 ai 去学一下怎么去操作。命令行就按照这个三十秒快速开始，如果说你需要一个更加详细的指南，那么 cloud code 三十秒快速开始，下面还有个五分钟的指南。 当你操作完以后，我们现在回到 terminal， 接下来我们就输入 cloud， 然后你就可以进入到 cloud 的 这个对话的界面了，进来以后你就可以跟他用自然语言对话了，你说什么他都能懂。在 cloud code 里面，我们可以用快捷键 shift 和 tab 来切换，一个是计划模式，还有一个是执行任务的模式，那我现在需要他给我建议，我就写了一段话，我说我想要做一个有用户注册和用户付款逻辑的 app， 把这个项目变成一个可以对外发布的项目，我应该怎么做 好，我们就输入就好了，他就会去给我们出计划，你的角色就是去判断这个计划是不是你想要的， 你只需要告诉他 yes or no， 可以 还是不可以，具体落地执行都是由 cloud code 来完成，他会在过程中需要一些信息，他问你是否需要前进，你就说 yes， 对 我来说我基本上都是 yes， yes， 可以 可以。那如果说我不想每次都说 yes， 我 就说全部都可以。 无论你需要什么，你在这里都是像我前面这句话一样去跟他用自然语言对话。比如说我希望这个界面上再加一个什么东西，我希望能够支持支付宝。为什么这里有 bug？ 你 可以 delete bug 一下，为什么这个网站的这个按钮不能用这个按钮？为什么不能点？这个地方的文案是不是能修改一下？有什么修改建议？怎么样改更好？ 你能想到的一切，你就在我现在打开的这样的窗口里面去跟他用自然语言对话，这个过程中有些地方需要你的配合，你就配合就好了。因为我现在打开的这个项目是我已经完成的项目，所以你可以看到 他已经看了我的代码，确定我已经有了这些功能，所以他就说你不需要再做了。为了咱们今天视频演示，我创建了个新的文件夹，里面放的是从 google a s 六六里面下载的前端页面的背后的代码。 然后我打开 cloud， 你 可以看到他已经看完了我的文件夹里的内容，跟我提了几个问题，首先我想要用一个什么样的计费模型？是订阅制还是按次付费？ 他第二个问题是问我的技术选型，那这一块其实我在我的前期的这个需求里面，我可以告诉他我是个完全不懂技术的小白，这样他给你的技术选型上就会根据你的情况去做一些推荐。因为我当时提问应该是有说我自己是一个不太懂代码的人，所以他给我的方案就是跟小白友好的。 但是对于一个技术人来说，他不一定是最好的选项，特别是当你的网站使用量比较大的时候， bursel 可能会让你收到一个非常惊人的信用卡的账单。那我们看一下技术选型是优先快速上线还是仅支付用第三方 完全掌握用户数据，还是全部自建？如果不明白，你也可以反向的去跟他提问，在这个第四个选项这里，反向提问说看不懂你给的这几个方案。考虑到我是技术小白， 什么方案上线目标一到两周快速 mvp， 或是三到四周上完整版，我们选择快速的 mvp。 支付渠道这一块，我们可以选择一个简单快速的方案，那我们现在先选 strike， 我 们就去提交就好了。 提交以后， cloud 的 这时候收集到了我们的答案信息，然后会给出进一步的计划看。因为我在前面的补充回答里面说我是个技术小白，他说 根据我的回答为我设计了一套最适合细数小白的方案，然后把实施计划写入文件，你给他提供的信息越多，那么他出的方案就越适合你的情况，如果说你不清楚自己要什么，那么他给你的方案可能你就会觉得不是那么的合适。 later 在 漫长的等待之后， cloud code 给到我们的方案就出来了，我们可以一起来看一下。完美，我已经制定了一套小白的完整的 s 改造方案，比如说用户的注册用什么，前端部署用什么，后端部署又什么， 帮我们预估了每个月的运营成本还有净利润。他还写了我们的数据库的设计，数据库里面包含哪些表格，每个表格里面包含什么样的字段 都已经设计好了。还有前端的改造，比如说登录系统怎么去添加付费墙，后端的改造怎么去改，如果你觉得 ok， 然后他就开始执行任务，一个个执行了。 这大部分的工作都是在 clock code 里面完成。需要我们的地方呢？比如说我们去配置一下数据库，它会告诉你有哪些数据库可供选择，我们选择它其中给的一个建议，它推荐 superbase。 superbase 其实我也第一次用那里面的所有的东西，你这 cq editor 里面发什么样的 query， 什么复制粘贴什么东西，所有 它都会告诉你怎么做，因为它现在暂时没有办法去控制 superbase 的 界面，所以请你去复制粘贴，你就只需要点一个这个右下角的 run 的 按钮就可以了。 付款的逻辑也是一样，不知道怎么去当付款的东西，不知道怎么接入，接入哪个工具都可以问 ai， colocole 的 会告诉你。最后我们部署到云服务，我用的是 versal， 怎么去配置，每一步做什么全部都是听 colocole 的， 一步步的告诉我怎么做。 你可能好奇我是怎么样获得 covermagic dot site 这个域名。当我们把我们的产品部署到 versal 之后，你会看到 versal 里面，它是已经给到我们一个网站， 这个网址是 versa 自动生成的网址，你不可能把这个网址给到用户去使用，因为没有人能够记得住这么长的一个 versa app 链接，所以你需要去购买一个域名。我购买域名的网站是 namecheap com， 它往往会在你购买这个域名的前两年给你打个折。但是对于我们绝大多数人的项目来说，可能我们也不一定要做那么多年，所以前两年比较便宜的是一个比较好的低成本的启动方式。 这个域名是，呃，两年十美金，可以说是非常便宜的价格，超过两年以后，每年续费可能是几十美金，但是没关系，反正我们先跑起来再说。 如果说我重新做这个项目，我应该不会从 namecheft 上去购买域名，而是从 cloudflair 到 come 上去购买域名。因为据说 cloudflair 的 收费也是非常合理的。你在无论哪个网站上购买了域名以后，然后你再按照 cloud 后的提示一步步的去操作，把你购买的域名和 versal 里面的这个项目关联起来。 我为了避免自己成为一个单纯的执行者，每次我不懂的地方，我会问，可老可的这一步我们在干嘛？我们为什么要这么做？所以他不仅是在告诉我应该怎么做，而且还会告诉我为什么怎么做。一边实践一边学习啊，这可以说是最好的学习方式，因为你会获得满满的成就感，未来这么强大，有的时候我觉得我们的想象力，我们能不能够想出更大的更有意思的项目， 以及我们能不能够想出更多的任务让他去做，可能才是最大的瓶颈。今天诗琳跟大家介绍大概流程，是希望给大家看见更多的可能性，那就是即使你不会写代码， 你是个纯小白，你在今天也能够做出一个软件产品，但是每个人的基础不一样，像我可能花了几天的时间，那程序员朋友可能花几个小时就能完成那一个纯小白，可能是一个月都没有关系，毕 竟我们之前什么都得靠别人，什么都得请一个人来帮我们完成呢。今天至少你能够从零到一完成一个项目了，咱们没必要比较过去的基础，也没必要比较现在的速度，只需要让今天的自己比昨天的自己更好一点点就可以了。 如果说做这个项目过程中有什么经验沉淀下来值得跟大家分享。第一个是你得知道你自己要什么，你能够提前想清楚，那么你后面的返工和不断修改的次数就会减少，能够帮你省一点烧头坑的钱。第二个建议是，如果说你不知道该做什么，那就从解决自己遇到的问题开始， 你在生活中遇到的问题，你不断重复去做的事情，你觉得很繁琐的事情，尝试把它提炼出来，借助 ai 去变成产品。 完成这样一个闭环以后，你会有非常大的成就感以及对自己的信心，你就可以再去做新的产品，去解决新的问题，然后不断提出更好的想法，不断解决更大的问题，不断的去循环往复，你就从一个以前完全没有办法驾驭代码杠杆去写软件的人，变成了个新时代的超级个体。我是凯丽，我只分享有价值的思考。

google anti gravity 绝对是一款颠覆性的 ai 编程工具，它完全改变了我日常使用 ai 的 习惯。现在很多人还只是把哲米奈当做聊天机器人使用，但如果我告诉你，你完全可以通过使用 anti gravity 管理任何项目，设计自动化的工作流，开发优质的 ai 产品，而且不需要你写一行代码，当然前提是你要学会正确的使用它。 在二零二六年， web coding 基础的 ai 开发绝对是每个人都应该掌握的技能，所以我会用这条视频带大家完全解锁 antiquity 的 全部功能，让你的 ai 使用效率原地起飞。我会教你如何从零开始，一步一步的搭建 ai 应用，包括如何使用最近爆火的 skills。 就 算你是完全零基础的小白， 话不多说，我们直接开始。首先， antigravity 是 谷歌推出的一款编程工具，它的核心是基于 ai agent 智能体驱动的思维模式，不仅能够写代码，更能同时自主构建完整的项目。就像是你可以拥有一支全天候为你服务的智能体团队，他们会随时跟你进行汇报对其项目进度， 而你只需要用通俗易懂的自然语言告诉他你的需求，就像是跟朋友对话一样。首先我们进入官网这里直接去下载跟你电脑对应的软件版本就好了，正常安装。 提醒一下，国内使用的话需要科学上网， ip 最好是美区。然后你一定要开启增强模式之后，你才能来到这个界面，点击创建新的文件夹，一个文件夹就是一个项目，里边会包含所有跟这个项目有关的全部文件，然后我们在桌面创建，比如我们就叫 test， 大部分人可能因为不熟悉编程就卡在这里了，我最开始使用 cursor 就是， 所以想要完全的掌握 ant gravity， 最好的学习办法就是大家可以跟着视频边做边学习。 你可以看到在这个初识界面，右边是你和 ai 对 话的窗口，中间区用来显示文件，左边是你管理项目文件的地方。我们先进行一些基础设置，首先来到拓展这边，在这里搜索 chinese 插件， 直接安装其他插件，等到有需求的手按 t widget， 会自动提醒你安装。然后呢，我们来到右上角，这里三个点，点击 customization， 我 们来设置一下全局规则和项目规则， 不把 nt gravity 当做一家餐厅入死，就好比是你的员工守则，在这里呢，你可以规定 ai 跟你对话的方式，比如说不要讲废话，你要求他全部使用中文回答。项目规则呢，是可以仅仅在当前的项目生效，也可以部署在全区，你可以自由的选择 ai 出发的方式， 比如说这里入死，我们直接使用科室内部员工发在 x 上的一段提示词，直接把这一段复制粘贴下来， 直接粘贴到这里，然后记得在这边加一句 always response in 简体中文，这样你能保证应该大概率是用中文来回答你。然后项目规则，我们直接使用 github 上开源的一段检测 bug 的 描述，直接把这段提示词全选复制，然后在这里添加 workspace， 然后粘贴到这里。可以看到在左边这里自动添加了一个文件，那下面是添加描述的地方，我们直接就粘贴到这里。触发的方式你可以选择是总是触发，也可以手动或者是让 ai 来决定什么时候使用。然后我们把它保存一下， command 加 s 保存就可以。看到这边已经添加上了视频，里面全部使用到的提示词，我都会在评论区放链接。基础设置完成，我们就可以开始接下来的开发了。前段时间我有刷到那种片场探班的视频， 就是一个人拿着手机可以和很多的电影人物，比如泰坦尼克号，复仇者联盟里面的角色自拍，我觉得很有趣。那我就想着先做一个这样的生图 app， 然后我就可以拿这些图片直接去做视频。 如果你完全不懂编程和开发，在打框架这一步你就可以交给 ai， 你 可以使用任何你熟悉的大模型帮你理清思路。谷歌 germina， cloud g p t 或者 deepsea 都可以。 比如在这里你可以直接跟他说，呃，我想要开发一个外部应用，它的核心功能是使用谷歌 nasa banana 的 声图功能。 当用户上传了一张自己的任意的图片，输入喜欢的电影名称，就能够生成一张他和这个电影主角在片场休息时的合照。嗯，我希望是那种很真实的抓拍版，就好像他真的去探班了一样。背景希望是真实的拍摄场景。 不需要着急给我整体的方案和代码。我需要你先挑战我的问题，帮我梳理和完善思路。你可以向我提问，直到你完全理清楚我的需求。 接下来 ai 可能会问你很多的问题，你把你的需求全部理清了之后，你就要再对 ai 说，我需要你根据我们的对话帮我生成一份 sop 或者产品需求文档，然后我们再交给 ai 进行开发。看这边他已经有回复了。 高安蒂 gravity， 把 ai 最后给你的提示词直接粘贴到这里的对话框。模型，你可以选择 jimmy， nike， cloud 或者 gpt， 每种模型都有不同的特点，比如说 jimmy， nike， 他 做出的 ui 界面就很强， cloud 编程能力很强， gpt 属于各方面都很均衡。 然后这里是有 fast 和 planning 两种模式可以选择， fast 比较适合你执行快速简单的小任务。 plan 模式下，它会先生成一份计划书，跟你确认每一步的关键步骤。然后我们今天选择 plan 模型，选择最高的， 可以看到 ai 就 开始工作了。好，可以看到这边它先给我们生成了一份计划书，它会告诉你总共有哪些步骤，每一步需要做哪些事情，你可以逐条的分析，然后跟它对话。这也是我觉得 intgrity 特别实用的一点。比如你看这边有很多加号， 每一条你都可以随意的添加自己的批注，任何需求都可以通过注视添加，这样我们就可以实现一个实时的交互。比如说这边他有最后提到 u i 风格，我想添加一点自己的设计，我就直接点这边的加号给他说， 嗯，我希望你可以添加一些克莱因蓝的元素，我很喜欢这个颜色。嗯，然后再添加一些电影胶片的 icon， 当然整体的设计要符合我整个项目的风格。 直接添加，如果你有更多的需求，也可以随时的添加批注。左侧的项目文件里，如果你有自己的品牌或者 logo 图片，也可以自己拖拽过来给 ai 参考。如果没什么问题，我们就直接点击这个 percy 的 执行，然后这些文件都可以关掉了。 在 ai 执行的过程中呢，我给大家介绍一个相比其他 a 一 工具，我觉得 ituiptive 最能体现智能体驱动的工作模式。这里我们点击右上角有一个 open agent manager， 在这里呢，左侧面板会显示你所有的项目。想象一下，在这个界面，你可以同时创建管理多个智能体，让他们在同一个时间处理不同的工作。你只需要点击这里的加号，就可以创建新的对话框，比如说刚才的任务是进行整个外部应用的开发，这里呢，我想让 ai 帮我搜集一些比较好看的前端页面， 点加号你看就可以弹出一个新的动画框。在当前的项目里面，我直接跟他说，嗯，请你去飞格玛帮我搜集一些具有电影元素的前单页面，你可以给我三到四个链接， 这里我们使用 fast 的 模式就可以了，然后模型选择快速。当然你还可以再添加执行不同任务的智能体，只要你有需求，电脑配置跟 token 都足够的话，你可以无限的添加。 在这边左侧面板，你可以看到几个不同的智能体同时在干活。左上角的收件箱它会显，它会实时的显示智能体的工作状态，所有的过程你都可以实时的追踪。当智能体需要你协助的时候，它们会发信息给你，要求你 proceed， 这里我们直接点击 proceed， 所以 antigo 体是可以同时显示两个工作窗口，一个是现在的智能体管理窗口，它会显示所有 ai 智能体工作的状态。一个就是我们刚才的代码编辑器，你可以随时的切换试图如 如果你有多个显示器的话，那会更加的方便。自动调用浏览器也是我觉得 itguoyot 非常惊艳的能力，它可以直接在内置的浏览器中动态测试，当我们开发网页时，它就可以自动测试网页功能， u i 交互，完全实现自动化的操作，然后给你反馈的结果。这个蓝色的边框就相当于它在自动的调用这个页面去帮我们进行搜集，可以看到它已经打开了三个页面，这一步完全没有电脑操作。 可以看到这边我刚让他去飞格玛帮我搜集页面，他已经执行完成了，这边就是他给我们的一个进度汇报，你看他直接给我们附上了链接，我们可以直接点击就能打开， 你可以一个一个的点进去看是不是你想要的那种风格，我这边只是做一个简单的展示。 好，现在这个任务已经执行完成了，我们可以让他打开帮我们测试看一下。这边我们新建一个对话窗口，你也可以直接 ctrl 加勾，然后输入 npm， 你 当然也可以跟大家说，请使用自带的浏览器帮我打开页面，我要进行功能的测试，两种方法都可以啊，我们这边点击这个链接打开，随便找一个链接打开， 可以看到这边他提示我们是要输入 api k 的， 然后我们就去获取一下 api k， 直接打开 google 的 as 丢丢，在这里面拿到一个你的通行证，直接复制，然后回到刚才的页面，粘贴到这里， 然后我们就可以看到整个页面的设计还是不错的，他加入了很多我喜欢的克拉英兰的元素，标题就是 hollywoodcut。 然后这边是可以用来上传自己的照片，这里输入电影名称，然后选择画幅比例，这边应该是会生成一个 呃生图的提示词，那我们就随便找一张照片进行测试一下，我这里面就拿了一张我从之前视频里面的截图，然后电影名字，他推荐爱乐之城，我们我们换一个，比如我们选择蜘蛛侠 三，英雄无归，然后这些其他我们先暂时不要动，直接点击 action 啊，可以看到他已经生成了一张照片，这个应该他只选了荷兰第一个角色。那我们这边可以下载，但是这边还可以输入指令，然后进行进一步的画面调整， 可以看到这张照片清晰度还是挺高的，然后整体确实是有那种真实的在片场拍照的感觉。那比如说如果我希望再做进一步的调整，这个是我从网上随便找的一张图片，我觉得很适合我这个网站的风格，我希望把它加在整个项目里面。那我们就比如截图， 然后我们这里回到 antigravity， 直接拖拽上来，你可以跟他说请使用这张图片帮我作为 logo 添加在当前的项目页面中， 所以你看你其实是可以随时的提要求，让 ai 进行修改和优化。这里注意，建议大家每次修改完成之后呢，都点击一下这里的提交，把你的修改保存在本地的 get， get 就 相当于是你游戏的存档，它会记录你每次版本更新的内容。如果你后面改着改着发现自己不喜欢，或者说 ai 改错了，出现 bug 了，你还可以找回之前的记录，一定要养成好习惯。嗯，可以看到最新更新的画面，它已经把我刚才要添加的这个 logo 添加上去了， 所以我真的很喜欢 tikblr 这种实时双向合作的开发方式。你可以把每个智能体都当做不同的员工来看待，你可以同时运行多个不同的项目，而你只需要做的就是管理好你的收件箱，确保它们都在执行就可以。另外呢，再向大家展示这里的 playground 功能， 你可以把它当做你的临时工作窗口，当你不确定要不要进行完整的开发，或者说你只想做一个 demo 的 时候，就可以来到这边。 当一个项目开发完成，你下一步就是要把它保存在 github 里面，不然你每次都需要打开 id 浏览器，它才能够运行。首先我们来到右上角，点击这三个点， 点击 m c p 服务管理 m c p m c p 全称模型上下文协议，这个协议本质上是利用一套通用的语言标准，让 ai 可以 和各类的应用实时互联，无缝对接，所以你可以把它当做一张通行证。举个例子，比如说你这家餐厅打算供应宁夏滩羊，可 是你的冰箱里面根本就没有这个食材，那厨师是不是你们没法做了？那有了 m c p 呢？你就能够连接到宁夏太阳的原产地供应商，当你需要这个食材了，那边得到许可，就可以给你进行固定的配送。那对于 ai 来讲，比方说你链接了飞格玛，有了 m c p， 你 的 entire gravity 项目才可以跟飞格玛的前端设计稿实时互联。比方说你链接了 notion m c p， 那 你就可以直接在 anti gravity 里面说，帮我在 notion 创建一个表格。 那可以看到这里其实内置了很多的 m c p， 一 旦连接你存放在各个服务器里的项目都能够直接调用，而你不用担心兼容或者格式的问题，所以你可以按需添加。现在我们需要配置一下 get up 的 m c p， 可以 看到我这里面已经配置过了，这里需要你去 get up 手动获取，然后复制过来。 打开你的 github， 建议每个人都要注册，因为这里是全世界最大的开源代码的一个存放的平台，它可以储存文件，还能直接托管我们的项目。在右侧的面板找到设置选项，然后找到 developer settings， 点击 personalize tokens， 就 在这里你可以创建一个新的 token， 这里要验证一下你的密码， 验证完了之后呢，在这里取一个名字，然后你在这边添加你的权限，添加权限之后点击创建 token， 添加权限之后就会生成完整的授权码，然后你回到这里粘贴就可以。 另外说一下，使用 github 的 mcp 需要 docker 这个软件在后台运行，不然你无法添加，也无法使用这个软件，也直接在官网安装下载就可以。 添加完成之后呢，点击 refresh， 就 在左侧出现工具面板，可以看到系统最多同时支持一百个工具的调用。但是我建议你不要一次性的开太多，按需加载就可以，建议每次控制在二十个左右。 如果你要添加未收入在 m c p store 里面的 m c p， 就 点击这个原始的配置仕图。注意看，这里就是你 m c p 的 原始配置文件。最简单的办法就是选中，然后把它们全部 复制在这边。新建一个对话框，你就直接让他编写某一个供应商的 m c p， 然后你去这个供应商的网站获取授权码，再粘贴回来保存就可以了。一定要养成凡事都用 ai 的 习惯。添加完成之后呢，这里新建一个对话框，因为我不希望有太多其他内容的干扰， 你就直接对他说，嗯，我希望新建一个 github 仓库，用来存放并且发布这个项目，仓库的名字就叫 hollywoodcut。 同时帮我设计这个部署的工作流，会使用的环境参数请参考 ev example 文件，并且将全部的操作流程都更新到 readme 的 文档。在上传前请帮我检查，确保我没有任何的个人信息，比如说 api 可以 泄露的风险。注意这些全部都不要写在前端的代码里面， 没有什么问题就直接按下回车，然后你的系统将会自动将这些变更同步到 gitlab。 保存完成之后呢，你就可以获取到一个网址链接，随时可以添加到浏览器里面打开。如果希望更进一步呢，我们就可以选择通过我 style 进行部署，这样这个前端应用就可以上线了。 在我 style 里面，我们需要关联 gitlab 仓库，这样你的我 style 就 可以看到你 gitlab 里面的代码库，直接点击这里的 is new， 点击 project 可以 看到这里面已经显示了好礼物 cut 的 这个项目，然后点击 input 项目就会直接导入框架预设，全部都会自动填充，直接点击 deploy 部署，就可以把应用发布在公共的域名上面。 所以现在你基本上就打通了一套从开发部署发布这样一个前端项目的全流程，通过 gitlab 同步，然后 gitlab 触发我 style 部署， 整个过程都是时事联动的，是不是很酷？这样我们就可以自己尝试打造出功能独特又实用的 app， 而且随时可以分享给朋友。 但是要强调一下，我们今天开发的仅仅是一个前端的 top 应用，在网上刷到的内容帖子，我用十分钟开发出了某某软件，基本都是这种类似的。 如果你想要进行完整的开发，那么你还需要了解后端数据库，购买域名，开放支付，包括商业化等等技能，这些都需要你进行更深一步的学习。但是 web coding 的 乐趣就在于，当你看到了一款很不错的软件，是不是可以先想象一下自己有没有办法复刻出来做一个简单的应用，比如 比如说口语学软件，语音助手就放在本地自己使用。我觉得对于没有任何编程基础的小白来说，真的可以算是打开了新世界的大门。那最后我们再来简单讲解一下 skills， skills 其实很好理解，因为它翻译过来就是技能。我们还拿厨师举例，比方说你已经有了一个非常厉害的厨师， 他本身就会做很多菜，但是川味鱼香肉丝的做法和其他地方那就是不一样的。你要是不提前给厨师讲情书，如果他按照自己的习惯发挥，可能味道也不错，但是绝对不会是你想要的那个川味。但是如果啊，你可以提前把这套独家秘籍给打包好，比方说油温多少度，配菜有哪些，什么时候该来一勺豆瓣酱， 怎么摆盘等等这些操作，全部打包成一个技能包交给厨师。那他平常呢，不需要把这些厚厚的技能包都背在脑子里，因为这样太占内存了，也就是太费 token 了。 那他只需要在腰上挂好这个技能包，等什么时候客人点名要吃那个川味鱼香肉丝的时候啊，他提前看一眼，再决定要不要读取这个技能。 然后呢，照着这个步骤精准地来一遍。这样做的话，既可以节省 token， 又能够保证干活的质量。这个啊，就叫做渐近式批漏。所以其实本质上，你可以把任何一个自己经常会用到的流程、工作流都打包成一个 skills， 这样你每次调用的时候，都不需要你提前说那么一大堆的背景提示词。 比方说，我们可以直接去 github 上下载 ansorepic 公司，也就是 cloud 那 个公司自己开源的 skills， 可以 看到这里的 skills 有 包括修改 word 文件，修改 pdf， 包括数据处理，还有一些前端设计的 skills。 我 们直接点这里的 code， 复制整个仓库的链接，然后回到 antigo 这里，我又重新建了一个项目，你就直接跟 ai 说，帮我下载这个仓库里面全部的 skills， 并且部署在局的路径下， 然后把这个仓库的链接发过去。部署在全集路径下的好处就是说，不管你打开什么项目，都可以直接全部地调用这些 skills。 果然教程都是发给 ai 看的，如果想要多做一步呢，你还可以跟他说，帮我把这些 skills 都配置成为斜杠可以调用的形式，这样当你明确想要调用某个 skill 的 时候，就可以直接选中了。 另外呢，再给大家推荐一个前端设计的 skills， 叫做 u i u x pro max skill 也是一样的步骤，在 code 这里复制整个仓库的链接，回到 ant gravity， 把仓库复制给他，对他说，帮我下载这个仓库的 skills， 然后直接点击回车就可以了。 这里可以看到我的斜杠已经可以调用这些 skills 了，我们就简单测试一下，帮我制作一个健身房的宣传落地页，你可以规定他使用哪些技能，比如说我打字使用就是我们最新安装的这个 u i u x 的 skill 直接发送。 可以看到这里已经调用了 u i u x pro max 的 升图模型，帮我们生成了两幅图片，我们直接在浏览器里面打开去预览一下， 那可以看到这个页面这个人物介绍部分他就使用了刚才的图片，整体来看还是挺有特色。就目前来讲，这个红黑配色不是我喜欢的风格，但是这只是一个初步的搭建，之后你有什么想法可以让他进行个性化的修改。其实你看关于一个健身房落地页的基本元素他这里都是有的。 好了，以上就是本期全部的关于 antiquity 的 基础教程，基本上你使用 cursor tree 或者任何的 id 工具，它的界面操作啊都是一通百通的。 web coding 时代，学习 ai 最快的方式就是先用起来，先做出一个东西，然后慢慢地补足专业技能，这样你才能有源源不断的学习动力。