game-ui-ux

1# Game UI/UX
2 
3Build HUDs and menus that stay correct on a phone, an ultrawide monitor, and a TV across a
4gamepad and a mouse. This skill owns the engine-neutral UI architecture — responsive layout,
5scaling, focus navigation, screen flow, and how UI talks to game state — and defers the
6concrete widget API to the engine UI skill.
7 
8## When to use
9 
10- Use when building a HUD (health/ammo/score), a menu (main/pause/settings), an inventory or
11  shop screen, or any overlay, and you want it to scale and navigate correctly.
12- Use to fix UI that breaks at other resolutions/aspect ratios, ignores notches/safe areas,
13  can't be used with a controller, or is wired to game state by per-frame polling.
14- Use to structure screen flow (title → game → pause → settings) as a stack, not flag soup.
15 
16**When *not* to use:** for the engine's concrete UI nodes/components and styling, use
17`godot-ui-control` or Unity UI (UGUI/UI Toolkit). For *visual* punch (button pop, damage
18numbers, shake) use `game-feel`. For branching conversation UI use `dialogue-systems`. For
19translating UI strings, that is localization (see `references/` and `input-systems` for
20rebinding screens). For card/board layout specifics, the `card-game` genre composes this skill.
21 
22## Core workflow
23 
241. **Pick a layout model: anchors + containers, never absolute pixels.** Anchor elements to
25   edges/corners/center and let containers (rows, columns, grids) flow children. Absolute
26   `(x, y)` positions break at the first new resolution.
27…