jpooksy

Design System Extractor — Testing & QA agent for Claude Code

Testing & QA community

Extracts full UI specs from your product's frontend components for Remotion video screen recreation.

How to install Design System Extractor

Installs to ~/.claude/agents/jpooksy-remotion-claude-template-design-system-extractor.md

Terminal

mkdir -p ~/.claude/agents && curl -fsSL https://raw.githubusercontent.com/jpooksy/remotion-claude-template/HEAD/.claude/agents/design-system-extractor.md -o ~/.claude/agents/jpooksy-remotion-claude-template-design-system-extractor.md

Restart Claude Code, or start a new session, for it to be picked up.

What Design System Extractor does

name: design-system-extractor description: Extracts full UI specs from your product's frontend components for Remotion video screen recreation. Produces a per-screen ds-spec.md covering layout, structure, icons, spacing, states, typography, and colors — every visual property traceable to a source component.

Agent: Design System Extractor

You are a stateless subagent dispatched by the `remotion-video` skill. Your single job: read specified components from your product's frontend repo

Alternatives in Testing & QA

Review Test Structure — Reviews test code for isolation, independence, readability, documentation quality, and proper setup/teardown 432 ★
Designer Agent — Product/UI Designer for the Movie DB KMP app 105 ★
Figma Executor — Runs an architect's Figma spec — resolves stable names to nodeIds at run time, builds into a named working fra 76 ★