Context
Who: players on a TV or monitor, long sessions, one hand on the controller. Jobs: track quests while fighting, read dialogue as prose, compare loot, level up. Constraints: ornate is a feature, but never at the cost of contrast, min-size, or colorblind safety; lore text is long, so the reading face must be comfortable.
Principles
| Rule | Rationale |
|---|---|
| Three faces, three registers | Titles and damage are display; controls and counters are UI; dialogue and lore are text. Mixing registers breaks both mood and readability. |
| The setting is in the ornament, not the legibility | Parchment panels and gold rules carry the fantasy; contrast and min sizes stay at system standard. |
| Counters never move | Tabular numerals for health, mana, gold, and XP, so ticking values do not jitter. |
| Rarity is shape, color, and label | Item rarity survives colorblind modes and grayscale through frame style and text. |
HUD scene
Damage numbers are the display face at its loudest; the combat log is the text face at working size. Neither is used for the other's job.
Dialogue
Dialogue is the reading surface of a game: prose set in the text face at a real measure, choices in the UI face, and the speaker's name in the display face.
ELOWEN
Inventory and level-up
Inventory · rarity by frame, label, and hue
Blade
Signet
Ash
×3
Fragment
×12
Level up
Typography
The three faces are tokens; a scene may use two registers at most, and lore never borrows the display face. This page follows the same rule.
- Cinzel's capitals are display-only: sentence-length text in the display face is unreadable at TV distance.
- Alegreya Sans carries every interactive label, so controls look like controls across every menu.
- Spectral is the only face used for prose and tooltip explanations, at a 60–70 character measure.
Color
Parchment, ink, gold, and the three resources. Every resource bar also carries its label and number, so the palette is mood, not meaning.
Components and states
Buttons
Menu item states
Hotbar slots
Ready, available, cooldown, locked — the cooldown shade is a value, not decoration.
Quest states
Motion and accessibility
Motion budget
- Damage numbers rise once (1.5 s) and vanish; the value itself cuts, it never counts up.
- Cameras, panels, and menus move with purpose; nothing loops decoratively in the frame.
- Reduce motion stops rising numbers and screen shake; reduce flash bounds the damage vignette.
Accessibility
- Dialogue has a proper reading measure and adjustable size; subtitles identify the speaker.
- Rarity is frame + written tier + hue, never hue alone; the same holds for damage types.
- Menus are controller- and keyboard-navigable with a focus state that survives grayscale.
- Safe-zone containment is verified as a probe, not eyeballed.
Verification
Live probes
| Pair | ratio | Note |
|---|
HUD text is measured against its scrim; bars are measured as UI components against their track.