diff --git a/decisions/0001-paleta-complementaria.md b/decisions/0001-paleta-complementaria.md new file mode 100644 index 0000000..fad69d6 --- /dev/null +++ b/decisions/0001-paleta-complementaria.md @@ -0,0 +1,53 @@ +# ADR-0001 · Complementary palette over classic LCARS + +**Status**: accepted +**Date**: 2026-05 +**Decision-makers**: design + product + +## Context + +Early UI sketches used classic LCARS palette (orange/peach/yellow on black). The aesthetic worked for demonstrating the visual language but had two practical problems: + +1. **Brand collision** — Blocao's logo and brand mark are lime green (`#9FCB3A`). Orange-dominant LCARS placed the brand in the same warm-color family, diluting it visually. +2. **Domain semantics** — orange traditionally means "warning" in industrial UI. Using orange as the dominant neutral color made every screen feel mildly alarming and made it impossible to use orange for actual warnings. + +## Decision + +Adopt a **complementary palette** rotated ~180° from classic LCARS. Cyan-dominant instead of orange-dominant. + +Token palette (final): + +``` +--ink: #66CCFF /* primary navigation, dominant */ +--cam: #6699FF /* cameras / VLAN-10 */ +--hai: #CC99CC /* compute / VLAN-20 (mauve) */ +--iot: #99CC99 /* health / OK states (green) */ +--mgmt: #CCCC99 /* management / VLAN-30 (olive) */ +--wan: #66CCCC /* WAN / external (turquoise) */ +--warn: #99FFFF /* warnings (bright cyan) */ +--brand: #9FCB3A /* Blocao green — logo and brand only */ +``` + +The brand green is **isolated** from semantic UI. It only appears for logo, brand chip in the status strip, and explicit brand moments. UI states never reuse brand color. + +## Consequences + +**Good**: +- Brand green stands out against cyan-dominant chrome. +- Warnings can use bright cyan (`--warn`) which contrasts against the cyan-blue chrome without being confused with normal text. +- The palette feels distinctive without losing LCARS character. + +**Bad / trade-offs**: +- Less immediately recognizable as "LCARS" to Star Trek fans. +- Some viewers in the early demos commented "feels like a different visual language" — that's actually intended but worth noting. + +## Alternatives considered + +- **Pure classic LCARS**: rejected for reasons above. +- **Custom palette unrelated to LCARS**: would lose the visual hook that makes Blocao memorable. +- **Brand-color-as-dominant** (lime green everywhere): too aggressive, reduces accessibility on dark backgrounds, exhausts the eye. + +## See also + +- `mockups/palette-comparison.html` — interactive toggle between classic and complementary. +- `docs/03-design/design-tokens.md` — the full token table.