Design and verification notes
Single-page viewer change — 12 October 2026
The root now contains all 19 published review studies in one live viewer; earlier websites remain on their unchanged origins. All 19 rendered headings and eight actual window/format samples were checked locally. Keyboard switching, Daylight service interaction, flagship palette forwarding, phone selection, restart, reload persistence, state-preserving resizing and price-fragment scrolling pass. Viewer CSS loads in the initial stylesheet. No new runtime dependency. Published results are recorded in DELIVERY.md; the detailed viewer scope and any observed logs are in VIEWER.md. The prior site audit below remains the dated card-scene audit, not a new performance or comprehensive accessibility certification.
Two new complete directions, Relay and Wide Angle, have been built in a separate collection. Daylight Practice links to its existing review. The previous sources and hosting projects remain preserved. These are design reviews, with draft marketing copy and the same confirmed services, project examples, starting-price figures and discovery-call destination. No final production direction is inferred.
Eight-point quality audit
| Criterion | Rating | Observed evidence and limits |
|---|---|---|
| 01. Point of view | Strong | Relay uses centred opening type and a changing three-card composition; Wide Angle uses left-aligned opening type, a large scene stage and contrasting full-width sections. Portfolio structure and phone reading order also differ. This is design judgement, not measured conversion evidence. |
| 02. Typography | Strong | Manrope / DM Sans and Outfit / Onest perform different display/body roles. Actual desktop/phone render checks show the intended families and responsive scale. Self-hosted, licensed variable WOFF2 fonts and critical preloads are present. |
| 03. Colour system | Strong | Each direction uses five core colours consistently, with white/alpha neutral surfaces and accessible controls. Sampled actual own-text/background pairs pass AA thresholds at all twelve tested widths/states. The scanner avoids counting parent containers whose text is styled by a child. Image/composited/transient-effect contrast is outside that scanner's scope. |
| 04. Hierarchy | Strong | An expanded focal service card, asymmetric project stories, comparable price cards and substantial questions provide different proportions in Relay. Wide Angle changes between dark opening/work scenes and broad light context/pricing scenes. Each starts with the offer before showing completed work. |
| 05. Intentional imagery | Strong | Only approved logo assets and confirmed JobPass/YLX website captures are used. Screenshots are project websites, not fabricated customer proof or invented analytics. Native dialogs allow closer inspection with Escape dismissal and returned focus. No generic AI artwork is added. |
| 06. Purposeful motion | Strong | Actual intermediate frames observe Relay card widths changing through 475/443 to 590/328px and Wide Angle's incoming/outgoing content transforms/opacity. Service changes, joined/separate enquiry comparison, work selection and measured question panels answer a visitor action. CSS opening masks and finite coordinated viewport scenes provide composition cut-ins. No perpetual loop, replay strip, custom cursor, horizontal gesture requirement or scroll hijack. The Braz Ai benchmark is a video presentation; equivalent reference code, timings and production performance were not available. |
| 07. Dedicated mobile | Strong | Six widths per direction: 320, 390, 768, 1024, 1440 and 1920px. Service cards stack and expand vertically; Wide Angle's service stage follows the opening, and its project image precedes details. Menu links close the contents disclosure and land pricing about 24px below the viewport top. Touch-size controls remain, with the header booking action moved into the menu at the narrowest width and the main booking action retained. These are browser viewport tests, not physical touch-device tests. |
| 08. Invisible quality | Mixed | TypeScript and production prerender build pass. Scoped overflow/image/fragment/duplicate-ID/solid-colour text checks pass across twelve local samples; keyboard card selection, tabs, image dialog and questions were exercised. Local Lighthouse simulated mobile scores are 99/99 performance and 100/100 automated accessibility, CLS 0 and TBT 0ms. LCP is 2.145/2.107s, so the strict sub-two-second target remains unmet. Titles, descriptions, canonical/social metadata, font licences, noindex review headers and a custom 404 are present. These are local lab paint metrics; full-page load, field performance and comprehensive WCAG/screen-reader certification remain unverified. |
Interaction and motion checks
Relay: service expansion and rapid selection, keyboard Enter, joined/separate enquiry comparison, native JobPass screenshot inspection, Escape dismissal/focus return and question selection. Wide Angle: service End-key selection focuses Bespoke solutions; project selection changes to YLX, its screenshot opens and closes with focus return. Phone menu price navigation and automatic closure pass for both sites. Dynamic buttons stay disabled in prerendered HTML until React is ready, preventing a click from silently disappearing before hydration. Arrival effects skip containers with controls; project images and copy animate inside stable hit areas. A pointer check of the arriving enquiry comparison verified the fix. Native navigation/booking links remain available.
Explicit ?motion=reduce samples show immediate static content and zero remaining projection transforms on service changes. Source respects the operating system's prefers-reduced-motion setting; an actual OS preference change was not performed. The twelve gallery previews show settled compositions; separate intermediate-frame evidence records live changes. No promise of a measured frame rate is made.
The original gallery preview images remain local handover assets. The current interactive viewer loads earlier complete websites from their existing public review origins, while Relay and Wide Angle use the current origin. Only one active website loads at a time.
Publication and preserved work
The new review origin is https://sainova-card-scenes-review.pages.dev/. HOSTING.json and DELIVERY.md record deployment and published verification. Six public site/gallery samples and 41 served-file hashes plus the real custom 404 pass. All four preceding deployment identities remain unchanged. Earlier collections are not deployed over. The protected-file baseline contains 2,432 existing source/reference/build artifacts; the current preservation check finds none changed or missing.
Remaining limits
The strict two-second mobile LCP target needs another performance pass if this becomes the production direction. Physical phones, separate Safari/Firefox website testing, OS preference switching, complete screen-reader testing and actual Calendly booking/CRM submission were not performed. The booking links use the confirmed destination; no real booking was submitted. Reference timings were observed from video, not measured from a working reference implementation. Commercial package inclusions, tax treatment and final copy/brand approval remain outside this design review.