Vibe coding for designers: my actual process

Martijn asked a great question in my community Slack the other day:

“Have you documented your vibe coding process somewhere? I’m curious about your overall approach to creating a website like yours and what tools you use. Do you use platforms like Lovable or Cursor? How skilled are you with code? What about the backend? Have you run into issues you couldn’t solve yourself?”

I haven’t documented it—until now. So here’s the honest breakdown of how I built and maintain antonsten.com using AI, what actually works, and where I’ve thrown my hands up and walked away.

Why vibe code at all?

Let me start with the obvious question: why not just use Ghost or Framer or whatever and focus on the actual work?

Fair point. And honestly, for a lot of people that’s the right call.

I originally moved to Ghost because I liked that it was indie and I wanted one place for my newsletter and blog. But it turned out that setup only makes sense if your newsletter and blog content are 1:1—which isn’t the case for me. I was also paying for something that felt like an ongoing expense I didn’t need.

So I had a practical problem: I wanted something cheaper and more flexible. And it turned out I could now build it myself.

That’s the real story. I didn’t set out to learn vibe coding for its own sake. I had a problem, and AI tools had gotten good enough that building my own site became a realistic option. Now I run a static Astro site deployed through Netlify. No monthly fees, full control.

But here’s the honest take: if you just want to write and not think about your website, use Ghost. Use whatever gets out of your way. Vibe coding makes sense if you want control and enjoy tinkering. It’s a trap if it becomes procrastination dressed up as productivity.

Start in Figma, not in a prompt

This might be the most important part: I don’t start by talking to AI. I start in Figma.

I know Figma. I can move fast there. So I sketch out the scaffolding first—general theme, grids, typography, color. Maybe one or two pages. Nothing polished, just enough to know what I’m building.

Why does this matter? Because AI will happily design the wrong thing for you. If you open Claude Code with a vague prompt and no direction, you’ll get something—but it probably won’t be what you needed. AI is a builder, not an architect. You still have to be the architect.

I’ve never been able to vibe code anything just out of the blue. I need to know the desired outcome before I start prompting. Maybe that’s a personal limitation, but I suspect it’s actually how this works best.

The actual tools

Once I have the design direction, I move to VS Code with Claude Code (I used Cursor before, both work well).

My first step is defining what we’re building. I describe the page structure—what sections it should include—and then work piece by piece on components: newsletter signup box, callout section, button styles, that kind of thing. High-level first, then smaller chunks.

For hosting, I use Astro as a static site generator, connected to Github and deployed through Netlify. No database, no CMS. When I want to publish a new blog post, I literally ask Claude to do it and push to Github.

Yes, that’s unconventional. But it works for a site like mine where I’m the only editor.

My coding skills (or lack thereof)

I did some coding in the late 90s. That’s roughly where my skills are today.

I understand HTML and CSS well enough to read what’s happening, but I couldn’t build anything from scratch myself. What this means in practice: I can make tweaks. Adjusting margins, changing typography, small fixes—I can do that by hand. But the heavy lifting? That’s Claude.

Understanding code, even at a basic level, helps. You don’t need to be a developer, but knowing what you’re looking at makes the back-and-forth much smoother.

Even the writing

Here’s something that might surprise you: I use a similar process for writing these posts.

I collect my initial thoughts—rough ideas, half-formed points—and then work with Claude by having it ask me clarifying questions. This helps me think through aspects I might have missed, while making sure the final piece reflects my thinking. Because just like AI will happily design the wrong thing for you, it’ll happily write the wrong thing too.

Once the post is ready, I paste it into VS Code and ask Claude to publish it. Same workflow, different output.

The iteration never stops

The first version is never good enough. Never.

I still make tweaks to my site on a weekly basis. Partly because things break or look off in certain contexts, but mostly because I treat the site as a playground. It’s where I experiment, try new things, and occasionally break something at 11pm and have to fix it before bed.

This is actually one of the joys of this approach—the site becomes a living thing you can tinker with instead of a finished artifact you’re afraid to touch.

Where I’ve hit walls

Let’s be honest: I run into problems I can’t solve all the time.

Sometimes I just can’t get the prompt right. I’ll describe what I want, Claude will build something close but not quite, I’ll try to clarify, and we’ll go in circles until I give up. Animations and transitions have been particularly brutal.

One example: I spent hours trying to get an image to unmask on scroll. Simple enough concept, right? Instead I got the entire page unmasking. Then the image being static while everything else moved. Then something that technically worked but looked terrible. Eventually I just… didn’t do it. Moved on. The site survived.

When I get stuck, I’ll sometimes ask Claude (or ChatGPT) to explain what’s happening rather than just fix it. That helps me learn. Other times I accept that this particular feature isn’t happening today.

What this means for designers

Any designer can do this. The tools are accessible, the learning curve is manageable, and you don’t need to become a developer.

But—and this is important—you still need design thinking and systems thinking. AI handles the syntax, but you need to know what you’re building, why you’re building it, and how the pieces fit together. The hard part was never the code. The hard part is the decisions.

So yes, designers should embrace AI. But let’s keep designing. Be explicit about what you’re building before you ask AI to build it.

If you’re curious but haven’t tried it, start small. A landing page. A personal project. Something where the stakes are low and you can experiment.