fe21c07d84
Nine agent skills for building Makepad/Rust games, ported from majidmanzarpour/threejs-game-skills. Same director-routed workflow and premium bar; runtime rewritten for this fork's game crates. - makepad-game-director entrypoint, routing, continuity, asset probe - makepad-gameplay-systems loop, movers vs rigid bodies, input, camera, netplay - makepad-aaa-graphics-builder lighting, shaders, budget, visual scorecard - makepad-game-ui-designer HUD, menus, touch and XR UI - makepad-debug-profiler defect bisection and profiling - makepad-qa-release verification ladder, evidence, packaging - makepad-3d-generator CC0 model search, casts, procedural geometry - makepad-image-generator texgen textures, palettes, sky, icons - makepad-audio-generator sample bank, mixer, material impacts, 3D audio Written against the real APIs in libs/game/*, libs/sim and apps/arcade: the game.* verb table, GameRenderer adaptive quality, the packed 6-float GameMeshVertex layout, script_mod! splash styling, makepad-test driving, and the BUDGETS.md numbers. No paid generation API is required - the CC0 library plus seeded makepad-game-gen replaces them. Includes install.sh (Codex/Claude), validate-skills.sh and a repo-aware probe_assets.sh; both scripts verified against this checkout.
66 lines
4 KiB
Markdown
66 lines
4 KiB
Markdown
# HUD patterns
|
||
|
||
## Layouts by genre
|
||
|
||
**Racing** — speed and gear bottom-right (large, diegetic if there is a dashboard), lap/position top-left, lap-time delta top-centre only while it is changing, minimap or track outline bottom-left, checkpoint countdown centre when under 5 s.
|
||
|
||
**Arena / survival** — health bottom-left near the character's screen position, ammo bottom-right, wave and enemies-remaining top-centre, damage direction as arcs around the crosshair, pickup prompts in world space at the object.
|
||
|
||
**Traversal / platformer** — minimal. Lives and collectibles top-left, everything else in the world. A platformer with a busy HUD is a platformer whose level design is not carrying the information.
|
||
|
||
**Strategy / sandbox** — resources top bar, selection panel bottom, minimap a corner. This is the one genre where a dense HUD is correct.
|
||
|
||
**Flight** — attitude indicator and horizon centre, altitude and speed flanking it, target markers in world space.
|
||
|
||
## Placement
|
||
|
||
Screen centre is for the crosshair and for things the player must not miss. Corners are for ambient state. The rule: **the more urgent the information, the closer to where the eye already is.**
|
||
|
||
In an action game the eye is on the player or the crosshair — not on the top-left corner. A health bar that only exists in the corner will be discovered empty. Mirror critical state near the action: a vignette, a crosshair colour shift, a screen-edge pulse.
|
||
|
||
## Anti-patterns
|
||
|
||
- **The stat card.** Nine labelled numbers in a rounded panel. This is a debug overlay, and it is the clearest single tell of unfinished UI.
|
||
- **Permanent tutorial text.** Show a prompt when the action becomes available; hide it once used twice.
|
||
- **Numbers where a shape works.** `Health: 73/100` is slower to read than a bar.
|
||
- **Decorative animation.** Peripheral motion reads as a threat. Spend it on real events only.
|
||
- **Thin light text over the world.** Invisible against a bright sky exactly when the player is in trouble. Outline, shadow, or a scrim.
|
||
- **Precise-value obsession.** `1247.83 m` — nobody reads the decimals at 200 km/h.
|
||
- **Hover-only information.** Does not exist on touch.
|
||
|
||
## Animation timings
|
||
|
||
| Change | Timing |
|
||
| --- | --- |
|
||
| Health/resource drain | ~0.2 s ease-out, plus a ghost bar lagging ~0.5 s to show the size of the hit |
|
||
| Score increment | count up over ~0.3 s; never jump |
|
||
| Damage flash | 1–2 frames at full, then decay over ~0.15 s |
|
||
| Prompt appear | ~0.12 s fade + small rise |
|
||
| Panel transition | ~0.2 s; anything slower interrupts play |
|
||
| Critical pulse | ~1 Hz, subtle amplitude, only below threshold |
|
||
|
||
Nothing blocking. If the player cannot act during an animation, it is too long.
|
||
|
||
## In-world HUD
|
||
|
||
`draw_billboard_labels` and `draw_hud_overlay` in `makepad-game-render::hud`; sim-side state in `makepad-game-sim::hud`; `thermometer` for gauge-style readouts. Script verbs: `text`, `bar`, `crosshair`, `label`, `label_text`.
|
||
|
||
Billboard labels need distance handling or they become an unreadable pile: fade beyond a range, scale with distance but clamp the minimum, cull occluded ones, and cap how many can show at once. Nameplates that overlap are worse than no nameplates.
|
||
|
||
Interaction prompts belong at the object (`interactable`, `interact_prompt`, `InteractSet`, `InteractAction`), not in a corner. The player is looking at the thing.
|
||
|
||
## Damage and feedback
|
||
|
||
A hit must be unmissable across several channels on the same frame — sight, sound, and motion. One channel alone gets missed during action:
|
||
|
||
1. HUD bar drop with ghost
|
||
2. Screen-edge vignette in the damage direction
|
||
3. Camera shake (trauma-based, never in XR)
|
||
4. Impact sound
|
||
5. Particle burst at the impact point
|
||
|
||
That combination is what makes a hit *feel* like a hit; any one of them alone reads as a number changing.
|
||
|
||
## Minimaps
|
||
|
||
Only if the space is large enough to get lost in. Rotate with the player for first/third-person, keep north-up for strategy. Show only actionable things: objectives, threats, the player. A minimap showing every prop is decoration.
|