| name | threejs-game-ui-designer |
| description | 设计高端的 Three.js 游戏 UI。用于 HUD、菜单、浮层、暂停/胜利/失败界面、设置、图标控件、触控 UI、排版、响应式布局、安全区、文字排布，以及 UI 与场景的协调统一。 |
Three.js 游戏 UI 设计师
目的
让游戏 UI 有意图、易读、响应式，并契合具体品类。
工作流
在设计 HUD、菜单、浮层、暂停/胜利/失败界面、设置、触控、排版、响应式布局、安全区、文字排布、图标或 UI/场景协调时，把加载 references/ui-patterns.md 作为第一步。用一张参考台账追踪它，标注是/否、路径和跳过原因。只要这份参考在界面工作中被跳过，就不要把 UI 阶段标记为完成。
在宣称 UI/HUD/菜单工作完成之前，加载 references/checklists/game-ui-quality.md、references/checklists/hud-readability.md 和 references/checklists/responsive-ui-fit.md。当涉及触控或移动端安全区时，加载 references/checklists/mobile-input.md。
仅当用户要求可复用提示词、一份 UI 打磨提示词或任务模板时，才加载 references/prompt-templates.md。
当 logo、图标、GUI 美术、阵营标记、菜单背景、贴花或 2D HUD 素材能提升质量时，加载 threejs-image-generator。threejs-3d-generator 仅用于 3D 菜单/展示物体或叙事性 3D UI 道具，不用于普通的扁平 HUD 元素。
- 抓取/检查桌面和移动端截图。
- 盘点 UI 状态：玩法中、暂停、设置、失败/重试、胜利/里程碑、加载、触控。
- 定义层级：生存/状态、目标、反馈、氛围。
- 用精心设计的组群、量表、徽章、图标、警示和模态状态替换功能性数据卡片。
- 使用稳定的尺寸、安全区留白、文字排布约束，以及悬停/按下/聚焦/禁用状态。
- 把 UI 接到游戏状态上，而不是复制一套规则。
- 核验文字排布、重叠、安全区、触控目标、响应式截图和真实的状态变化。
常见失败模式
- 通用的仪表盘/数据卡片式 HUD。
- UI 遮挡了玩家/威胁。
- 文字在移动端发生偏移/裁切。
- 装饰性面板降低了可读性。
- 触控看起来对了，但并未发出意图。
最终回复
报告参考台账、UI 状态清单、UI 意图、覆盖的状态、改动的文件、截图、文字排布/重叠检查、安全区/触控目标证据、操作方式，以及尚存的风险。
