通宵到凌晨 5 点半,我靠和 AI 聊天,徒手做出一款猜词小程序

0 阅读5分钟

【第一期】通宵到凌晨 5:30,我靠「和 AI 聊天」,徒手做出一款猜词的微信小程序

工作台.png

“Vibe Coding” 这个词在首页刷屏快一个月了。
Claude Code、Cursor 这些神器我早就刷到过,但要么网络折腾不起,要么付费门槛劝退,一直迟迟不敢上手尝试。

直到最近发现,国内一大批 AI 编程工具全都放开了免费额度:CodeBuddy、灵马、Trae…… 普通人零成本就能玩。
我当时就一个念头:反正不要钱,不如亲自下场试一把。

codebuddy.PNG 真正点燃我创作欲望的,是偶然刷到的一条短视频。博主在街上随机拉路人玩猜谜游戏:心里想好一个名人 / 历史人物,路人只能用「是或否」提问,靠层层缩小范围猜出答案,猜对有奖、猜错清零。

街头猜词.png

最让我意外的是,好几个北京小学生知识面远超想象,提问逻辑环环相扣,几下就能锁定谜底。 我瞬间灵光一闪:这个玩法太有意思了,我为什么不自己做一个? 正好手里有现成的 Vibe Coding 工具,索性通宵实测,看看网传的 “AI 徒手做项目”,到底是真神还是噱头。

第一次用 CodeBuddy,直接头皮发麻 我没有写任何代码框架,就直白跟 AI 说了我的想法: “我要做一个猜人物小游戏,系统随机匹配历史人物、明星、动物,玩家通过是 / 否提问推理答案,自带计分、重置功能和专属词库。”

话音刚落,它直接生成了一个可点击、可游玩、逻辑完整的前端页面。 那一刻我真的愣住了。 这和传统写代码完全是两个维度:以前是:梳理逻辑→查文档→逐行写代码→反复调试改 bug;现在是:把脑子里的想法说成人话,AI 就能直接落地成品。 一下子彻底上头,根本停不下来。

pk.jpg

theme.jpg

从晚上 10 点到凌晨 5 点半,越改越上瘾 紧接着我开始随口追加各种需求,全程像跟产品对接一样聊天: 界面太单调,加一层毛玻璃玻璃态背景; 增加分类切换:历史人物、娱乐圈明星、常见动物; 显示剩余提问次数,限制无效乱问; 额外标注答案文字字数,降低推理难度。

绝大部分需求它都能精准理解,几乎不用大改。偶尔出现逻辑 bug,比如倒计时清除异常、跳过题目乱加分,我只需要把问题现象、操作步骤描述清楚,连带控制台报错丢给它,基本都能一次性定位修复。

那一晚从夜里十点多一直聊到天亮,不知不觉迭代了近 30 个功能细节,界面、逻辑、交互全部打磨一遍。 抬头一看时间,已然凌晨 5 点半。

这种感觉太熟悉了,像年少时通宵打游戏、刷短视频停不下来,完全陷入了创造的心流,被 AI 带着推进项目,不知不觉就熬到天亮。

熬夜换来 6 条硬核教训,新手直接避坑 亲身通宵实测,把最真实的踩坑经验整理出来,想玩 Vibe Coding 的建议直接收藏:

  1. AI 容易自作聪明,必须给死规则 让它优化人物词库,它会擅自把「曹操」改成「曹孟德」、「马云」换成英文译名。普通玩家根本看不懂,直接劝退。 经验:词库、命名、文案一定要明确要求:只用大众最熟知的通俗叫法,禁止私自文艺化、外文化修改。

  2. 状态类 Bug 最磨人,别只说现象 像计分叠加、倒计时残留、弹窗冲突这类状态 bug,AI 容易给出多种矛盾修复方案。 诀窍:完整写下操作复现步骤,附上控制台报错信息,信息给得越全,修复效率越高。

  3. 切忌一次性堆十几个需求 一开始我把所有功能一次性全抛给 AI,看着代码很完整,实则多个功能互相冲突、逻辑打架。 正确做法:每轮只提 1-2 个小需求,跑通测试没问题,再继续加功能,反而省时高效。

  4. 认清 Vibe Coding 的适用边界 ✅ 非常适合:个人小程序、原型验证、内部小工具、轻量活动页面 ❌ 不适合:金融交易系统、大型多人复杂工程(当前上下文承载还跟不上)

  5. 核心心法:把 AI 当初级程序员 别把 AI 当成万能大神,就把它当作听话但偶尔会犯迷糊的初级开发。 你把需求写得越清晰、越像正式产品文档,它输出的代码就越规整、少翻车。

  6. 先定 Plan 再开发,不要上来就硬写 老手玩法都是先开 Plan 模式,让 AI 主动帮你梳理需求、拆分优先级,划分 P0 核心功能、P1 优化功能、P2 锦上添花功能。 先敲定核心玩法跑通,再切开发模式迭代;拿不准的技术方案,先切问答模式确认思路,再动手写代码,少走大量弯路。

写在最后 趁着平台免费额度,我已经把这款猜人物小程序完整搭好,连夜打磨了界面和词库。 至于后续小程序上架,涉及资质、审批流程比较繁琐,暂时就先不折腾了,当作个人练手项目圆满收官。 后续会持续更新

亲身实测下来,Vibe Coding 真不是噱头,普通人只要会表达需求,就能从零做出自己的小产品。

bijiben.png

猜词小程序入口:

普通小程序码-掘金.png

小程序二维码-掘金.png

如果你对该小程序有兴趣或者也想开发一款小程序都可以加我讨论。

2a54f4358666b350f5760ce005d2b2fd.jpg

9fef9c024d02de4ce2c1cee10417836d.jpg