How to Build a Website with Claude in About an Hour (The Exact Workflow)

Claude built my website in about an hour, and it came out so close to right that my total edits were maybe 5% of the page. Here's the entire workflow, because the hour only works if the 3 ingredients going into it are ready.

The honest framing first: the hour rests on 3 ingredients that were ready before I started. My creative director had already built exceptional brand guidelines, I already had my voice and writing history somewhere Claude could read, and I knew what I wanted the site to do. Claude executed strong direction quickly, and getting the direction ready is the skill to copy.

Ingredient 1: The copy

I started in a regular Claude chat that already knows my business: my voice, my brand guidelines, years of my writing and speaking. I gave it the copy direction I wanted and it returned page copy that was 95% ready. I edited, then exported the copy as a markdown file. (If your Claude doesn't know your voice yet, start with a rules doc; it's the difference between copy that sounds like you and copy that sounds like a website.)

Ingredient 2: The spec doc

In that same chat, I described what I wanted the site to look and function like, gave it a couple of sites I liked structurally, and had it produce a spec doc: pages, sections, layout, behavior. That took 10 to 15 minutes, and I exported it as markdown too. Writing the spec is where you make the design decisions, which is exactly why the build step goes so fast.

Ingredient 3: The brand folder

All my brand assets (guidelines, logos, icons, fonts, colors) sat in one folder on my computer, and that folder is the entire third ingredient.

The build

Then I opened Claude Code (Claude's builder mode that works with real files; plain-English explainer in Claude 101) and gave it one instruction. The pattern:

Create the website for [business name] in Sanity and Astro.
Use the attached spec doc for your instructions and the attached
copy doc for the copy. There's a folder at [location] with the
[business name] brand guidelines and assets. Use that for design.

Sanity and Astro are the stack we've been using for client sites (a content editor and a fast site framework; Claude handles both). It worked for 10 to 15 minutes and handed back a site that was nearly there. I spent a little while refining details, sat with it for a day or two to collect my own notes, dropped in a new headshot, and published.

Total hands-on time for the build itself: about an hour. The direction that made the hour possible: a brand a senior designer crushed in one day, and a business Claude already knew. If you want the small-scale version of this exact move, the Substack design walkthrough is the same play in five minutes.

FAQ

Do I need to know how to code? No. You need to describe what you want clearly, which is the spec doc's whole job. Claude Code writes and organizes the actual code.

What are Sanity and Astro? Sanity is where the site's content lives so you can edit without touching code; Astro is the framework that builds the fast public site. You can name a different stack in the prompt; this is simply the one we use for client work.

What if I don't have brand guidelines? Get direction on paper before you build: colors, fonts, logo, and 2 or 3 reference sites you love. Without it you'll get a competent generic site, and generic is the thing we're avoiding.

Where does the site live afterward? Anywhere a normal site lives: your own hosting and domain. Nothing about this workflow locks you into a platform, which is exactly why I like it.

Draft notes (internal, strip before publish)

• Workflow reconstructed from takes 0008 and 0009. Prompt is the pattern of her spoken version ("create the website for Audrey Automates in Sanity and Astro, use the attached for your instructions and your copy... folder on my desktop with the brand guidelines, use that for design"); confirm with Audrey if she wants her literal prompt published.
• Take 0009 mentions the headshot came from Magnific; kept as "dropped in a new headshot" here to keep this page on one topic. If she wants the Magnific character workflow public, that's its own guide (pairs with the photo shoot video, take 0014).
• ManyChat flow for WEBSITE should send the live site link + this page. Add the live URL at publish.
• Screenshots needed: the spec doc, the Claude Code run, the finished homepage.