Jose Luis Montañes 8f61a8324c docs: design system spec for the studio hardware emulation
Captures every decision made during the studio.html sandbox iteration
so the same visual language can be applied to the rest of the app
(and to new components later) without re-deriving it.

Sections:
- Vision + reference instruments
- Lighting model (single rule: light from above)
- Color tokens with semantic naming
- The 3-layer "metal" language as shared CSS custom properties
- Surface hierarchy (3 depth layers with progressively brighter bases)
- Component anatomies: rack, bars, screen, sub-panels, knobs, faders,
  step LEDs, buttons, screws, engraved labels, numeric displays
- Typography, spacing scale, interaction conventions
- "What is intentionally NOT here" — rejected ideas to keep the
  language disciplined
- A "how to add a new component" checklist

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-01 18:28:47 +02:00
Description
Pseudocode-driven modular synth that runs in the browser. Studio hardware emulation aesthetic.
228 KiB
Languages
HTML 66.8%
JavaScript 16.9%
Python 16%
Dockerfile 0.3%