A pattern language for building with Claude
Five things to know before your first serious project.
Don't write a technical specification. Describe what you want to exist in the world. Claude will figure out the implementation.
"I want to make minibooks for reading with kids... like the pixi books in germany"
Instead of describing a design, point at something that exists. "Like X but for Y" is more powerful than paragraphs of requirements.
"replicate and remix labs.google"
Get to Vercel/Github within the first session. Real URLs make everything more tangible. Iteration happens faster once it's live.
"make a github and deploy on vercel"
Ask for review interfaces where you can thumbs up/down generated content. Human-in-the-loop makes AI output actually usable.
"give me a review ui where I can thumbs down the ones that need to be redone"
Don't separate "research phase" from "build phase." Let Claude context-switch. The research informs the building in real-time.
"first research similar sites as background... then build"
Things will break. Claude will misunderstand. You'll say "same issue" and "that's not what I meant" many times. This is normal. The persistence loop is part of the process.
The most common mistake is over-specification. Precise prompts produce brittle results. The art is knowing what to leave open.
Describe the destination, not the route.
Name the vibe, not the pixels.
Specify constraints, not implementations.
Claude fills ambiguity with competence. Your job is to create the right-shaped space for that competence to flow into.
Different modes for different work.
For deep domain work, archives, research
Immerse Claude in the domain first. Don't ask it to build—ask it to understand. The building follows naturally.
Source Library: 2,216 prompts. Key insight: content-first. The OCR pipeline, translation engine, and UI all emerged from "help me make these ancient texts accessible."
For design, visual work, brand
Show, don't tell. Reference sites beat descriptions. Then iterate fast with vibe words.
Design Therapy: Started with "take a look at designtherapy.org. Download all the components. Then recreate based on contemporary design concepts." References first, always.
For deadline-driven, intensive builds
Blend research and writing in the same session. Let Claude context-switch between gathering and producing.
AIED paper: 1,425 prompts in 6 days. Research + writing blend meant Claude would find a paper, summarize it, and immediately draft how it fit the argument.
From first prompt to shipped product. Click to expand.
Named patterns, extracted from practice.
"Help me think through an improved organization. I want a purposeful front page, a collection of sources, a data visualization section..."
Paint the destination, leave the route open. Claude fills the gaps with competence.
"ok, whats next?"
Three words. Relies entirely on Claude's context. Often produces better continuity than explicit summaries.
"Look at the sourcelibrary-v2 repo and figure out how to add those to the mongodb with the appropriate metadata"
Hand over the steering wheel. State the problem, not the solution.
"can you make the style more cream paper and ancient wisdom?"
Vibe words carry intent. Not "change the background to #f5f0e8"—just name the feeling.
"Sure, the bohme. but with this link: [url]"
Accept the work, add one constraint. Layer refinements rather than restarting.
"no, maybe I didn't communicate well. I mean, I want to create synthetic students to try the items..."
When Claude went the wrong direction. Redirect without blame, restate the actual goal.
"check out my ancientwisdomfundraising github/vercel/folder for the playbook"
When descriptions aren't landing. Point at something that exists. A reference beats a thousand words.
Patterns for specific workflows.
Clone existing sites as starting points, then remix.
"can you crawl mulerouter.ai to copy the code and retrieve the styles and save it in organized folders with markdown to describe the components.. I'm going to want to put the files back into LLMs with the markdown so that we can clone the site"
"now remix the functions of this to support colorcodedcrime (check it out). You can pull images from colorcodedcrime for our new site"
"replicate and remix labs.google. And use mulerouter Midjourney to explore logos, playfully"
"use the mulerouter skill to make an awesome website: video hero gifs to replicate xwhysi.com. take a look"
Generate assets inline during development. Claude looks at results and iterates.
"Use mulerouter to generate the images of the clothes and models. Use claude to look at the images to then recreate with mulerouter midjourney"
"make a video for the hero image. turn it into a gif. wan text to video. Show me the video first"
"ill use mulerouter.ai for image generation, esp for button panels. no emoji. use untitledui and reactbits for components."
"don't you need to look at the existing images on morni to be able to describe them as prompts for midjourney?"
Build UIs to give feedback on AI-generated content. Thumbs up/down, comments, batch review.
"Give me a human review interface where I can thumbs up/down bad ones and give comments"
"give me a human review ui where I can see each story and the prompt used to create it. I want to be able to give thumbs up, down and leave a comment"
"give me a review ui where I can thumbs down the ones that need to be redone"
"I think we need to separate things out in the workflow. Where are places where you need my input... Can you zoom out and think about how I can create this whole process?"
"you'll need to give me a page where I can review, where the intended split is shown over the images"
The reality of building with AI. Frustration is part of the process.
Same bug, multiple attempts.
"same issue remains — can you try to figure out why?"
"nope. same 1/3 thing. what else might it be?"
"still an issue. maybe you didn't deploy?"
"issue persists."
"nope, still the same"
When Claude goes the wrong direction entirely.
"no, maybe I didn't communicate well. I mean, I want to..."
"weren't we making this for riso? What have you been doing exactly?"
"I feel like you didn't fully listen to my feedback"
"i made descriptions but you didn't really make any changes. Think about what I said deeply"
"that's not what I asked for"
When the output isn't good enough.
"oh no, the design is very bad. Sorry. It needs to be elegant and readable with cool data viz!"
"looks terrible! please make it look like claude"
"hmm, could be a lot better I think"
"still feels very AI"
"the quiz is poorly integrated"
Technical problems that won't die.
"Error: column 'item_id' does not exist"
"oh no now it doesnt work"
"not all of the links work. please check."
"the microtubules still go outside the cell"
"there is a big stick going through the walker. That's weird."
When you hit walls.
"I'm frustrated by all the estimates alone. I want concrete counts and sources"
"its hard to reach out to people for fundraising, so I want to start tonight"
"I found it difficult to follow"
"still the ER smoothness is not enough, looking for more ways to draw it, like a spacefilling algorithm but with sheets? IDK"
When the workflow itself needs fixing.
"I think we need to separate things out in the workflow. Where are places where you need my input... Not happy with how things are going now..."
"you are using too many tokens"
"we now have too much fluff, I'm concerned"
The work continues anyway. These frustrations appear across 10,497 prompts—but so does the persistence to push through them.
What to avoid.
"Create a React component with TypeScript using Tailwind CSS that has a blue background (#3B82F6) and padding of 16px..."
The more you specify, the less room for Claude to apply judgment. Save precision for actual constraints.
"First, let's plan the folder structure and database schema..."
Start with the thing you actually want. Structure emerges.
"First research everything, then we'll build."
Blend them. Context accumulated during research makes building better.