Battle Drones —— 一款基于音频同步多人对战的 vibe coding 风格 RTS 游戏

# Battle Drones——一款用 vibe coding 做出来的 RTS，还带音频多人对战 来源：https://simonwillison.net/2026/Oct/20/battledrones/ 2026年10月20日 我最新的 vibe coding 游戏实验，是一款 Command & Conquer 风格的 RTS（实时战略）游戏，叫做 [Battle Drones](https://github.com/simonw/battledrones#readme)（[在这里玩](https://simonw.github.io/battledrones/)）。和[我之前的几次实验](https://simonwillison.net/2026/Aug/5/raccoon-heist/)不同，这一次*玩起来是真的有意思*。说出来有点不好意思，我达成这一点的方式是告诉 Claude「让它变得好玩得多」。它还支持附近设备之间通过音频同步游戏状态来进行多人对战！下面是我目前做出来的东西，以及一路走来学到的一些经验。 - [Battle Drones](https://simonwillison.net/2026/Oct/20/battledrones/#battle-drones) - [我是怎么构建的](https://simonwillison.net/2026/Oct/20/battledrones/#how-i-built-this) - [v1：最初的原型](https://simonwillison.net/2026/Oct/20/battledrones/#v1-the-initial-prototype) - [v2：完整精灵图](https://simonwillison.net/2026/Oct/20/battledrones/#v2-full-sprites) - [v3：多样地形](https://simonwillison.net/2026/Oct/20/battledrones/#v3-varied-terrain) - [v4：好玩更新](https://simonwillison.net/2026/Oct/20/battledrones/#v4-the-fun-update) - [v5：Battle Drones 进入 3D](https://simonwillison.net/2026/Oct/20/battledrones/#v5-battle-drones-goes-3d) - [v8：群岛](https://simonwillison.net/2026/Oct/20/battledrones/#v8-archipelago) - [v10：Goliath 与智能体对战](https://simonwillison.net/2026/Oct/20/battledrones/#v10-goliath-and-agent-battles) - [智能体对战](https://simonwillison.net/2026/Oct/20/battledrones/#agent-battles) - [v11：随机地图](https://simonwillison.net/2026/Oct/20/battledrones/#v11-random-maps) - [v12：通过声音实现多人游戏](https://simonwillison.net/2026/Oct/20/battledrones/#v12-multiplayer-via-sound) - [一些想法](https://simonwillison.net/2026/Oct/20/battledrones/#some-thoughts) - [更新：在线多人游戏支持](https://simonwillison.net/2026/Oct/20/battledrones/#update-online-multiplayer-support) #### Battle Drones 我最初的目标，是做一款能在手机上玩的 RTS 游戏，风格对标 [Command & Conquer](https://en.wikipedia.org/wiki/Command_&_Conquer_(1995_video_game))。我对 1995 年的初代有着美好的回忆（我也很喜欢 Red Alert），希望能重新找回一点当年的魔力。 经过 12 次大版本迭代（以及由编码智能体、主要是 Claude Code 完成的 [321 次提交](https://github.com/simonw/battledrones/commits/main/)），我现在有了一款基于浏览器的游戏，移动端和桌面端都能玩，包含多种游戏模式、多张地图（还有随机地图生成器），甚至支持两台处于彼此麦克风范围内的设备进行多人对战。（**更新**：还有[在线多人游戏](https://simonwillison.net/2026/Oct/20/battledrones/#update-online-multiplayer-support)；音频多人对战真是让人头疼！） 下面是一段 Battle Drones 在桌面浏览器中运行的视频演示： 到目前为止的功能包括： - 9 种建筑、7 种地面载具、6 种空中载具、3 种步兵单位——全都是 3D 模型，你可以在[这里浏览](https://simonw.github.io/battledrones/models.html) - 战争迷雾 - 攻击空中载具和地面载具需要不同的武器 - **六张地图**，横跨五种生物群系——温带、沙漠、极地、火山、热带 - 随机地图生成器 - **遭遇战模式**——红蓝两方在一张旋转对称地图上对战 - **最后防线模式**——一名玩家尽可能多地抵挡敌人波次 - 范围杀伤武器：弹幕轰炸、EMP、空投舱、天锤 - **补给箱空投**，带来额外资源 - 随事件变化的游戏内音乐——战斗越激烈，音乐越紧张 - 不同的游戏中 **AI 性格**（均衡、快攻、空中蜂群、爆兵、空中大军、铁甲） - **AI 对战 AI** 模式，可以观看这些性格相互较量 - **Goliath**——一台巨大的行走机甲，拥有激光眼、手臂火炮，还能建立新的基地 - **突变器**，增加额外规则或变数 - 「每日行动」挑战 - 军衔与成就（**勋章**） - **智能体对战智能体**模式，让两个 LLM 对战 Battle Drones - **多人模式**，基于两部附近手机通过音频消息通信，是我早前 [Chirp Pong](https://simonwillison.net/2026/Oct/15/chirp-pong/) 实验的延伸 #### 我是怎么构建的 Battle Drones 深度依赖 vibe coding——我几乎没看过代码，而且它是用一种我自己几乎没用过的语言（TypeScript）写的。不过我做了大量试玩测试，项目从启动至今也经历了非常多次迭代。 下面是这个项目目前的大致历史，包括关键提示词和对话记录链接。 #### v1：最初的原型 我从七月开始，用的是 Claude Fable 5： > `We are going to build a mobile friendly RTS game - command and conquer style - called Battle Drones, in which two armies of drones (both flying and ground-based) battle for territory and resources` `Let's start with a MVP design, ask me some questions` 这是一份[共享对话记录](https://claude.ai/code/session_015RYeKm4ji4N16oqthyX1b1)。我给 Claude Code for Web 设置了一个包含 OpenAI API key 的环境变量，让它使用 [OpenAI 图像生成 API](https://developers.openai.com/api/docs/guides/image-generation) 来生成素材，这为我带来了一些基础精灵图。 你可以在[这里试玩 v1](https://simonw.github.io/battledrones/v1/)——它长这样： 游戏画面。右侧一列文字图标，分别用于建造 Fab、Airpad、Turret、Harv、Sting、Flak、Scout、Wasp、Raptor。2D 战场上分布着块状的战争迷雾。有一些宝石、一座正被渲染得很粗糙的坦克攻击的总部建筑，以及散落的几辆蓝色载具。视觉上并不惊艳，但确实看得出是一个基础 RTS。 它已经具备 RTS 的样子，有建造机制、可以选中并指挥单位，还有一个基础 AI 可以对战。 这第一个版本勉强算个概念验证，玩起来一点都不好玩。 Claude 在早期版本中使用了 [Phaser](https://github.com/phaserjs/phaser) 2D 游戏框架。我直到好几个版本之后才发现这一点！ #### v2：完整精灵图 第二个版本（[在这里试玩 v2](https://simonw.github.io/battledrones/v2/)）为所有载具加入了精灵图，并增加了「AI 对战 AI」模式，这样我就能看着游戏自己玩，不用亲自操作。 事实证明 Claude 相当擅长编写提示词，让 OpenAI 的图像模型生成精灵图。你可以在 [`public/assets/sprites`](https://github.com/simonw/battledrones/tree/v2/public/assets/sprites) 文件夹中浏览 v2 的精灵图。 四个飞行单位、三个炮塔、一台采矿车和一个停机坪现在都有了正式的精灵图。废料场换了新设计，虽然不太好看，但至少用了图形。 #### v3：多样地形 它依然没什么意思，画面也很无聊。此时已是十月，我把模型升级到了 Claude Opus 5.5。我对它说： > `Massively improve this game. Make the graphics and gameplay better (keep it mobile friendly). Render new graphics using the latest OpenAI GPT image API (lookup details) with the API key in the environment variable. Add new unit types and balance the gameplay better. Also add new buildings and better, more varied terrain.` 结果是五张新地图，带有多种风格的生成背景图块，[可以在这里看到](https://github.com/simonw/battledrones/commit/aa22f08a34347d7d9f94b33f44a73b4deb046aa1)。Opus 还重新生成了精灵图，让它们在视觉上吸引人得多。你可以在[这里试玩 v3](https://simonw.github.io/battledrones/v3/)——它看起来是这样的： 地图现在是一张冰雪地图，有雪、冰和碎冰——效果真的很棒。载具和建筑也都做了外观升级。这开始像一个真正的游戏了。 这开始感觉像一个真正的游戏了！不过玩起来还是不太有意思——我发现自己很快就觉得无聊了。 #### v4：好玩更新 到目前为止，我的 Battle Drones 实验验证了我[之前的判断](https://simonwillison.net/2026/Sep/27/2026-in-llms-so-far/#simon-willillson-2026-in-llms.059.webp)：编码智能体可以造出一个看起来像游戏的东西，但无法做出真正让人沉浸其中、值得玩的作品。 我把这个理论在晚餐时讲给某人听，随后又想到，我应该给这些模型一个真正的机会来证明我错了。我在手机上给 Opus 5.5 输入了这条提示： > `This game isn't fun enough yet. Make it a LOT more fun.` 这一次我是在 [Ultracode 模式](https://code.claude.com/docs/en/workflows)下运行的，Claude Code（这里是 Claude Code for Web）会运行「动态工作流」，其文档中描述为： > 动态工作流是一个 JavaScript 脚本，用于同时编排许多[子智能体](https://code.claude.com/docs/en/sub-agents)。 这触发了*数小时*的工作。我在晚上启动它，直到第二天清晨才拿到可玩的结果。但成果非常出色。 你可以在[这里试玩 v4](https://simonw.github.io/battledrones/v4/)——它看起来是这样的： 熔岩地图。上行链路卫星正在被占领，水晶看起来更好了，单位上方显示 Elite 字样，有一个标着 Fight 的箭头可跳转到某场战斗，AI 对战 AI 模式有了速度控制器——这里有不少新功能。 我让 Claude [自己撰写发布说明](https://github.com/simonw/battledrones/blob/main/Battle%20Drones%20The%20Fun%20Update%20%E2%80%94%20Release%20Notes.md)——以下是亮点： > 现在每场遭遇战和每日行动都以一个选择开场，为处于劣势的一方提供了翻盘途径，并把两军拉向地图中央。另外还有两种新的玩法。- **开局选择**：在计时开始前选择 Blitz、Industry 或 Air Wing。- **呼叫技能**：弹幕轰炸、EMP、空投舱和天锤轨道打击。- **目标与残骸**：上行链路中继、补给投放，以及能换取废料的残骸。- **手感**：战斗打击感、自适应音乐、单位语音和播报员。- **指挥**：战场警报、游戏速度、已保存小队和触控放置。- **新模式**：最后防线生存波次，以及一个 8 个任务的行动战役。- **成长系统**：英雄、带嘉奖的战后报告、生涯、7 种突变器和每日行动。战斗持续更久，胜负更易翻转。在 Normal 难度的 1200 场 AI 对战 AI 测试中，25 分钟仍未分胜负的比赛比例从 14% 降到 0.9%。落后 800 以上废料的一方获胜比例从 24% 升至 46%。 Claude 花了这么久的部分原因，是它运行了一千多场模拟试玩对局，并用这些结果重新平衡了现有单位、加入了新单位，并引入了新功能。 #### v5：Battle Drones 进入 3D Ultracode 在「让它变得好玩得多」这件事上取得成功之后，我决定更大胆一些： > `Port this game to three.js with 3D models for all of the buildings and vehicles and landscapes` 那又是一次通宵运行。我醒来后看到[这个 v5 版本](https://simonw.github.io/battledrones/v5/)： 现在是 3D 了——战场带一点倾斜角度，建筑和载具全都是 3D 模型，岩石和树木看起来也有些立体感。 新的 3D 模型完全由 Claude 用 TypeScript 代码构建。 v6（[在这里试玩 v6](https://simonw.github.io/battledrones/v6/)）增加了一些视觉打磨。v7（[试玩 v7](https://simonw.github.io/battledrones/v7/)）加入了机器人步兵（突击兵、火箭小队、狙击手）和一架名为「Condor」的运兵飞机。 #### v8：群岛 我开始对自己在游戏设计上的实际投入之少感到内疚——过去几个版本，我基本上就是在说「让它更好玩」和「加点视觉打磨」。 我注意到 AI 并不常用 v7 新增的步兵和运兵飞机——在战略上没有太好的理由去用它们。 如果能有一张新地图，搭配一个新的游戏机制，积极鼓励玩家让 Condor 装载步兵机器人并把它们派往地图各处，那就太好了。 于是有了我迄今最长的提示词： > `Design a new map. Goal is to make different strategic incentives that encourage use of Infantry and Condors and aerial vehicles.` `To do this the map will have limited harvester resources but several more uplinks - but uplinks will be on islands that are inaccessible by land vehicles or infantry. These uplinks can also not be claimed using air vehicles. The ONLY way to get them is to fly infantry there in a Condor.` `Armies always start with a Condor and a single squad. If an army has no Condor a new one will be provided for free, flying in from the edge closest to their HQ and landing there. That free condor will come with a single free squad on board.` `The two HQs should be entirely separated by water, but still accessible by vehicles thanks to two bridges across the map in different places` `I want to encourage a battle over uplinks.` `The map should be the times the size of other maps - still square` `First research and then critique this design. Only build after we have agreed on any modifications` `You get to design a new biome for this` 结果是一张热带的**群岛**地图，有七个岛屿上行链路，玩家只能通过用 Condor 飞送步兵才能占领。一旦你掌握了来自更简单地图的基本游戏机制，这绝对是最好玩的一张地图。[v9 版本](https://simonw.github.io/battledrones/v9/)让这张地图更有趣了一点——它现在看起来是这样： 三座岛屿，每座都有一个上行链路卫星。蓝色方占据一座，红色方占据另一座。一架蓝色 Condor 正飞向红色岛屿，岛上由一架红色飞机守卫。附近有一座桥。主题是热带岛屿，看起来非常宜人。 #### v10：Goliath 与智能体对战 我决定给游戏加入巨型机器人机甲——可以想想 [Pacific Rim](https://en.wikipedia.org/wiki/Pacific_Rim_(film)#Plot) 里的 Jaeger，或者 Warhammer 40,000 里的 Titan。 以下是我与 Claude 头脑风暴时用到的一些提示词： > `Help me brainstorm ideas for adding giant robots to this game - think dreadnoughts or titans from W20K - how could we do this in a way that enhanced gameplay, kept things balanced, added unique twist? Don't overthink this yet` > `Let's keep brainstorming. I like the idea that it's a mobile base - that can accept harvested scrap and can have buildings built near it (even if it later moves on) and can produce infantry units too. An interaction with condor would be neat but I don't know what that could be.` > `Idea: as it gets damage it loses the ability to fire some weapons - by default it has eye laser (like lancers) and arm canons (like titan) and two shoulder mounted mortars, plus machine guns similar to a squad of troops` > `Damage knocks out mortars and then laser - it always has guns. You can't build next to a building that was only put there because of the mech, you need the mech there for off-base building and only within three squares of it` > `[...] Lets do two condors can carry the mech` 最终结果*非常酷*。 你的浏览器不支持 HTML video。Goliath 可以通过 Gantry 来建造——Gantry 是一种必须先建造 Fab、Bay、Airpad 和 Tech Lab 之后才能建造的建筑。你可以看到正在建造中的 Goliath，随后它会从 Gantry 中走出来，并能在地图上行进。 Goliath 可以「锚定」，即将自己扎入地下。在锚定状态下，它可以充当新的总部，在新区域中建造步兵单位和额外建筑。 两架 Condor 飞机可以挂接住一台 Goliath，届时就可以带着它在地图上飞行！ 现在，当你摧毁敌方的总部建筑*以及*他们可能建造的任何 Goliath 时，游戏才会结束。 还有一些与 Goliath 相关的突变器： - **G