docs(product): system-wide visual design language (S0-DS kit + S14 panel refresh)

LICE verified sufficient from vendored WDL — current editor draws at its
floor (flat fills, raw GDI text); no framework shift needed, D-A holds.
Adds design-language doc (palette, three directions, motion policy),
S0-DS shared drawing kit before S10, S14 panel refresh.
This commit is contained in:
2026-07-26 19:16:58 -04:00
parent 8c9cf38780
commit 3d6c0ab66a
3 changed files with 184 additions and 3 deletions
+88 -2
View File
@@ -383,6 +383,42 @@ alongside S8.
stale value by design — it reloads on the *next* poll; confirm no torn-read hazard for the
single integer generation key).
## S0-DS — shared LICE drawing kit (design-system foundation; BEFORE S10)
**Goal:** A shared **LICE-based design kit** — palette + type + component-draw layer — that
both the ReaSampler 9000 VST editor and the extension's bank panel draw through, replacing
the current flat `LICE_FillRect` + raw-GDI-`DrawTextA` "temple os" drawing with a modern dark
look (gradient surfaces via `LICE_GradRect`, anti-aliased rounded controls via `LICE_RoundRect`/
`LICE_Line`, cached anti-aliased text via `LICE_CachedFont`, hover/pressed/drag interaction
states). **Sequenced before S10** so the keyboard-strip editor is *born* in the new language,
not restyled after. No new dependency — LICE (already the draw surface) is the toolkit; vwnd's
drawing craft is cribbed, not its object model (fork DS-1 settled A). Product framing +
palette + the three visual directions + all three forks: `docs/product/visual-design-language.md`.
CONTEXT.md §Phase S (design-system foundation). **Verify LICE gradient/AA/font surfaces and the
`LICE_CachedFont``HFONT` lifecycle against `vendor/WDL/WDL/lice/lice.h` + `lice_text.h` before
use** (surfaces verified present in the design-language doc; confirm signatures at build).
**Depends on:** S1 (the `IPlugView`↔LICE editor surface the kit draws into) + the existing
`bank_panel` LICE surface. Blocks S10 and S14.
- [ ] Pure `theme`/palette layer: role→color mapping (`bg/base`, `bg/panel`, `bg/cell`,
`text/primary`, `text/dim`, `accent`, `accent/hot`, `warn`) selected via **one direction
constants block** (DS-2), so the visual direction is a single-file change. Unit-test that
each text-on-surface pair clears its WCAG floor (AA 4.5:1 body / 3:1 large + state
indicators) — the "punch to the floor, not past it" rule made testable. No LICE/host types.
- [ ] Pure component **geometry/hit-test** helpers where not already owned: button rect,
slider track/handle geometry, list-row rect + hover hit-test (mirror of
`mode_switch`/`embed_strip`/`editor_geometry` — no LICE, no host types, CTest-covered).
- [ ] Shell **draw kit** (LICE): `fillSurface` (micro-gradient + 1px inner highlight/shadow —
the vwnd trick that kills the flat look), `drawButton`/`drawSlider`/`drawListRow`/
`drawWaveform`/segmented-switch draw, and a shared `text()` over a cached `LICE_CachedFont`
set (title/label/value-mono/micro). Owns the cached-font lifecycle. Honors the interaction
state model (rest/hover/active/pressed/dragging/focus/disabled). Double-buffered draw
discipline preserved (draw to `LICE_SysBitmap`, single `BitBlt`) — the "zero-jank" half of
"speed is the selling point."
- [ ] Retire the raw GDI `DrawTextA` path in the VST editor's `drawText`/`drawTextCentered`
and the bank panel's GDI text in favor of the kit's cached-font `text()` — the single
biggest "temple os → modern" lever. (This is the drawing-substrate change; the surfaces it
serves land in S10S14.)
## S10 — direct-manipulation keymap editor ("ReaSampler 9000" UX overhaul, part 1)
**Goal:** Replace the ±1 nudge-button zone editor with a **piano-keyboard-strip zone
editor** where the keymap is edited by direct manipulation: a horizontal keyboard span
@@ -402,8 +438,11 @@ next held note); overlapping zones render legibly and resolve first-match as bef
zone add/select/delete still work; the pure geometry module is CTest-green (edge-grab
regions, body-drag delta, key→note mapping, root hit-test) with no host types at its
boundary; the ±1 nudge-button row is gone.
**Depends on:** S5 (the `PerformanceMap`/zone model it edits), S1 (the LICE `IPlugView`
drag/event routing — extends the click-only `wndProc` to `WM_MOUSEMOVE`/`WM_LBUTTONUP`).
**Depends on:** S0-DS (the shared drawing kit — the strip/zone bars are drawn in the kit's
new language, and the drag machine's `WM_MOUSEMOVE` tracking also lights the kit's **hover**
states at near-zero marginal cost), S5 (the `PerformanceMap`/zone model it edits), S1 (the
LICE `IPlugView` drag/event routing — extends the click-only `wndProc` to
`WM_MOUSEMOVE`/`WM_LBUTTONUP`).
- [ ] Pure `keyboard_strip` geometry module: map a MIDI key span across a strip width
(128 keys → pixels, reusing the S6 `embed_strip` key-span idiom); per-zone bar rect from
@@ -527,6 +566,53 @@ the relay is proven.**
"drop files on the ReaSampler panel to add" affordance rather than silently swallowing the
drop — the shipped ingest gesture stays discoverable either way.
## S14 — dock-panel refresh (extension-side; applies the S0-DS kit to the bank panel)
**Goal:** Bring the extension's docked `bank_panel` up to the new design language by
**applying the S0-DS kit** — it is "not terrible" already (thumbnails, selection, focus ring,
LICE grid), so this is a re-skin, not a redesign: route its text through the shared
`LICE_CachedFont` (retiring its GDI text), re-draw buttons / tab strip / segmented mode-switch
/ full-height toggles through the kit's `drawButton`/segment draw, adopt the palette roles +
micro-gradient surfaces, and add **hover** to tabs and rows. Structure stays; only the drawing
upgrades (fork DS-3 settled: light/kit-application only). CONTEXT.md §Phase S (dock-panel
refresh). **Depends on:** S0-DS (the kit). Extension-side and **independent of the VST
S10S13 chain** — can land any time after the kit, in parallel with the VST overhaul.
- [ ] Route all `bank_panel` text through the S0-DS cached-font `text()`; retire the GDI
`DrawText` path in the panel.
- [ ] Re-draw the panel's buttons, the named-banks tab strip, the Design View segmented
mode-switch, and the pool/banks full-height toggles through the kit's component draws
(gradient fills, rounded, inner highlight); adopt the palette roles + micro-gradient
surfaces. Hit-test geometry unchanged (`bank_grid`/`tab_strip`/`mode_switch` stay the pure
source of truth) — this touches draw only.
- [ ] Add **hover** state to tab strip and grid rows/cells (the panel's `wndProc` already
runs a timer; add `WM_MOUSEMOVE` hover tracking). No structural/layout change — the
vertical-split, tab, and grid layout are untouched (fork DS-3).
## Phase S — design-system forks (Daniel's calls)
Framing + full analysis: `docs/product/visual-design-language.md` §6. Two of three carry a
strong product-designer lean; DS-2 is deliberately low-cost-to-reverse.
- **Fork DS-1 — toolkit.** (A) **LICE drawing kit** (recommended — no new dependency,
consistent with settled D-A; crib vwnd's drawing craft, not its object model); (B)
**vwnd-based** retained-mode controls (not recommended — moves hit-test geometry into
untestable shell, pulls in image-skin assets; narrow exception: vwnd's *listbox* for the
S12 scroll list only, a build-time residual); (C) **iPlug2 / JUCE shift** (reject — re-opens
settled D-A to solve a look problem that is not a toolkit-ceiling problem; REAPER's own
themed UI is LICE). **Lean: A.** This fork exists mainly to let Daniel rule *against* the
LICE kit if he wants a framework anyway.
- **Fork DS-2 — visual direction.** (A) **Studio Rack** (evolutionary green-on-charcoal, done
properly); (B) **Neon Console** (near-black + one vivid accent, modern soft-synth idiom); (C)
**Spectral** (bold — hue-mapped zone/waveform gradients + glow, turns the multi-zone-in-one-
instance advantage into a visual signature). **Lean: B default + C's spectral keyboard
strip.** Because the kit palette is abstract (roles, one constants block), this fork is
**reversible for ~one file** — pick a *starting* direction, not a permanent one.
- **Fork DS-3 — panel refresh scope.** (a) **Light** — apply the kit (fonts/buttons/palette/
hover), keep the structure (S14 as specced); (b) **Structural** — also rework the
vertical-split / tab-strip / grid layout. **Lean: (a) light** — the panel's structure is
sound; a structural rework is scope Daniel didn't ask for and risks destabilizing landed
Phase-B panel work. (b) available later if the panel's *layout* starts to feel dated once
the VST is sharp.
## Phase S — product name (ReaSampler 9000)
The MIDI-playback instrument's product name is **ReaSampler 9000** (Daniel, 2026-07-26,
on DAW-testing the S1S6 instrument). The extension remains **ReaSampler**; the instrument