技能介绍

跨设备 UI 的真正难点

做游戏 UI 最折磨人的不是画图标，而是适配。你在 16:9 显示器上调试好的绝对坐标布局，拿到手机上被刘海挡住一半血条，放到电视上又被 overscan 裁掉关键按钮。更常见的是：UI 只能鼠标点，手柄玩家对着菜单干瞪眼；HUD 每帧 Update() 轮询血量和分数，逻辑和界面耦合得死死的。

Game UI/UX 要解决的就是这一层——它不关心引擎具体用的是 Control 节点还是 Canvas，而是提供一套引擎无关的界面架构：响应式布局、缩放策略、焦点导航、屏幕流转，以及 UI 与游戏状态之间的数据流。

核心工作流

这个技能的核心思路是永远不要写死像素坐标，具体拆成七步：

锚点 + 容器模型：把元素锚定到屏幕边缘、角落或中心，用 Row、Column、Grid 等容器让子元素自动排布。任何写死 (x, y) 的方案都会在一个新分辨率下立刻崩掉。
选定全局缩放策略：先定一个参考分辨率做整体缩放（fit），再决定超宽屏或竖屏下多余空间怎么处理——加黑边、横向扩展，还是把 HUD 四角向外锚定。
尊重安全区：关键 UI 从屏幕边缘内缩，避开刘海、圆角和电视过扫描区域。
让每个界面可键盘/手柄导航：每屏设定一个初始焦点控件，定义 focus order 和相邻关系，并给出清晰的焦点高亮。鼠标和焦点必须共存，切输入设备不能把用户晾在原地。
屏幕即栈：暂停菜单压在游戏之上、设置页再压一层，用 push/pop 管理输入和可见性，而不是一堆 isPaused、inSettings 布尔标志搅在一起。
事件驱动 HUD：订阅 health_changed、score_changed 这类信号，只在事件触发时更新界面，而不是每帧去读游戏状态。
跨设备验证：拉窗口大小、切宽高比、拔掉鼠标只用手柄走一遍，报告你实际在什么分辨率下观察到了什么结果。

边界与注意点

这个技能不负责具体控件的 API 和样式——那是 Godot UI 或 Unity UGUI/UI Toolkit 的事。按钮的打击感、伤害飘字、画面震动等“手感”层交给 game-feel；分支对话 UI 用 dialogue-systems；文案翻译属于本地化流程。另外别忘了把字符串外置，硬编码的英文文案在翻译成其他语言时很容易把按钮撑爆。