# Three design loops — fixed review contract

Scope: a draft /branding library, posting templates, graphic elements and browser motion source. Main product/site surfaces are out of scope. Start: origin/main 360791b8 (merged social review #8).

Baseline: six static HTML concept cards at /social-review/2026-10-28/, without an editable production template system, asset downloads or motion modules.

Exactly three bounded passes:
1. Brand language and library: retain supplied identity, build distinct editorial layouts and original vector elements; inspect actual desktop/mobile rendering.
2. Posting workflow: editable copy, four output dimensions, safe areas, SVG/PNG export, captions; test actual downloads and edge cases; fix observed problems.
3. Motion and complete pack: reusable controllable browser compositions, layered SVG/source pack, timing/reduced-motion, and complete regression review.

Frozen evaluation scenarios: recognisable real logo/fonts/palette; find and download a brand asset; choose/edit a template; switch all four formats; correct SVG/PNG dimensions; long copy stays within artboard or blocks export with useful feedback; source/status survive export; elements have named vector groups; play/pause/replay/scrub works; reduced motion remains readable; keyboard controls and 390/320px views remain usable; pack rebuild is deterministic and portable.

Evidence: ~/data-exports/playstat/branding-library-2026-10-28/. Save each loop's screenshot, observed findings and changes below. Automated checks establish function, not aesthetic quality or audience performance. These are single-agent design/verification passes; Elvin retains final visual approval. No independent reviewer or reach improvement is claimed.

## Pass records
### Loop 1 — visual foundation
Observed on desktop and 390px: eight distinct covers and eight original elements. Initial browser review found unreadable dark-on-navy wordmark, an unnecessary P/S pseudo-mark, and three malformed SVG primitives (duplicate stroke-width). Corrected with white logo plates, the supplied original icon, and valid SVG attributes. Mobile DOM check: 390px scroll width at 390px; all images loaded. Evidence: loop-1-desktop.jpg, loop-1-templates.jpg capture initial findings; loop-1-mobile.jpg captures repaired state. Editable controls and motion intentionally follow in loops 2/3.

### Loop 2 — editable production templates
Added inline copy editing, four dimensions (32 combinations), embedded-font SVG and full-size PNG export, source/status/CTA fields, safe guides, per-family caption/alt/check copy, and a five-slide arithmetic carousel. Reflowed the artwork area per aspect ratio to preserve text space. Actual browser PNG/SVG downloads verified at 1080×1080; edited headline retained, fonts/logo embedded, guide excluded. Long-copy guard disabled both exports with actionable feedback. All 32 default variants rendered with no text outside the artboard; all generated SVGs parse. Added actual font-metric safe-area validation to catch wide-letter edge cases beyond character limits. Evidence: loop-2-editor.jpg, loop-2-format-checks.json and downloaded sample files. Motion and complete portable bundle remain for loop 3.

### Loop 3 — motion and portable pack
Added six controllable motion compositions, a standalone source player, timeline scrubbing, reduced-motion hold frames, current-frame SVG download and the complete portable ZIP. Added real browser-exported portrait PNGs for all eight families and five carousel slides, with unique carousel filenames. Corrected embedded Poppins weight to 600 to avoid synthetic bold, then refreshed all 13 PNGs. The library keeps the supplied raster identity unchanged; its limited resolution is documented.

Observed: Play/replay advanced the timeline; pause stopped it; keyboard scrubbing selected 0 / 500 / 1800ms. All six reduced-motion previews remained at a readable 1.8s after replay. Motion state SVG downloaded. All 32 final layouts passed actual-font safe-area validation. Final 390px and 320px layouts had matching document/viewport widths, all images loaded and no console warnings/errors. A real story PNG measured 1080×1920 and landscape SVG 1600×900. Captured full motion frames in motion-final-*.jpg; earlier cropped experiments are diagnostic only and are not acceptance screenshots.

Automated: five focused tests pass, including malicious-copy escaping, copy guards, all output dimensions, vector XML, deterministic independent rebuilds and embedded assets. Existing project tests: 295 Python tests passed; dashboard Node checks passed. These are local results, not CI. No video was rendered, no physical phone/GPU benchmark or external design-app import was tested, and no audience uplift is established.

Portable ZIP and final evidence are checked in the task delivery receipt. Status: exactly three passes completed; candidate awaits Elvin’s visual approval. No fourth design loop, live-site change, merge, deployment or publication is included.