Source
Name the authority
Record the system version, application template, and artifact used as the visual reference.
10 / Reference
Standards.
The artifact is not done when it looks right. It is done when the intended meaning survives the smallest view, the still frame, the keyboard path, and the published file.
- Access
- WCAG AA
- Web views
- 1440 / 1024 / 768 / 390 / 320
- Film views
- 1920 / 960 / 640
- Network
- Local assets
10.1 / Web release
Visual quality and technical integrity are one gate.
Automated checks catch structural failure. Human review determines whether the composition communicates clearly and still feels like the system.
- Semantic HTML and valid referencesRequired
- WCAG AA contrast in dark, light, paper, and carbon fieldsRequired
- Keyboard-visible focus and stable focus after state changesRequired
- No horizontal overflow or clipped controls at 320–1440pxRequired
- Reduced-motion preference removes non-essential entrance behaviorRequired
- Fonts and page assets load locally with no runtime CDN dependencyRequired
- No console errors, broken links, or missing media alternativesRequired
- Desktop and mobile screenshots inspected after fonts settleRequired
10.2 / Responsive
Every breakpoint has a compositional purpose.
Mobile is not a scaled desktop. When topology changes, reading order, marginal labels, and system diagrams are deliberately recomposed.
| Viewport | Inspection | Failure conditions |
|---|---|---|
| 1440 × 1000 | Canonical desktop composition, 80px gutters, 12 columns. | Reduced hierarchy, weak negative space, incorrect type wrap. |
| 1024 × 768 | Tablet/desktop boundary and system-index behavior. | Navigation collision, narrow proof field, oversized monument. |
| 768 × 1024 | Tablet gutter and two-to-one column transitions. | Premature squeeze or inconsistent section order. |
| 390 × 844 | Canonical mobile composition and typography. | Clipping, horizontal scroll, miniature desktop topology. |
| 320 × 700 | Personal-site safety floor. | Unreachable controls, broken words, hidden state. |
| 640 × 360 | Player-scale film comprehension. | Tiny labels, ambiguous diagram, missing semantic proof. |
10.3 / Film release
The published MP4 is a compiled artifact.
Source, narration, timing, geometry, render, audio, and release proof remain bound. A visually similar export is not the same artifact.
- Frame zero is complete, non-black, and inspected as the posterEditorial
- Every scene visual communicates its claim with narration mutedSemantic
- Independent nodes, ledgers, legends, and callouts pass collision checksGeometry
- Diagram ports, connectors, insets, alignments, and equal gaps validateGeometry
- Start, quarter, midpoint, three-quarter, and end frames inspected per sceneMotion
- Opening settle, stable hold, pre-speech, and first-word frames reviewedMotion
- 1920×1080 master remains readable at 960×540 and 640×360Visual
- H.264/yuv420p, 30fps, AAC 48kHz, faststart, captions, exact audio identityMedia
- Final frame resolves meaning and holds through the audio tailEditorial
10.4 / Privacy + provenance
Design fidelity never overrides the content boundary.
A public system site may document the grammar of a protected briefing without copying its source material, recipient data, or licensed identity assets.
Content
Use synthetic specimens
Do not paste sensitive project copy into a public design-system demo.
Identity
Respect the brand boundary
Borrow rules and reusable fonts; do not transplant another entity’s wordmark.
Secrets
Keep runtime clean
No credentials, tokens, local file paths, unpublished links, or environment data in the artifact.
10.5 / Definition of done
Passes are reported. Judgment is recorded.
The release note should name what was tested, what was visually inspected, what source governed the design, and where the artifact is live.
- 01
Source is current
The canonical Ontology contract and latest approved production application were inspected before design decisions were locked.
- 02
Implementation is exact
Fonts, weights, token values, breakpoints, local assets, and theme behavior match the declared contract.
- 03
Interaction is real
Theme, index, motion controls, focus, and state announcements work with mouse and keyboard.
- 04
Visual review is independent
A second reviewer inspects hierarchy, responsive composition, accessibility, and drift against the source.
- 05
Publication is verified
The live URL is fetched and inspected after deployment; a successful build alone is insufficient.