refactor(design): design-review, design-consultation, design-shotgun, plan-design-review, design-html drive Aside

Design-system extraction is one script printing FONTS/COLORS/HEADINGS/TOUCH_TARGETS/NAV; competitor research confirms the exact URLs before opening them in the real browser and runs on the bundled browser when Aside is absent; design-html's viewport screenshots, sketches and comparison boards render through gstack-render.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
This commit is contained in:
Sina
2026-09-05 16:48:37 -04:00
co-authored by Claude Fable 5.1
parent 181f9d863b
commit 27e38cbeec
7 changed files with 282 additions and 129 deletions
+16 -5
View File
@@ -132,9 +132,11 @@ design-shotgun will follow your lead, but won't diverge by default."
curl -s -o /dev/null -w "%{http_code}" http://localhost:3000 2>/dev/null || echo "NO_LOCAL_SITE"
```
If a local site is running AND the user referenced a URL or said something like "I don't
like how this looks," screenshot the current page and use `$D evolve` instead of
`$D variants` to generate improvement variants from the existing design.
If the user referenced a URL or said something like "I don't like how this looks,"
screenshot that page with Aside in Step 3c and use `$D evolve` instead of `$D variants`
to generate improvement variants from the existing design. If they didn't name the URL,
ask for it — never guess which page they mean. If the probe above printed `200`, offer
`http://localhost:3000` as the default in the AskUserQuestion below (still ask — never assume).
**AskUserQuestion with pre-filled context:** Pre-fill what you inferred from the codebase,
DESIGN.md, and office-hours output. Then ask for what's missing. Frame as ONE question
@@ -232,12 +234,21 @@ If D: drop specified concepts, re-present, re-confirm.
### Step 3c: Parallel Generation
**If evolving from a screenshot** (user said "I don't like THIS"), take ONE screenshot
first:
of the page the user named, in Aside (PNG — `$D evolve` reads PNG):
```bash
$B screenshot "$_DESIGN_DIR/current.png"
aside repl '
const pg = await openTab("<url>");
await pg.screenshot({ path: "current.png", type: "png", fullPage: true });
console.log("ASIDE_DIR=" + pwd);
await closeTab(pg);
console.log("GSTACK_STEP_OK");
'
```
Then `cp "<ASIDE_DIR>/current.png" "$_DESIGN_DIR/current.png"` and Read it so the user
sees what you're evolving from.
**Launch N Agent subagents in a single message** (parallel execution). Use the Agent
tool with `subagent_type: "general-purpose"` and `run_in_background: false` for each
variant (parallel foreground calls in one message still run concurrently; subagents