Claude Code on the team: this time we build whole pages

AI in practice
Marina Brooks 6 min read

Three new page types with Claude Code, based on an external template and rebuilt in our own design. What went fast, what needed adjusting – and why reviewing is the real work.

After our first attempt at using Claude Code to add a blog to our Pipedrive website, we wanted to know: what happens if we do not just have Claude Code copy an existing page type, but build several completely new pages instead?

So this time there was no finished layout from our other website to carry over. Instead we had an external website template from our partners as orientation. The brief for Claude Code: turn that into three new page types for our website, use our own wording, translate it, and fit it into our corporate identity.

This time there was no finished layout

With the blog we had a pretty clear reference from our other website. We could say that something already exists, that the structure should be carried over and only the styling adapted to the new site. If that interests you, have a read of our previous blog post.

This time the starting point was different: we had an external website template whose content and general page structure were meant to serve as orientation.

But of course the design was not simply to be copied. It had to be integrated into our existing website, with our design, our colours, our components and our wording.

That gave Claude Code considerably more creative freedom, and you noticed it immediately.

Above the fold: more … interesting

The first result was surprisingly usable overall.

But as a designer I of course look straight at the first screenful, and that one was odd at first.

The above-the-fold view was not really what it should have been. The headline took up the entire area and was still cut off. So at first glance you saw half a headline and nothing else. That was somewhat value-free.

The content width did not fit our existing website particularly well either. None of it was dramatic or unfixable, but these were exactly the things where you notice: Claude Code can build a page, but it does not automatically know design rules or the logic behind everything. And it does not automatically know all the small design decisions we have made across the entire website.

So we adjusted: changed widths, tweaked spacing, and so on.

That is less "AI builds a website" and more: I give feedback, AI implements it, I check again. And I can live with that rather well.

Three new pages later …

By and large the implementation was still surprisingly easy, and we integrated three new pages.

The basic structure was there fairly quickly. The content was in place. The pages fundamentally fitted our existing website, and after a few rounds of fine-tuning the result was perfectly usable.

For me as a marketing person that is actually the most important point: I do not necessarily have to be able to write the code myself. I have to know what the page should achieve and how it needs to fit into our website. The rest I can iterate on with Claude Code quite well on my own.

But: the checking. Really checking.

And here comes the part that I now find almost more important than the speed itself.

You really have to check everything Claude Code does. Not just "does the page look good?" but:

  • Are all the links correct?
  • Are the right contacts listed?
  • Do the forms work?
  • Does the content really suit our website?
  • Was anything carried over from the template that does not belong here at all?
  • Are the contact details correct?
  • Do navigation and CTAs work?

Because that is exactly where things happen that you do not necessarily notice at first glance.

Take the phone number. In the contact section, Claude Code simply entered a private phone number belonging to someone who was not responsible for that at all. Purely because some piece of information existed somewhere that apparently looked plausible enough to Claude Code.

And that is exactly why I would never say: "Claude Code built the page, so we can put it online." Claude Code did a very large part of the work, but somebody has to sign the output off — professionally, editorially and visually.

Another example was the links. Part of the content came from the external template. That template had forms and links which made sense for their website, but not necessarily for ours. Some of those links were carried over anyway.

Claude Code only sees: there is a link here on the template. It does not automatically know that this link belongs to a completely different system and is irrelevant for Infralovers.

So here too: let it generate, yes. Adopt it blindly, no.

And here the difference between designer and marketing person gets interesting again

As a designer I look at things like layout, hierarchy, proportions, corporate design and components.

From a marketing point of view, entirely different questions come up:

  • Does the CTA make sense?
  • Is the contact person correct?
  • Does the link really lead where it should?
  • Would a potential customer understand what they are meant to do here?

And that combination is, in my opinion, rather important with AI-generated websites. Because a tool can produce a technically functioning page for you very quickly, but "it works" is not the same as "it is right".

My verdict after three new pages

After blog number one and now three completely new pages I would say: yes, Claude Code saves time in development. But it costs time in review. Of course a manual project would need checking too, but there some thought has already gone into the build and you do not have to check every single point with 100 % attention, text included.

Claude Code is not simply "I type a prompt and get a finished website." It is more like "I set a direction, get a first version, check it, give feedback, have it improved and check again."

And the better I know myself what I want, the better the whole thing works.

That is probably the most important point from these experiments so far. You do not necessarily have to be a developer. But you do have to know your own requirements and, above all, be able to articulate them. From a design point of view I have known this since day one: if a client cannot articulate what they want, the implementation gets difficult. That is not a new problem, it just shows up within seconds now instead of after countless rounds of corrections.

So you have to be willing to review the output critically – and your own prompts just as much. Perhaps you simply did not describe precisely enough what you wanted and which details still needed attention.

What comes next?

So far we have either given Claude Code an existing structure or left it a fair amount of creative freedom. Now we want to try the next step: what happens if we hand it an existing Figma layout? A concrete design that is to be implemented and integrated into our existing website.

Because then we can compare rather precisely: how well can Claude Code actually translate a layout we designed into working web code – and above all, how much do I have to correct afterwards?

To be continued.

Go Back

Pipedrive know-how for your sales team

Once a month: concrete tips on Pipedrive, automation and sales processes. Drawn from live customer projects, without the marketing filler. Unsubscribe any time.