The interface design for World-Sim: the look and feel ("Salvage"), the design system that builds it, and the spec for every screen. Extracted from the interactive prototype under docs/ui-prototype/, which stays as the live sandbox; these docs are the canonical spec the C++ UI implements against.
This covers interface chrome (panels, readouts, controls). For terrain and world art direction see visual-style.md.
- design-language.md — what Salvage is: principles, palette, typography, texture, motion.
- design-system/tokens.md — every design value (readable). Canonical: tokens.json.
- design-system/components.md — the 14 primitives: variants, props, states, anatomy, behavior.
- design-system/icons.md — the 51-glyph line-icon set. Canonical: icons.json.
The pre-game flow then the in-game HUD. See screens/INDEX.md.
Splash → Main Menu → Scenario Select → Party Selection → World Generation → Landing Site → In-Game.
Rendered screenshots of every screen and in-game state are in mocks/, captured from the prototype by docs/ui-prototype/scripts/capture-mocks.mjs (re-runnable).
The canonical data files are generated from the prototype, not hand-edited:
node scripts/extract-tokens.mjs→tokens.json+palette.svgnode scripts/extract-icons.mjs→icons.json+icons-preview.svgnode scripts/capture-mocks.mjs→mocks/*.png
Run from docs/ui-prototype/.
- docs/design/INDEX.md — game design index
- docs/design/game-systems/colonists/equipment.md — the inventory model the gear UI shows
- docs/technical/ui-framework/INDEX.md — the C++ UI framework (implementation side)