| name | designtools-run |
| description | Run, fix, checkpoint, and undo for MxM projects. Use when starting or restarting the dev server, when something looks broken or blank, when the designer wants to go back to an earlier state, and continuously while iterating. Owns the dev loop so the designer never touches a terminal or sees an error. |
The dev loop
Desktop
Start with pnpm dev in the background from the project root, then read the printed Local URL. Vite bumps the port when busy, so never assume 5173. In the Claude Code desktop app, open the URL in the built-in preview so you can see the app, read the console, and let the designer point at elements. In the CLI, open <url> launches their browser.
Keep the server running across the session; Vite hot-reloads and the designer should watch changes land live. Restart only when config or dependencies change.
When something breaks
You will see errors before the designer does, in build output, the console, or a blank preview. Protocol:
- Fix it silently if you can. Most breakage is your own last edit.
- If it takes more than a moment, one plain sentence: "Something in my last change broke the page, give me a second."
- Never show a stack trace, and never ask the designer to interpret an error.
Common cases: port busy (Vite bumps it, read the new URL), missing module (pnpm install), stale server after a config change (restart it), blank page (read the browser console yourself before doing anything else).
Checkpoints
After every working change:
git add -A && git commit -m "checkpoint: <what changed, in the designer's words>"
Commits are local. There is no remote until designtools-deploy creates one, so do not push before then; once a remote exists, push at the end of a session. Messages are the undo menu, so write them for the designer: "checkpoint: pricing screen with three tiers", not "fix css".
Undo
"Go back to before X" means:
git log --oneline -15, find the checkpoint, and confirm in plain words: "Back to just after we added the pricing screen, which loses the header changes since then. Yes?"- Safety branch first:
git branch rescue-<date>-<time>
git reset --hard <sha>. If a remote already exists (post-deploy) and the old state was pushed, git push --force-with-lease; otherwise the local reset is enough.- Tell them what they are now looking at.
The rescue branch means nothing is ever truly lost. Mention it only if they ask whether the discarded work is recoverable.
Web surface
There is no local server. Every push produces a fresh Vercel preview URL (designtools-deploy), so iterate in slightly longer beats and share the URL after each meaningful change. Checkpoint and undo rules are identical.
