Works · AI × Design System / Claude Code · 2026
Design Studio with Claude Code
A directory structure for making every kind of creative work with Claude Code
Abstract
A directory structure for making every kind of creative work with Claude Code. Sub-agents and skills are combined so that any type of project can be produced through the same structure.
Background
Critique always comes with creative work. Working alone, though, the loop of being critiqued and revising rarely turns. The thought was that working with Claude Code could make that loop run, and lift the quality of the work a step in doing so.
This was never about tidying data. It was about standing the role of critic outside myself, and that is the main reason the structure exists.
Method
An art director agent reads the brand rules and judges the work against them. What comes back is not an impression but a verdict, together with the number of the article that was broken. On this site the critique returned “conditional go, six required fixes”, and those fed straight into the revisions.
When ideas need to diverge, the same procedure runs in parallel to widen them at once. This site went through eighteen proposals. Starting a project is just as cheap, since the folders and the brief template arrive already in place, so the only thing left to think about is the content.
The same approach now extends further — into streamlining operations, and into building and running design systems — offered as a mechanism.
Outcome
Through it came the brand foundations and rules, the logotype and the icons. The assets used on this site, and the site itself, all come out of the same mechanism. Every one of them can be produced again from the same skills and sub-agents, and the structure will keep growing.
How the parts connect
Solid = judgement and write-back / dotted = calls and lookups
/new-project/brief/moodboard/explore/critique/deliver/wrapThe next project starts from what the last one learned ↩
How this portfolio went through it
7 commands · 18 prototypes · 2 constitutional amendments
- 01
/new-projectOpen the projectDecide the purpose and the reader — here, a door for hiring and for work.Clones the template, so brief, research, exploration and delivery folders exist from the first minute. - 02
/briefWrite the directionDerive the IA from the constitution. Works for results, Log for process.Turns a vague request into purpose, reader, constraints and success conditions. Skip it and critique has nothing to judge against. - 03
/moodboardGather referencesTake four sites apart and keep only what they share.A research agent collects cases and writes the direction note; everything gathered stays in the project folder. - 04
/exploreWiden the optionsEighteen versions: light, plotter, liquid glass, geometric type.Still work goes through Pencil or Figma, anything that moves through code prototypes. Several directions can run at once. - 05
/critiqueCritiqueConditional go, six required fixes. Two articles amended.A critique agent judges the output against the written constitution and returns a verdict with the article it violates. It is kept separate from the maker. - 06
/deliverExportThirty-five URLs generated, each verified before publishing.Applies the naming rules, optimises images, and runs a syntax check and an automated browser pass before anything is handed over. - 07
/wrapClose and recordCarry what was learned into the next project.Appends the learnings to a shared record and promotes anything reusable into the shared library, which is where the next project starts.
- The glass tube
- The hand-built rose
- Permanent construction lines
- A rose from an equation (twelfth attempt)
- A typeface of circles and rectangles
- Construction only while a cell flips
- Glass for objects, never for surfaces
- The wordmark moved to GEO Mono
- No number that is not measured
- The process became nine Log entries
- Causes of failure written down
- Limits of the tools written down