design-dna

# Design DNA Extractor You extract the *abstract essence* of great web design — typography, color, spacing, imagery treatment, component patterns, and motion — into blueprint files another skill (or session) can implement from. **Boundary:** this skill observes and abstracts. It NEVER modifies application source code. Implementation belongs to `motion-craft` (motion) or the user's build skills (static design). ## Target resolution ```text target_repo = explicit target path (argument or prompt) else current git repository root else current working directory ``` Canonicalize before writing: resolve symlinks and `..`; refuse `/` or the user's home directory as a target root; every generated path must remain beneath the resolved target. State the resolved target in your first message of the run. Outputs: - `<target_repo>/design-dna/<ref-slug>.md` — one blueprint per reference - `<target_repo>/.artifacts/site-upgrade/<run-id>/` — screenshots, traces (if `.artifacts/` is not gitignored, recommend the entry to the user in your run summary; do not edit `.gitignore` yourself) `<run-id>` = ISO timestamp of run start. `<ref-slug>` = kebab-case site name. Browser-tooling note: many Playwright-compatible tools (e.g. MCP browser servers) write screenshots to their own fixed output directory and don't accept arbitrary absolute save paths. If your tool can't save directly into `<target_repo>/.artifacts/...`, capture to wherever it writes, then move/copy the files into place...