Why Claude Made My Landing Page Ugly (and How I Fixed It)

My first AI-generated landing page was trash. Here's what I changed to get a design worth signing up for.

Why Claude Made My Landing Page Ugly (and How I Fixed It)

I did something I’m not proud of.

I asked Claude to build the first draft of my community landing page and told it to “just make it pretty.”

That was basically the entire design brief.

The result…

Trash.

Like, impressively generic. Then I had the nerve to look at the page as if Claude had personally betrayed me. 😂

The first dark blue VibeCodeHer Academy landing page Claude generated from a vague prompt

The first draft. “Just make it pretty” gave me exactly what I deserved.

But Claude wasn’t the problem. I gave it zero style direction, nothing to reference and no information about who the page was for. What exactly did I think was going to happen?

So I tried again.

I gave Claude zero style direction

“Make it pretty” is not a design direction. Pretty could mean bright and playful, clean and minimal, dark and moody or something covered in gradients for reasons nobody can explain.

Claude had no idea what I meant by pretty because I never told it.

For round two, I gave it my design style guide with my brand colors and fonts. I also explained how I wanted the page to feel. Now it had some boundaries instead of a blank canvas and my useless lil instruction.

If you have a brand guide, upload it. If you don’t, make a simple one with:

  • Your color palette
  • Your heading and body fonts
  • A few words to describe the vibe
  • Examples of things you do not want

It does not need to be a fancy 40-page document. A page of notes is already more helpful than “make it cute.”

If you can picture the look but have no idea what to call it, use Tilda’s guide to popular web design styles. It breaks down styles like minimalism, neobrutalism, editorial and retro with real examples. Find the style that feels closest to your brand, send it to Claude and explain which parts you like. Now you can say more than “make it cute” even if you do not speak fluent designer.

I didn’t give it anything to reference

Apparently, I also expected Claude to reach into my brain and figure out which websites I liked.

What a wild concept: showing it exactly what I want instead of making it guess.

I uploaded screenshots and examples of landing pages I liked. Then I told Claude what I liked about them. Maybe it was the layout on one page, the spacing on another or the way a third site introduced its offer.

That explanation matters. If you upload five screenshots with no notes, you’re making the AI guess all over again. You can say something like:

I like the large headline and the amount of space around each section. I also like how the benefits are shown in cards. Use that as inspiration, but keep my brand colors and copy.

Much better. Claude knows what to pay attention to, and you’re not asking it to copy somebody else’s entire site.

I didn’t tell Claude who the page was for

A landing page has a job. The right person should land on it and think, “Oh, this is for me.”

There was just one tiny problem. I had not told Claude who that person was. For the improved version, I explained:

  • Who my community is for
  • What they’re struggling with
  • What I offer
  • The problem my community helps them solve
  • What they should do after reading the page

Once Claude understood the audience and the offer, the page stopped feeling like a random template. The copy made more sense. The sections were in a better order. Even the call to action felt connected to the rest of the page.

Same Claude, much better landing page

I did not find a magical prompt. I finally gave Claude enough information to do the job.

The improved colorful VibeCodeHer Academy landing page created after giving Claude brand and audience direction

Same tool. Much better landing page.

It needed my brand style, examples of what I liked and context about the people I wanted to reach. None of that lived inside the phrase “make it pretty,” even though first-draft me apparently thought it did.

AI can build the first draft, but you still have to bring the taste. You know your audience. You know what feels like your brand. The tool cannot make those decisions for you if you never share that information.

The next time you ask Claude to build a landing page, do not make it read your mind. Give it your style guide, show it a few references and explain who the page is for. Then look at what it makes and tell it what still feels off.

Your first prompt does not need to produce the final page. Mine clearly did not. But once I stopped being vague and lazy about what I wanted, Claude gave me something worth signing up for.

Come build with me inside VibeCodeHer Academy

This landing page is for VibeCodeHer Academy, the vibe coding community I’m launching for nontechnical and tech-curious founders who are ready to stop collecting tutorials and start shipping their app ideas.

We’re building real, working MVPs with AI. You bring the idea. I’ll help you figure out what to build first, get it working and ship the thing.

And if you’ve been sitting on an idea because you keep overthinking it, I’m hosting a free live workshop called The Locked In Method on Monday, August 10 at 8 PM ET.

I’m sharing the exact method I followed to quit my six-figure job, travel the world and build a multi-six-figure business in six months. You’ll also get a live look at the app I vibe coded to run it all, plus time for Q&A.

The workshop is 90 minutes and free. Register to get the replay and my Get Out of Your Head Starter too.

Save your seat for The Locked In Method

Happy building!

Kedasha 😊

This post was written with the help of AI from a human-generated script.

I write about building with AI.
Let's stay connected! 💕

Get the next post delivered to your inbox and follow me on Instagram for daily AI tips and coding content.

    See you on Instagram!