How we built the Kempro website using Claude

The website you're looking at wasn't built alone — we made it working side by side with Claude, Anthropic's AI assistant. We want to share how the process went, which tools we used, and what we learned, in case you're thinking about doing something similar at your own company.

The tools behind the process

We didn't rely on a single AI tool — it was a combination of pieces, each with its own role:

Figma — the design tool where we first defined how each page would look: colors, typography, and spacing, before writing a single line of code.
Cowork — the space where we defined design and content together with Claude, reviewed the site page by page, and prepared precise instructions for building each change.
Claude Code — the assistant that writes and edits the site's actual code directly in the terminal, based on those natural-language instructions.
Envato Elements — a stock video and photography library where we sourced visual pieces that matched the brand's color palette.
Sanity — the system we're setting up so the team can edit the site's content in the future without touching code.
Vercel — the platform where the site is published and made available on the internet.

The process, step by step

We started by defining the site's real structure and content — what services we offer, which case studies to tell, what "About us" should say — before thinking about how it would look. Writing the real content first, instead of using placeholder text, saved us from redoing design work later.

With that foundation in place, we built each page with Claude Code from specific instructions: which block to add, what text to use, how it should behave. Every change was reviewed before being applied, so the process felt more like a conversation in small steps than one giant instruction.

Want this for your company?

After that, we fine-tuned the visual details: colors, typography, and spacing, until every block felt like part of the same site instead of a piece bolted on separately.

At the end, we did a full review of the site, page by page, looking for inconsistencies — a button with a different style, a mismatched margin, a link pointing to the wrong place in the other language — the kind of thing that naturally happens when different parts of a site get built at different times.

What we learned

The biggest advantage wasn't speed, though there was plenty of that too — it was being able to iterate out loud. Every design decision could be tested, seen, and corrected in minutes instead of days, which let us get things wrong quickly and cheaply before calling anything final.

This is just a summary. In the coming weeks we'll publish a more detailed article, decision by decision — from why we chose each color to how we made sure the site worked equally well in Spanish and English.