流火产品系统

立项原因
：
随着短视频直播生态走向成熟，观众的观看需求已从"单向看我玩"升级为"我要一起参与玩"。抖音直播间的弹幕小游戏（如《熊猫大战》《弹幕农场》等）正是顺应这一趋势的产物——观众无需下载安装，只要在直播间发送弹幕，就能实时影响屏幕里的游戏进程，把"看播"变成"参播"，从而显著提升直播间的互动率、停留时长与用户黏性。然而市面上这类弹幕小游戏普遍存在玩法单一、同质化严重的问题：多以答题、投喂、养成、简单竞速为主，玩法深度与观赏性不足，主播短期靠它拉活跃可以，却难以形成长期差异化的直播间内容。
本项目正是在这一背景下立项：在借鉴《熊猫大战》等成熟弹幕互动玩法的基础上进行玩法创新，把"弹幕即操控"的强互动机制与"双阵营士兵实时对战"的策略对战玩法相结合，打造一款玩法更有深度、画面更具观赏性、对抗更激烈的直播间弹幕小游戏。通过游戏内四个按钮与抖音直播弹幕系统对接，观众发送特定弹幕即可触发对应的作战指令（如出兵、释放大招等），让每一位观众都能真实地"亲手参与"战斗，从而把直播间的围观流量转化为高黏性的交互用户，也为主播提供差异化的直播内容。

行业场景、业务背景
：
本项目面向抖音等短视频直播平台的"直播互动娱乐"细分赛道，服务对象是平台上的游戏主播、娱乐主播及 MCN 机构。直播场景下，主播开启本项目小游戏即可开播，观众在直播间通过弹幕实时参与对战，形成"主播引导弹幕—观众发弹幕触发—游戏实时反馈—主播点评互动"的完整互动闭环。项目采用纯前端 + Electron 的轻量架构，即开即播、零运维成本、无需服务器，适合主播低成本高频开播。业务上能直接提升直播间的互动数据（弹幕量、停留时长、粉丝团活跃度），具备低门槛、强互动、易传播、可规模复制的商业化潜力，是"内容 + 互动 + 变现"三合一的新型直播娱乐载体。

具体功能模块：
① 弹幕对接系统：游戏内四个操作按钮与抖音直播间弹幕系统对接，实时解析观众发送的特定弹幕，并映射到对应按钮，触发下单、出兵、释放大招等作战行为，实现"发弹幕即操控"。
② 双阵营士兵实时对战：天庭（红）/玄朝（蓝）双军士兵在竖屏战场自动推进、索敌并攻击对手，由弹幕/玩家指挥双方兵力攻防，直至一方基地血量归零结算。
③ 士兵 AI 引擎：为上百名士兵分别实现分离力转向、避让、目标搜索等自主行为，士兵自动绕开障碍、锁定最近敌人，配合空间哈希做近邻查询，把索敌与碰撞从 O(n²) 降到近似 O(n)。
④ 战斗结算系统：包含子弹命中判定、AOE 范围伤害、死亡幂等控制、单体与基地伤害结算，保证同一目标不会被重复结算、已死亡士兵不会被二次击中。
⑤ 双阵营特色大招：天庭"圣裁"金色光柱 + 半球冲击波（scale 0.1→500 渐变），玄朝"同死"红色激光雨（实例化下落 + 爆炸球），各带独立触发、结算、落地特效的完整状态机。
⑥ UI 前端：双阵营主题 HUD（天庭金白/玄朝红黑霓虹）、竖屏 9:16 自适应布局、炮弹对撞/撕裂等过场转场、暂停/设置/进度存档、三视图切换、FPS 监控，全程原生 JS + CSS 无 UI 框架。
⑦ 程序化建模：士兵/基地/特效/粒子全部纯代码生成，GPU 实例化（InstancedMesh2）实现上百士兵合批至 2 次绘制调用，零外部美术资产。
⑧ 音频与性能：Howler 封装音频加载与播放；空间哈希、网格减面、UnrealBloom 后处理等多轮调优，配合"先检测后决策"的性能优化流程。

主要功能描述：
本项目在《熊猫大战》类弹幕小游戏基础上玩法创新。直播时观众在抖音直播间发送弹幕，系统实时解析并将弹幕映射到游戏内四个按钮，触发对应的作战指令；红蓝双军士兵据此自主推进、索敌、开火，双方围绕基地攻防展开实时对战

我负责的具体任务：
本项目由我独立承包、一人完成全部研发链路。包括：① 需求确认与方案设计——对标《熊猫大战》等弹幕互动游戏，确定"弹幕操控 + 双阵营对战"的玩法内核，设计整体技术架构与页面流程；② UI 前端开发——手写双阵营主题 HUD、竖屏 9:16 自适应布局、炮弹对撞/撕裂转场、暂停/设置/存档、三视图切换与 FPS 监控，全程原生 JS + CSS 无 UI 框架；③ 后端战斗逻辑——士兵 AI（分离力转向/避让/空间哈希索敌）、子弹命中/AOE/死亡幂等、基地血量结算、双阵营大招状态机；④ 程序化建模——士兵/基地/特效/粒子纯代码生成，零外部美术资产；⑤ 音频系统——Howler 封装加载与播放；⑥ 测试与维护——修复贴图闪帧、大招零伤害、BGM 叠音等多类 bug，并建立可复用研发闭环与双态停止验收。一人历时四周交付完整可玩成品，全链路无外援。

项目使用的技术栈、架构、实现亮点与难点：

技术栈：Three.js r186 + 纯代码程序化建模 + Howler 音频 + 原生 JavaScript ES module + Electron 容器，配 GPU 实例化（InstancedMesh2）、空间哈希、UnrealBloom 后处理、SpriteSheet 帧动画与 O(1) 对象池。
架构：单场景内存中无服务器即时对抗逻辑，纯前端运行、无网络依赖；弹幕对接层与游戏逻辑解耦，通过四个按钮接口做事件驱动，便于后续接入直播弹幕网关，实现"弹幕到作战指令"的无缝映射。
亮点：士兵 100 个 GPU 实例化合批至 2 次绘制调用；空间哈希把索敌从 O(n²) 降到近似 O(n)；无 UI 框架手写全套界面；全程零外部美术资产。
难点：贴图金色闪帧——追到根因是同步建材质无贴图 + 异步加载时序冲突，改为提前预加载 + 缓存绑定治本；