← ClaudeAtlas

hyperbuild-8-5-visual-qalisted

Step 8.5 of the hyperbuild pipeline — VISUAL QA of the rendered mockups, the first and only point where anything LOOKS at the pixels the user will judge. Spawns 3 hb-design-critic agents in parallel (one per design direction); each VIEWS every rendered screenshot for its direction (the Read tool renders PNGs) against docs/DESIGN-CRAFT.md §4 (layout integrity) and that direction's own design-system.md (craft), and files runs/<run_tag>/gates/visual-qa-<letter>.json — findings carrying screen, severity, category, what_is_wrong, fix_instruction. The orchestrator ranks the findings, re-spawns the responsible hb-mockup-smith in PATCH MODE (edit the existing mockup HTML, never rewrite), re-renders the patched screenshots, and re-runs the critic ONCE over the affected screens. MAX 2 rounds — remaining criticals are recorded as known issues, never looped on. Step 12 checks these files and prints unresolved criticals to the user. Invoked by the hyperbuild router via Skill(); not run directly by users.
zakariaf/hyperbuild · ★ 0 · Web & Frontend · score 72
Install: claude install-skill zakariaf/hyperbuild
# Step 8.5 — Visual QA (parallel, 3 design critics + 1 patch round) You are executing step 8.5 (visual-qa) of the hyperbuild pipeline. Step 8 built every mockup and rendered one PNG per screen × 3 designs; step 9 (skill research) is step 8's concurrent pair member and may still be running — you share no inputs with it. Step 12 shows the user the gallery those mockups feed. **Until this step, nothing in the pipeline has ever LOOKED at a rendered pixel** — mockups were validated by four greps (existence, "lorem", external URLs, art-direction cards), so a FAB parked on a list row, a CTA sliced by the bezel, and a design that trips a banned cliché all reach the human checkpoint unseen. That is the defect class this step exists to kill. **Goal:** for EACH design letter a, b, c — `runs/<run_tag>/gates/visual-qa-<letter>.json`, written by an agent that actually viewed every rendered screenshot for that direction, with every critical finding either FIXED in the mockup HTML and re-rendered, or honestly recorded as a known issue that step 12 prints to the user. **Gear gate:** runs identically for both gears — every rendered screen is reviewed regardless of gear. Findings cap per direction: **24 (standard) / 40 (premier)**, max 8 per screen. Rounds: **2 maximum, both gears.** **⚠ CRITICAL ANTI-PATTERN: reviewing the HTML instead of the image.** A critic that greps `padding-bottom` and declares the FAB safe has done nothing — the first run's mockups all *specified* correct spacing an