![微信图片_20261016103422_90762_27.png](https://developer.qcloudimg.com/http-save/yehe-12654628/1ec3183c03e5cc2ac1486663672b7edf.png)
## 概述

从零开始，我用 AI 助手 **WorkBuddy** 在几周内完成了一款**可联机的第一人称团队射击（FPS）网页游戏**。整个过程没有手写一行「从零搭框架」的代码——绝大多数是靠「说需求 + 贴截图反馈」驱动 AI 完成的。

本文不堆砌引擎原理，而是复盘我如何把一个听起来很大的目标（「做个能联机、有 bot、有攻防模式的射击游戏」）拆成一次次对话，最终落地成一个真能玩的项目。文末会总结一套对游戏爱好者真正有用的 **Prompt 心法**，以及几个踩过的坑。

## 一、为什么是 WorkBuddy，而不是「只聊天的 AI」

做游戏最怕两件事：**环境跑不起来**、**报错没人看**。WorkBuddy 在这两点上和「聊天机器人」有本质区别：

1. **Agent 模式能直接干活**：它能在项目里建文件、改代码、起本地 Node 服务器（**node server.js** 监听 8080）、跑冒烟测试，而不是只给你一段伪代码让你自己复制。
2. **能看截图、能定位根因**：遇到「武器发黑」「人机撞墙」「弹道扩散」时，直接把游戏截图甩给它，它会结合代码定位到具体那一行，而不是泛泛而谈。
3. **能守住边界**：项目里有不少「禁止上传云端/公网」的敏感内容，它会主动区分本地与联网，不会擅自把东西推到公网。

> 一句话：它是个「会自己写代码、自己跑、自己验证」的搭档，而不是「给你建议的顾问」。

## 二、我想做的到底是什么

先说清楚目标，这决定了后面所有对话怎么提。需求清单：

- **类型**：第一人称团队射击（FPS）网页游戏，浏览器直接开。
- **技术栈**：前端 Three.js 渲染，后端原生 Node + WebSocket 做**服务端权威命中判定**（防作弊、防不同步）。
- **玩法模式**：
  - **assault** 攻防占点：攻方占点、守方防守；
  - **ffa** 个人竞技；
  - **dm** 团队死斗。
- **单机人机**：可一键塞满 bot，断网/没朋友也能玩。
- **地图**：古埃及神庙（金字塔、房屋、棕榈、灌木）、训练场。一个地图约 185 个物件、100+ 碰撞盒。
- **武器**：步枪 / 冲锋枪 / 手枪 / 沙鹰 / 霰弹 / 狙击 / 刀。

听起来很夸张？但拆成「每次只改一个可验证的小点」，AI 完全接得住。

## 三、真实踩坑与解决实录（核心）

这一节是全文最有价值的部分。每个案例都是**真实发生**的，统一按：现象 → 根因/解法 → 结果。

### 案例 1：模式跑偏——从「爆破」改「攻防占点」

- **现象**：第一版做成了 AB 点爆破，实际要的是「攻方占点、守方防守」。
- **解法**：重写服务端回合逻辑，加入据点占领判定、攻防角色轮换、占满即胜。
- **结果**：攻防占点模式跑通，截图核对坐标后与预期一致。

### 案例 2：所有武器建模都是黑的

- **现象**：进游戏，手里每把枪都是纯黑的。
- **解法**：根因是材质/光照没接好（不是模型本身），补上自发光与方向光后恢复正常。
- **结果**：7 把武器全部正常显示。

### 案例 3：人机撞墙卡死（最有代表性）

- **现象**：bot 贴着墙不动，或者绕着房子打转，永远到不了目标点。
- **根因**：原 tickBot 障碍规避只尝试固定 ±77° 偏转角，遇到长墙/新增房屋建筑就失效。
- **解法**（重写后的逻辑）：
  - 锁定一个「偏好绕行侧」，沿该侧优先扫描取第一个空闲方向；
  - 双侧兜底，绝不让方向定死在被挡方向上；
  - 加两道脱困翻转：① 真正卡死超 1.5 秒翻转；② 持续绕障却 3 秒无进展翻转。
- **验证**：headless 导航测试最大冻结时间 **0.0 秒**；联机冒烟测试里 4 个 bot 各移动约 **37 米**、位移 8 到 25 米，结果 **PASS**。
- **启发**：这类逻辑要让 AI「有判断机制」，而不是「一刀切加规则」。

### 案例 4：枪弹道一直在扩散，打不中人

- **现象**：弹道不收敛，实际打中人身上的子弹就 1 至 2 发。
- **根因**：客户端每开一枪就把 spread 加 1（封顶 3.4），叠加散布系数后，腰射稳态半角高达约 **18 度**，子弹乱飞。
- **解法**：改为按武器的小步累加 + 每帧衰减：

```javascript
// public/js/player.js —— onShot()
this.spread = Math.min(1.2, this.spread + (W.sprayStep || 0.08));

// shared/arena.js —— 每把武器定义 sprayStep
// rifle: 0.10, smg: 0.12, pistol: 0.06, deagle: 0.07,
// shotgun: 0.04, sniper: 0.05, knife: 0
```

  因为每帧衰减远大于每发增量，spread 会稳定在首枪值附近。
- **结果**：腰射散布从 18 度收敛到 **步枪 1.6 度 / 冲锋枪 2.5 度**（20 米处命中半径约 0.28 米 / 0.86 米），命中集中度大幅提升。

### 案例 5：比赛结束没有结算画面

- **现象**：占点赢了只弹一行居中文字，没有结算、没法回房间/主菜单。
- **解法**：
  - 服务端：整场结束（matchOver）后主动回大厅，并在结束广播里附带每个人的战绩（击杀/死亡/延迟）；新增「返回房间」「再来一局」两个消息类型。
  - 客户端：整场结束时释放鼠标、弹出结算面板（胜负、最终比分、战绩记分板），三个按钮分别发对应消息。
- **结果**：攻防/个人竞技整场结束会弹**结算画面**，可「返回房间 / 返回主菜单 / 再来一局」。

### 案例 6：UI 太「网游」，改成 CF 风格

- **现象**：整体 UI 太死板，像常规网游。
- **解法**：把圆角「守望先锋风」覆盖样式整体推翻，重写为战术军事风——枪铁灰底 + 琥珀橙主色、切角面板配四角角标、冷凝大写字体、菜单网格扫描线、游戏内 HUD 战术边角框。
- **结果**：刷新即生效（硬刷 Ctrl+Shift+R），整站统一到 CF 战术风。

## 四、给想用 WorkBuddy 做游戏的同学的 Prompt 心法

踩了这么多坑，最想分享的是「怎么提需求」：

1. **截图优先于长篇描述**：把「现象」用截图钉死，比写三百字描述快 10 倍，AI 也少猜。
2. **先根因，再修**：明确要求「先分析根因再改」，别让 AI 凭直觉改一行了事。
3. **给判断机制，而非死规则**：比如碰撞检测要「有判断机制，不能一刀切」。
4. **分步审核，逐点过审**：让 AI 先出方案，再按分点给材料，每一点确认了再往下走。
5. **让它自己验证**：要求「改完跑个测试/冒烟验证再汇报」，别只看它说「好了」。
6. **守住本地边界**：敏感数据、内部代码，明确告诉它「禁止上传云端/公网」。

## 五、一点架构干货（给想深挖的你）

- **服务端权威命中**：客户端算带散布的射线，把原点和方向发给服务端做判定（步枪/冲锋枪服务端不二次散布，所以客户端散布同时决定视觉与命中）。
- **双通道渲染**：主相机 layer 0 + 武器相机 layer 1，解决「枪穿墙」的经典问题。
- **代码分层**：服务端逻辑、客户端脚本、武器/地图数据三块分开，改起来互不打架。
- **本地运行**：执行 node server.js 后，浏览器打开本地 8080 端口即可。

## 六、总结

游戏爱好者也能靠「对话」做出**可玩、可联机**的游戏——这件事在 WorkBuddy 这类 Agent 工具出现后才真正变便宜。它不是替你「想创意」，而是把「从想法到能跑的项目」之间的体力活（搭环境、改 bug、起服务、写验证）承包了。

而它最大的价值，恰恰是那句被说烂但真有用的话：**你负责「判断」，它负责「执行」**。把现象描述清楚、把「要有判断机制」说清楚，剩下的交给它迭代。

> 彩蛋：这篇文里提到的整套游戏，本身就是和 WorkBuddy 一次次对谈出来的。你也可以用同样的方式，做出你的第一款游戏。

---

本文为个人实战经验分享，项目代码与素材均为本地开发，未涉及任何云端敏感数据。

从零开始，我用 AI 助手 WorkBuddy 在几周内完成了一款可联机的第一人称团队射击（FPS）网页游戏。整个过程没有手写一行「从零搭框架」的代码——绝大多数是靠「说需求 + 贴截图反馈」驱动 AI 完成的。

# 用 WorkBuddy 开发 FPS 网页游戏：我的实战经验分享

人工智能

从零开始用AI助手WorkBuddy做联机FPS网页游戏，不手写框架代码，靠对话和截图反馈驱动开发。复盘攻防占点、bot导航、弹道修复等实战案例，分享游戏开发Prompt心法和踩坑记录，教你用自然语言快速落地可玩项目。

2026上云采购 | AI焕新·智启新局

workbuddy

文章

问答

视频

教程

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云智能顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

EdgeOne AI 安全实战专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

聚焦“写作效率、视觉美观与运行性能”三方面进行全面升级，为您提供更高效、稳定的创作环境

社区富文本&Markdown编辑器全新改版上线，欢迎大家体验!

诚挚邀请您参与本次调研，分享您的真实使用感受与建议。您的反馈至关重要，感谢您的支持与参与！

社区新版编辑器体验调研

# 用 WorkBuddy 开发 FPS 网页游戏：我的实战经验分享-腾讯云开发者社区-腾讯云

# 用 WorkBuddy 开发 FPS 网页游戏：我的实战经验分享

# 用 WorkBuddy 开发 FPS 网页游戏：我的实战经验分享

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐