How I built this site with Claude

What I tried

Instead of picking a Squarespace theme and filling in the blanks, I started with a design system: colors, type, spacing and a handful of components that feel like me. Then I used it to sketch the actual pages.

The setup

1. I answered a few questions about the look I wanted in Claude Design. It came back with an editorial system: warm paper, near-black ink, one vermillion accent, and a newspaper-meets-magazine type pairing.
2. When Claude Design moved into Claude, I had Claude rebuild the system there as a design system I can keep editing.
3. Claude drew wireframes from that system: home, work, a project page, about, and this Lab.
4. For the About page I gave it my CV and told it what to leave out.

Screenshot · the first design system

What happened

The first wireframes were fast and genuinely useful. Seeing linked pages in my own colors and type made it much easier to react than to imagine.

The interesting part was everything I had to push back on. The first drafts sold me as “a video person.” That’s part of what I do, but the real thread is storytelling, so we rewrote the homepage around that.

It also took two numbers from my Growblocks work, the newsletter’s 3,000+ subscribers and 45%+ open rate, and put them in a stats row that made them look like my personal audience. They’re results of work I did for a company, so they moved into a Growblocks case study.

Then I changed the whole look. The first system felt like a newspaper. I collected sites I liked, Claude sketched five directions, and I went with a black, cinematic one. The only thing I kept was the blinking bp mark.

Before · newspaper

After · cinematic

What I’d do differently

• Decide the positioning before the visuals. A design system doesn’t know what you want to be hired for.
• Bring references early. Five real sites I liked said more than any description of a style.
• [Your own lesson.]

Who did what