现役卡车司机用Claude Code制作浏览器游戏的故事

前言

在担任汽车托运车（可一次装载并运输多台车辆的卡车）司机的同时，我独自开发了一款可在浏览器中游玩的装车游戏《我们是汽车托运工》。

代码几乎全部由 Claude Code（Anthropic 的 AI 开发工具）代为编写。画面、音效、背景音乐和语音，也是请另一款生成式 AI 制作的。

本文讲述「完全交给AI能做到什么程度」，以及实际操作中遇到的瓶颈和提高制作效率的技巧。聊的不是游戏内容，而是与AI协作制作的方式。

可玩内容（免费・无需注册）: https://wadoooomedou.itch.io/we-are-car-carriers
介绍站点: https://bokuriku-game.netlify.app/

正在制作的内容

• 2D浏览器游戏（HTML5 Canvas + JavaScript）
• 再现将汽车逐台装载到7台层叠式半挂车上并固定到位的过程
• 地板的升降、坡道、汽车物理模拟（因台阶下沉、碰撞轮挡等）也都是参照实车运动精心制作的

没有使用框架。只需放置文件即可运行，可以直接放到 itch.io 或 GitHub Pages 上。

1. 先确定角色和分支

如果让 AI 在一次对话中做所有事情，它会在各处改写并破坏代码。
因此，我在仓库根目录下的 CLAUDE.md（AI 在对话开始时必定会读取的备忘）中，将角色分成了三类并写入。

• 一次对话中，只扮演一个角色
• 分支也按角色划分（dev/… graphics/… site/…）。
• 跨角色的委托事项，需带编号写在备忘录（用于传递请求）中再交付。

跨越会话后，AI 不会记得之前的内容。
因此我加入了作业中断时必须让其在备忘录中写明"做了什么、接下来要做什么"的规则。下一个会话只需阅读该备忘录即可从断点继续执行。

2. 在云端验证（这一步最卡壳）

我大多数时候只用手机工作，所以让 AI 在云端环境中运行。这里有两个坑。

后台运行的处理每次回复后都会消失

无法将开发服务器或冗长的验证"放到后台运行、之后再查看结果"。因为每次AI完成回复，后台处理就会消失。"服务器偶尔会崩溃"的真相正是如此。

解决办法是将验证整合为一条命令，在前台一直运行到结束。

# サーバー起動 → 通しプレイ → 結果表示まで、1コマンド
bash .claude/tools/verify.sh 7

使用无头 Chromium（Playwright）打开游戏，通过实际操作让7辆车堆叠起来，检查是否存在扣分或错误。耗时数分钟的验证交由子代理在前台执行，主对话中则继续进行其他工作。

\n 验证脚本掩盖了真正的bug

当车碰到挡车器时，出现了车从画面中消失的bug。原因是函数内部 fm（拥有地面机制的对象）未被定义。

// seatCar の中で定義していない fm を使っていた
fm.deckDrop(...)  // ReferenceError: fm is not defined

为什么验证时没有发现？因为验证脚本在全局作用域中放置了 window.fm。即使主代码中忘记定义 fm，也能在全局中找到并正常运行，错误因此被掩盖了。

修复方法有两个。

1. 在主体的函数中正确获取 fm
2. 验证脚本在运行前需先 delete window.fm

教训是"验证工具有时会掩盖本体的缺陷"。如果把验证也交给AI，就不容易察觉这类偏差，因此我在 CLAUDE.md 中将其作为教训留下。

另外，为了方便用户端调试，我在URL上加了 #debug=1 这个标志，使画面显示车辆的状态和最后一个JavaScript错误。通过这一点，就能从手机复现时的截图中找出原因了。

3. 让AI用数学公式做出"与实车相同的动作"

悬空踏板（第5节与第6节之间升起的小地板）的运动，是根据实车照片和视频，按四杆机构（四根杆组成的环形机构）来计算的。

• 四个连杆：车体、前立柱、地板、后立柱
• 改变前立柱角度时，后部安装点在地面滑动 → 后立柱缩短 → 固定后由两圆交点确定姿态

我交给AI实车照片和我的说明（"这里会缩短""在这里停住"），让它写出公式。数值由我在实机上观察后修正，比如"再往后""更接近水平"。公式由AI负责，现场的正确性由我负责，这就是分工。

4. 图像、声音、语音分别交给不同的AI

• 代码：Claude Code
• 插画：ChatGPT 图像生成（草稿）+ 手动修正
• 音效、BGM、调度员声音：ElevenLabs

把任务全交给一个AI反而效果不太好。一是因为各AI擅长的领域不同，二是为了控制AI的使用费用（每周限额）。我还会把简单的任务分给轻量级模型（Haiku），以应对每周限额。

试着做之后才知道的事

• 越是让AI来承担，决定"做什么"和"对不对"的人类工作就越重要。就我而言，实际现场的知识的
• 养成书写备忘录（CLAUDE.md·委托箱·交接）的习惯，是即便会话更换、工作仍能延续的最大支撑。
• 验证要看的是实际运行的结果，而非AI的回答。而且还要对验证工具本身保持怀疑
• 仅凭一部手机也能做到这个程度

结语

游戏目前正在公开浏览器版（测试版）。也在考虑应用化（iPhone/Android）。开发背后的故事，写在note「ワドメ堂」上。

• 游玩: https://wadoooomedou.itch.io/we-are-car-carriers
• 介绍页面: https://bokuriku-game.netlify.app/
• note: https://note.com/wadome_do

如有任何问题或感想，请在评论区留言。