Fieldwork — Design skill for Claude Code

Fieldwork

Fieldwork is a browser-native control dock for local coding agents. Install it in an app, start localhost normally, and a bounded panel appears on the right side of the running product. From there you can activate Codex, Claude Code, or both; choose their model and thinking level; describe a change; and watch the resulting source edits appear through the app's normal hot reload.

The running application remains the canvas. Fieldwork keeps the local-agent conversations, exact DOM, design-system findings, annotations, screenshots, and reversible source snapshots beside it instead of moving the work into a separate dashboard.

Runtime requirement: Node.js 20 or newer.

What ships

• Right-side local-agent dock: a compact panel overlays localhost without resizing or reframing the host application.
• Runtime agent switchboard: Codex and Claude Code are detected from the machine, activated or deactivated in the UI, and configured with real CLI model and thinking-effort arguments.
• Parallel persistent conversations: one instruction can fan out to every active agent. Responses are streamed and labeled per provider while each CLI retains its own resumable session.
• TheSVG brand system: Codex and Claude Code identity marks come from @thesvg/react; general interaction controls use the existing interface icon set.
• One clear workspace: a single view selector exposes Conversation, Inspect, History, Overview, Brief, Library, and Tokens without detached rails or duplicate trays.
• Persistent page actions: Select, Draw, Capture, and Audit stay in one predictable row above every workspace.
• Vision Constructor: a persistent objective, audience, product tension, forbidden-cliché list, fixture set, and acceptance criteria that can be locked before implementation.
• DOM inspector: select the exact rendered element, generate a stable selector, audit i