我的工作涉及IT基础设施，比如服务器、终端管理这类。JavaScript知识基本为零。过去几周我开发了一款冷战背景的3D海战游戏。觉得这个子版块会对工作流程感兴趣——因为我最终用了三种不同工具完成三类不同任务。

它是什么

https://preview.redd.it/29nefgd1koqh1.png?width=765&format=png&auto=webp&s=0936c25e83e2332da70f86ea2843959dffca9349

试玩：https://wildenste.in/seegefecht/seegefecht.html

单个HTML文件，Three.js渲染。无构建步骤，无框架。完全没有图片文件，所有视觉效果在页面加载时生成。

海洋是自定义WebGL着色器配合Gerstner波浪，因此舰船、浮标、油污和涟漪都位于同一计算曲面上。舰船纹理在运行时绘制到画布上：锈迹、盐渍、防滑甲板、水线以下藻类。音效通过Web Audio合成。

两种基于真实型号的巡航导弹。战斧式导弹贴海飞行并通过航路点导航；俄罗斯P-700花岗岩则以1.6马赫直线突进。不同模型、不同飞行行为、不同引擎音效。战斧是涡轮风扇引擎，带有压缩机的音调啸声；花岗岩是无活动部件的冲压发动机，燃烧不稳定，发出嗡嗡声。

约3900行代码。一支舰队由275个网格组成。仅航空母舰就有124个部件，包括弹射器和起降的舰载机。

https://preview.redd.it/yq6355jqloqh1.png?width=1005&format=png&auto=webp&s=14c3e7d491b8d98fcde2b23fd7be2208cf5b8bcf

三款工具

Claude 编写了大部分代码并负责重度调试。它擅长坚持解决问题，并且实际测量而非猜测。

ChatGPT 我大量用于审查和纠错。将同一文件交给第二个模型审查，能捕捉到第一个模型忽略的问题；它对Claude的一些结构选择提出了有用的反驳。有时它们意见不一，我必须做出判断——说实话这是最有趣的环节之一。

Suno 负责配乐。三首曲目：菜单主题曲，以及根据玩家选择美国或俄罗斯舰队而切换的不同战斗音乐。我之前尝试用代码合成音乐，结果听起来就是那回事。Suno是恰当的工具，而且遥遥领先。

https://preview.redd.it/nql60xetloqh1.png?width=1142&format=png&auto=webp&s=61e588706b87fefe8db5e3756a90ae5255cc40bb

调试部分

这是我学到最多的环节。游戏在第11回合左右开始卡顿，冻结超过一秒。我自己永远发现不了问题。Claude对代码进行了仪器化测量：每个标记浮标周围的小涟漪环，每循环一次就创建新的几何体和材质——每个浮标都这样。第1次射击生成2个对象，第3次生成9个，第5次16个，第6次22个，呈二次增长。这就是为什么只在第11回合左右崩溃，因为那时已有足够多浮标入水。修复后，每场比赛的分配从1355次降至42次。

另一个问题：油污不断闪烁消失。结果发现它只应用了60%的水平波浪位移，而海洋使用了100%，导致两个表面横向漂移，在陡峭波面上海水会淹没油污。

https://preview.redd.it/5ii8c72dnoqh1.png?width=1103&format=png&auto=webp&s=a44ed8d6d9c00bf78fad686e2e77ea844777892c

我实际做了什么

我知道它应该看起来和感觉如何。当导弹飞行轨迹像是在舰船上跳跃（如同越过地形）时，我提出了反对。我多次否定了泛泛的UI设计。我注意到"每次命中都让战舰离海底更近"这句话不对，因为击沉任何舰船都需要四五次命中。

另外就是大量在真实设备上测试并报告问题。两个模型可能都自信满满，但也都可能出错——而且它们都看不见屏幕。

https://preview.redd.it/twgbbtozloqh1.png?width=1088&format=png&auto=webp&s=094a7635f4a9402ee03157a595840a7280f9bf6a

让我惊讶的事

测试基础设施占了很大比重。大约有30个测试脚本在无头模式下运行游戏：测量飞行路径、检查音频合成、追踪20回合内的对象增长、验证沉没的舰船不会意外让半个舰队变透明。正因如此，棘手的bug才能够被发现。

我最喜欢的一点：我可以让想法落地，而无需花数年学习一门语言。结果仍然感觉是属于我的，因为所有关于外观和操作体验的决策都来自我。

真诚地感激每一位玩家、每一条反馈和每一个功能请求！

乐意回答关于工作流程的问题。

https://preview.redd.it/7bkg490hnoqh1.png?width=1199&format=png&auto=webp&s=6dcd9c88f80102ce73e3a4185af54a40ea64f57c