feat: design memory — extract visual language from mockups into DESIGN.md

New `$D extract` command: sends approved mockup to GPT-4o vision,
extracts color palette, typography, spacing, and layout patterns,
writes/updates DESIGN.md with an "Extracted Design Language" section.

Progressive constraint: if DESIGN.md exists, future mockup briefs
include it as style context. If no DESIGN.md, explorations run wide.
readDesignConstraints() reads existing DESIGN.md for brief construction.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Garry Tan
2026-03-26 22:16:12 -06:00
parent 5a7c2bc638
commit 9c1b7096a8
3 changed files with 225 additions and 0 deletions

View File

@@ -19,6 +19,7 @@ import { compare } from "./compare";
import { variants } from "./variants";
import { iterate } from "./iterate";
import { resolveApiKey, saveApiKey } from "./auth";
import { extractDesignLanguage, updateDesignMd } from "./memory";
function parseArgs(argv: string[]): { command: string; flags: Record<string, string | boolean> } {
const args = argv.slice(2); // skip bun/node and script path
@@ -160,6 +161,23 @@ async function main(): Promise<void> {
});
break;
case "extract": {
const imagePath = flags.image as string;
if (!imagePath) {
console.error("--image is required");
process.exit(1);
}
console.error(`Extracting design language from ${imagePath}...`);
const extracted = await extractDesignLanguage(imagePath);
const proc = Bun.spawn(["git", "rev-parse", "--show-toplevel"]);
const repoRoot = (await new Response(proc.stdout).text()).trim();
if (repoRoot) {
updateDesignMd(repoRoot, extracted, imagePath);
}
console.log(JSON.stringify(extracted, null, 2));
break;
}
case "diff":
case "evolve":
case "verify":