59 lines
6.2 KiB
Markdown
59 lines
6.2 KiB
Markdown
# M2 UI Gallery Delta Matrix
|
|
|
|
> **Evidence record — not current product guidance.** Use the [documentation index](../../../README.md)
|
|
> for current guidance. The canonical visual contract is the [Editor Design System](../../design-system.md),
|
|
> with architecture in [ADR 0049](../../../adr/0049-penpot-led-editor-visual-system.md).
|
|
|
|
This matrix distinguishes correctable production drift from deliberate differences between an
|
|
authored Penpot mock and a truthful interactive editor. The direct PNG is the visual reference;
|
|
the SVG is used to inspect numeric child geometry because it does not embed Source Sans Pro.
|
|
|
|
| Area | Penpot reference | Production/gallery truth | Classification | Evidence/state |
|
|
|------|------------------|--------------------------|----------------|----------------|
|
|
| Materials canvases | 620 x 539 and 420 x 735 | Exact presets render the shared `editor_ui` components | Required match | Geometry/unit tests pass; fresh paired gallery captures and full-editor primitive captures at 620/420 pass |
|
|
| Renderer canvases | 760 x 1233 and 480 x 828 | Exact gallery presets use shared renderer/component chrome | Required match | Fresh paired gallery captures cover both widths; the rebuilt full editor now has managed static-renderer captures at 760/480 |
|
|
| Renderer hierarchy | 50 px component header, 40 px array header, 84/60 px entry headers, 38 px properties heading, and 50 px indexed-material heading | The gallery and full editor call the same `editor_ui::renderer` view-model/chrome functions | Resolved structural drift | Focused checks pass and the fresh full-editor static renderer shows the same hierarchy without the former duplicate slot presentation |
|
|
| Renderer slot states | Full primary slot, compact secondary slot, explicit unassigned drop target, and collapsed sibling renderers | The shared material panel supports a full header with collapsed parameters and a first-class empty thumbnail/Choose Material action | Resolved structural drift | Fresh 760/480 gallery pairs show all states without gallery-only material cards |
|
|
| Scalar geometry | 6 px inset, 93.8/160.3 px track, 6 px gap, 33 px number | Same exported child coordinates at 620/420 | Resolved drift | Focused tests and 620 overlay pass |
|
|
| Scalar sample value | Text reads `0.72`; thumb is positioned near 0.55 | Thumb position is computed from the displayed/runtime value | Intentional semantic delta | Keep truthful 0.72 normalization |
|
|
| ORM channels | ORM selected while AO, Roughness, and Metallic sample glyphs all read G | Canonical ORM is AO=R, Roughness=G, Metallic=B | Intentional semantic delta | Runtime/schema invariant and fixture test |
|
|
| Material preview | Authored static sample sphere | Gallery uses a deterministic fixture approximation; full editor uses the real typed thumbnail | Intentional content delta | Full-editor thumbnail was observed pending and then resolved in place without layout movement |
|
|
| Texture identity | Mock fields use generic/synthetic asset art | Ready project textures show their typed thumbnail without a redundant generic icon | Intentional product delta | Texture-field test passes |
|
|
| Borders/rasterization | Browser-rendered SVG strokes can antialias across pixel boundaries | egui uses deterministic inside strokes | Renderer-level delta | Do not alter semantic colors or geometry to mimic browser antialiasing |
|
|
| Typography | Direct PNG preserves Source Sans Pro | Production bundles Source Sans Pro Regular/Bold and maps explicit 400/700 families | Required match | Font/type-role tests and fresh gallery/full-editor captures pass |
|
|
| Difference metric | Raw per-pixel comparison includes all sample and raster deltas | Latest Materials 620 diagnostic: mean 7.41, max 231, 22.8% of pixels above 8 | Diagnostic only | Must be interpreted through this matrix, never used alone for acceptance |
|
|
| Runtime reload | Not applicable to the design mock | Theme and material fixture JSON reload without rebuild/restart | Framework requirement | Focused reload tests pass |
|
|
| Rebuild/restart | Not applicable to the design mock | Focused managed build reports bounded progress; replacement launches before last-good exits; failures preserve last-good | Framework requirement | Eight workflow tests pass |
|
|
|
|
## Remaining acceptance
|
|
|
|
- Primitive Materials pass full-editor 620/420 and deep-scroll containment. The rebuilt static
|
|
renderer passes the native 760/480 hierarchy and containment check. The current checked-in scene
|
|
has no placed skinned actor, so skinned presentation remains proven through the shared production
|
|
component, renderer gallery fixture, focused tests, and editor compile rather than a separate
|
|
native actor capture.
|
|
- The broad `penpot-material-inspector` scenario intentionally remains incomplete because picker,
|
|
color, invalid-drop, dirty/save/relaunch, and broken-reference assertions are outside this gallery
|
|
framework boundary. Its fixture was restored byte-for-byte after the two managed integration
|
|
captures.
|
|
- Attach the paired reference/native evidence to #68 at the next authorized tracker synchronization.
|
|
Keep #68, #59, #65, and M2 in Acceptance-in-progress; this framework slice is evidence for the
|
|
next visual pass, not permission to publish or close the milestone.
|
|
|
|
## Fresh local evidence — 2026-07-18 10:20 UTC
|
|
|
|
- Materials 620: `ui-gallery-materials-620-20260718T102015Z.png`
|
|
(`cc918c567522204f9dc8d8f179e24e49ba802fe03a81d3a65fa1e5b6058623c9`)
|
|
- Materials 420: `ui-gallery-materials-420-20260718T102015Z.png`
|
|
(`70dea081df62ab38d589ea559d73a6e8d3685f26fee54dbc87cc8682ebed8474`)
|
|
- Renderer 760: `ui-gallery-renderer-760-20260718T102015Z.png`
|
|
(`724d9cedf25753de9315993f9e6ea656949f54e5b54c44f1f8ab46f1db88b0d6`)
|
|
- Renderer 480: `ui-gallery-renderer-480-20260718T102015Z.png`
|
|
(`f90c3f72b757649f5c11362ed6d776e5e85288751ffd74f08f8cc386f162fc4f`)
|
|
- Full-editor primitive Inspector 620, 420, and deep-scroll captures are recorded under the same
|
|
local `.codex/evidence/` store with timestamp `20260718T095413Z`.
|
|
- Full-editor static renderer 480: `penpot-material-inspector-20260718T104504Z.png`
|
|
(`3c5c6585822afffa6c29994aa757adf645c81d653e369e059bbee08c26c1aa26`)
|
|
- Full-editor static renderer 760: `penpot-material-inspector-20260718T104550Z.png`
|
|
(`95ef7366d1671ac494cb5fd389d3332d51a0d5636cd0a02f66e9faf0399eb82f`)
|