Blacksite/docs/editor/evaluations/content-workspace-m2/ui-gallery-delta-matrix.md

M2 UI Gallery Delta Matrix

Evidence record — not current product guidance. Use the documentation index for current guidance. The canonical visual contract is the Editor Design System, with architecture in ADR 0049.

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)