Claude Code for Designers: Knowledge Work
The exact setup, a CLAUDE.md and DESIGN.md starter, and the workflows I run on top of it. Copy it inside.
Most designers install Claude Code, open the terminal, and quietly close it. The capability is right there. The setup is the wall, and nobody hands a designer the other side of it.
This is the other side.
First, what this is. This is Claude Code for design knowledge work: research synthesis, competitor analysis, design systems, specs, and prototypes you think with. It is not for shipping a product to production, and you do not need to know how to code. You point it at the thinking.
Out of the box, Claude Code is built for engineers. The defaults assume you live in a repo, you read a terminal, you know what to allow. A designer wants to point it at a screen and get something real back, and the gap between those two is an afternoon of config nobody wrote down.
Here is what the other side looks like. With my setup, a folder of messy research notes becomes a structured synthesis with the real themes pulled out. A rough flow becomes a clickable prototype I can pressure-test before I commit a pixel. Same designer, same taste, one afternoon of work. The only thing that changed is the config underneath.
I design products used by millions at my day job. I also build apps that four people use. Both taught me the same thing.. the tool stopped being the bottleneck, the setup is. Once Claude Code knows your taste and your stack, it stops improvising and starts shipping the thing you would have built yourself.
Four pieces matter, and the order matters:
The CLI, installed and configured, so the terminal stops being the scary part.
A CLAUDE.md that holds your taste and conventions, so it builds like you, not like a generic template.
The right permissions, so it moves fast without doing something you did not ask for.
The MCPs that connect it to Figma and the rest of your stack.
Get those four right and Claude Code goes from a clever demo to the tool you open every day.
What you’ll run after this
Once it is set up, these are the workflows I run, and none of them require shipping a line of production code. Two are the ones designers feel most:
Maintain your design system. Audit it against your own rules, catch the drift, and sync tokens between Figma and code without the manual plumbing.
Prototype to think with. Turn a written flow into something clickable, on-system, in minutes. Not to ship. To feel it before you commit.
And three more:
Research synthesis. Raw notes in, the themes and contradictions out, every claim cited.
Competitor analysis in one prompt. Pull real references for a pattern with the Mobbin MCP, instead of an afternoon of screenshots.
Pressure-test a spec. Write the PRD, then have it hunt the missing states and edge cases before a single screen exists.
The setup is below, then every one of these with the prompt I run. None of it works until the setup does, so we start there.
Note: this is a setup you maintain, not magic. It will confidently build the wrong thing if your CLAUDE.md is vague, so the rules carry the weight. It does not replace your judgment. It clears the distance between your judgment and the screen.
The full setup is below for paid members: the install and the one setting most people miss, a CLAUDE.md and DESIGN.md starter that carry your taste, the permissions, and the MCPs I run. It is the same pattern behind superdesigner.ai, the reviewer used by design teams at OKX and Grab, stripped to what you need for your own work.
