We Used AI to Build the World’s Best Landing Page—in Minutes

On today's show, we are taking on one of our most ambitious projects ever. We want to show you how to build the world's best landing page for your product or service using AI and how you can do that. In literally one hour, we're going to break down the prompts, the steps, the tools, everything you need to go and build the best landing page you've ever built. Let's get to today's show.

On this show, we are going to show you how to build the world's best landing page with a couple of steps, secret tips that we are going to give away. And so the first one we are going to show you is anytime you want to build something, you should create extensive style guides or templates using deep research. Not many people know how to do this or not many people are actually doing it. And so the reason you do that is deep research can create really extensive style guides and guiding principles on how to do things. And so the way I would think about that is it's really like a an entire book created just for the thing you want to build. We'll likely maybe give this prompt away for you all because your listeners, no one else can get it. But this is like the deep research prompt. So I'll give away this, I'll give away this. How about that? I'll give away this detail. It's like pretty great way to construct a deep research prompt. And like the, the secret sauce here is anytime you get a working prompt, create a GPT assistant. And then anytime you want that prompt again, you just say to the assistant, hey, I want to do this thing. Can you create a prompt? So anytime I want a deep research prompt, it will recreate this template that works really well.

So it has like Kieran, hold on. I think the GPT assistant thing, you just like lost some people. We should do a full follow on show on how to create a GPT assistant for your best prompts. Okay. So if you want that show, leave a comment down and hit subscribe and we will, we'll give you that show soon. But for, for right now you have found a really great landing page.

So I'll give quickly give the synopsis here of what the what's in this deep research prompt. It's the context. So context really matters, right? You want to set the context of what the task is. You can see here that it's all around being a senior UX strategist and we're going to someone who's very knowledgeable at landing pages. You want to be very clear about the objectives. And so you can see here being very clear about what I want it to produce. Because we're trying to build the world's best landing page, not just any old land page. We have deliverable requirements here. We have the structure that I want it to return. So you can see here I have an executive summary. I have core principles, I have copywriting frameworks, visual hierarchy, mobile first and responsive best practices, like tons of really interesting stuff. Then I actually have the wireframe template. It's going to suggest, like, how it's going to break out that wireframe and a bunch of other things. And so it's very, very detailed. And then this is what I get back. And so this is basically a structured template of best practice and guiding principles of how to convert a high converting SAS landing page. I have some people that I think are really good at doing this that I have mentioned in the Deep Research prawn, like Olga V and Thing and people like that to actually direct it to like learn from people that I wanted to learn from. But, like, this is 30 pages long, right? It's a novel, it's a whole book written just for me on how to create incredible landing pages. And I think what most people are doing is they're just going in and say, hey, ChatGPT, I'm a SaaS brand that works in the event space and I want a cool landing page that will drive conversions. And your results are inferior to my results because I am giving it a 33 page template to work from to construct my landing pages. And that's why our results are so much different. You can create personalized informational books just for yourself and based upon like, what are the exact things you want to have in there. And so what you're really doing is teaching the AI assistant to work in the way you work, like our flow here so people can stay tuned as we're going to use Deep Research to create an extensive template. We're going to use Gemini 2.5 Pro, which is an incredible model, to take that and build the outline of a landing page with all of the copy. And then we're going to use one of our favorite tools, Lovable, to actually show you how we can create that landing page. And then we're going to do some secret sauce at the end. You have to stay tuned to the end because then we are going to apply visual styling in a way that no one else is really doing it. And so this is the first part and I'm going to send my little novel over to Kip who's actually going to pass this to Gemini and start to build the landing page.

Okay, so we have what I think is the most comprehensive rundown of what makes landing pages awesome. Based on specifically like we're thinking for like SaaS, technology companies. But you could do this for any market in the industry, any, any global region, right? You would just tweak the kind of deep research that you just outlined for everybody, right?

Everyone's going, yeah, but how do I do that? What's the deep research prompt again? Because your listeners, we're going to give you the prompt, it's going to be in the comment section or in the description section.

Ready for this?

Let's do that.

So we just released a great show talking about Gemini 2.5 Pro, which is the model we're using today. I broke down how 2.5 Pro, I think builds the best marketing strategies of any models today. And I did a deep research project and I showed you how to build that strategy in Gemini Pro. And so if you have not watched that yet, go watch that because that is going to help you understand what I'm doing right here. If you're following along and you love what we're doing, you want to do it yourself. We'd HubSpot have put all of these prompts and directions in one guide for you. You can leverage your favorite AI tool, whether it's Claude, Gemini or ChatGPT to build stunning results driven landing pages at lightning speed. If you're ready to transform your landing page conversion rate, then you can get it right now. Scan the code or check it out in the link in the description below. I took the strategy, I took the deep research I did to build a strategy in Gemini and it's this massive deep research all about HubSpot's customer agent product, which is our AI agent that helps you address customer support and customer inquiries, basically. And so I wanted to say like, hey, help me build a great strategy. And Kieran, it gave me a really amazing Strategy because Gemini 2.5 Pro is a really good strategist and it builds an entire marketing campaign for me. It tells me my target audience, the key characteristics of that target audience, who the key decision makers are, the value proposition, what the core pillars of my messaging should be. This is like, I did not give it any proprietary information. You could literally do this for any product on the Internet, right? Which is pretty wild. And it tells me what channels to do and what channels to build out, right? And gives me success metrics. It's really, really good. And then Basically what I said is like, great, you can then go into Gemini and have any of those elements, whether it be social posts, email, whatever, you can have it go and build a detailed version of that. So I just took the deep research that you sent over to me, right. Which is the best practice on landing pages. And I said, hey, can you use this research for the strategy you just outlined to build the best possible landing page for HubSpot's customer agent? And so it basically what happened is it leveraged that all of the best practices that we outlined to build a really, really qualified landing page to generate qualified leads.

What is the output here? Is it texts or a natural wireframe?

This is, this is all going to be a text output that we're. Then if you look here, there are core principles that it applied based on the deep research. And then it gives us basically it tells us design for a clean, clean single column flow prioritizing mobile readability. Right. So it's essentially a text based wireframe. Right. Because it's right now 2.0, 2.5 Pro is really good at reasoning, but it's not great at like doing taking that reasoning and applying it to, you know, mockups or imagery. It's not bimodal yet. Right. Where we could probably also drop this into chat GPT 4.0 which I'll try in a minute while you're doing lovable and see what we get. But basically gives this entire. Here's what the hero section should be. Here's how we describe. Here's the visual, here's the primary call to action. It's very, very detailed, right? Like this is like incredibly detailed. Like this is a masterclass in why it's got a whole differentiation section. What the FAQs may be final call to action footer and then it even gives you implementation notes. Kieran around a B. Testing page speed. What the demo, how the demo request form should actually work.

Pretty wild.

Like the quality of this is like very, very good, right?

Yeah. Gemini 2.5. Everything you've showed me and I've used that model a little less because I've been so addicted to the image creation tool. I have like not had time, I had not time to do anything else other than like build funny images. I need to we. I have been. Me and my bro have been using this tool in cursor and it seems pretty incredible for codename but I haven't been prompting a lot with it. But you show me a couple of prompts and it seems like pretty comprehensive for any kind of Marketing strategic needs. And this is like a pretty good example of going from a deep research project that took us, took me about 15 minutes put together, which is like a best practice, includes all the things we're trying to build on the landing page. And then riffing with Gemini product 2.5 to build a comprehensive landing page based upon the strategy you have and the guiding principles we have in that deep research project. And then I think, I think you're going to send that across to me and I'm going to see if Lovable.

Yeah, I think out of that for lovable.

So check I make it land the pages here.

Kieran, while you, while you're facing this, I would say we're probably 30 to 40 minutes of actual work time up to this point.

Yeah.

Between. I would say search going back and forth with Gemini, like, we're basically showing you how to build the world's best landing page in like under an hour.

In under an hour. Which it's pretty insane. Like, again, the amount of time and effort you used to have to do for this stuff, it's just like, incredible how you can do it. We're not going to just show you how you can build an end page. We're going to actually show you how to do that and apply different visual stylings. Okay. It's excited to do this. It's color style, so it's going to apply its own styling. And then I'm going to try to work with it too. Dial it in some different ways so we can have some different looks.

Well, first of all, Kieran, I was going to show you because you're just going to think this is funny. I was taking. While you were building the page in Lovable, I was, I was going to go put it in chat GPT to see what ChatGPT would give us for an image. Right. And I started with our corporate chatgpt at HubSpot and I forgot that 4o image isn't on enterprise accounts yet. And so it used.

Bad boy.

It's so bad.

So I've created an app that will be released as soon as I have the API for our listeners and other folks in my social channels, which basically does a bunch of the things I do around styling and Auto creates images for people. Auto creates ads for people.

Let's see who mocks it up better. So I gave chat GPT4O with image generation, the same thing you gave to Lovable Karen, and it gave me, I think, a fine, okay, landing page version. It's still struggling. It needs more GPUs and another round of cycling to handle all the text. It got like a product image right there. Like I didn't give it any of the styling and everything. It did better than I thought it.

Was going to be. The one to do actually is go get it. Go to Claude and ask Claude 3.7 to build the landing page. Oh, here we go.

I can do that right now while you're looking at Lovable.

So this is what it's done and it's. And the copy is a problem. The coffee is not very good, but I actually think I can fix this pretty well. So what, here's what we're going to do. Let me see. We're going to apply a copy style guide. David old movie. Okay, we go.

I'm doing the clock. I'm seeing what Claude is going to give us. We'll end up having like three different options.

This is real Vibe because we're going to flick between so many different things here. So let's see how this is.

So this is peak vibe marketing right now.

We're going to go back to GPT. We're going to take the original Gemini 2.5 Pro output. We're going to say the Fallen.

We're basically like doing a twitch stream for vibe marketing now.

It's very weird.

Very weird. Never thought I'd see myself in this part of the world. I know.

We should move the twitch. There you go. That could be the next thing. The Fallen's land page structure. Can you drastically improve the copy using the attached copy writing principles more concise, punchy and, and, and value driven.

The fact that we are able to do this is mind blowing.

Mind blowing.

Like if you had told us a year ago, hey, you're going to be able to not just like build a landing page that in real time, but am an amazing landing page. Have AI make the code for you. Like, it's like, it's, it's bonkers.

What's. Basically we're doing this without a single tool. You know what I mean?

I gotta tell you, I, I like, I like my Claude example. Claude is giving me a good mock up.

Okay, let's flick back. Let's. Let's flip back to you and then we'll apply this and then I'll get Lovable to do a different decoration.

Okay, here you go. I want to see your take on. So I gave the Claude the same info as we gave Lovable and I literally just said, can you build this landing page? You ready? I like the stop drowning in sport tickets. Start Scaling with trusted AI assistants seamlessly in HubSpot. It's like the copy is pretty good. Like I would obviously do some rewrites on it but it's not bad for a rough draft it didn't get. I mean obviously it has holders for product images but it put the demo buttons in has a support team section and then it has a really good like feature call out section. One of the great things is that you can have support 24. 7. It's really quick to set up. It's got awesome citations. It hits the proof points well. It's trusted by leading teams and put a placeholder for our logos there. It has a testimonial in here. It pulled a G2 ratings and that it's SOC 2 compliant.

That's pretty dope.

Hold on. This is fucking great, man.

That's pretty great. I think there's like, let's see level.

That is like that's unbelievable.

Let's like as a one shot still is incredibly impressive. We're going back to, we're going back to do something lovable here with a revised copy structure. Okay, this is actually pretty good. Let me just. I'll share my screen but yeah, I.

Want to see, I want to see this in action, my friend.

So it's, it's started to fix the copy. So you already trust Hubs or Serum. Now supercharged with Breeze, an AI support agent that resolves up to 60% of routine inquiries on its own. Your team stays fresh for the tough stuff. Pretty good. It's got some value props around the clock responses. No more after hours backlog. Breeze answers questions instantly cited. Accurate answers posed from your approved knowledge base. No wild guesses, just trustworthy info. These are really good build for hotspot. Go live in minutes. No coding, no separate tools, just a seamless add on. It's got the video placeholder request, your personalized demo. It's too many support to get to little time your team's. It's got. So you see, do you see, do you see what it's done to copy? This was a couple of paragraphs because I've applied a copy style. It's tightened everything up and the language is used. Q never ends. Cost keeps rising and your best agents. It's a recipe for missing SLAs overwhelming staff and unhappy customers.

Let's go.

How Breeze. Look at this section. How breeze transforms your support 24. 7 Automate support quick.

Let's just hit publish right now.

Oh my God, this is so good. I mean maybe too good. Trusted by lid and B2B teams. It's got the social proof here. It's got some good social proof. It's pulled in the same things here. Not just another chatbot. A fully integrated AI for serious support.

Let's go.

It's got all the integration stuff, easy to use and it's got the ready to slash response times, reduce support costs and delight your customers. Straight from HubSpot. Wow. There you go.

I want to buy our customer agent now after this landing page, right?

I think this is so good. Like it shows you just a small bit of iteration. So let's do one last little bit of like, funny.

Hold on. I got. What if you un. Uncheck for a second. I have a new Claude version.

You. You.

I went and took the deep research that you did right on that. We started the show with on landing page best practices. And I literally just said, hey Claude, why don't you give me another version? But like here's all of the deep research because before it had just gotten kind of a landing page outline that was informed by it. And based on these best practices, give me a new page and so stop drowning and support tickets. Deliver 24 hour AI assistance right in HubSpot is good copy. Resolve 60% of inquiries instantly. Really good. Build trust with sighted answers. Active in minutes, not months. Active in minutes, not months is a great, great Ezra.

Sorry, what did you. Did you. How did you ask it to improve the copy?

You look, you see right here. I took your PDF and said do a new version using the best practices attached. That's all I did. Is that wild?

Well, I again, like I I. The thing unbelievable that no one else is teaching people is just the, the if you can build context research, man.

And style guides are everything. I mean, look at this. I would actually publish maybe with some design changes, obviously, but the copy is good and the design's not bad. And then it got like, this is really good. Kieran. After hours gap customers need answers outside business hours. But staffing 24. 7 support is prohibitively expensive. So it's like really hitting on the pain of why you need this thing.

Right.

Top talent gets frustrated handling routine inquiries instead of using their expertise on challenging cases. We know that's true. We've talked to our support team. We know that's true. It's way better copy. 5 minute setup. 20. It's like literally just a compare contrast. Here's all the problems you have, here's how it addresses those. And then it's got the customer hero section and everything. If you took the landing page you built and this landing page and put them together, we would have literally the best landing page on this product that could exist.

I want to show you this. So do you want me to quickly show you this?

Yeah, go ahead and show this and then I'll show you. I'll wrap up with the thing you wanted me to show. We just showed that we, we had done some pretty dope landing pages in Claude and lovable. Right. The other thing you can do that most people don't realize you can do is for any brand you can run a deep research project to get all of the styles. So I had Chat GPT basically do a deep research project to build a HubSpot creative style guide and outlines how we use our logo. It gives you the exact color palettes, how we use imagery and iconography. Right. Like this is a very, very in depth and you can do this for any brand. If there's a brand you're just like, I really like this brand and I want to have a style like them. You can build anything in any style and you don't need anything other than a deep research project to do that. Right. Which is pretty wild. And so what I, what I'll do real quick to see what it does is I will take all of this and then I will go boom. I'll copy it, I'll put it over into Claude. I'll come down here and say using the following style info up, update the page and it's going to take all of the style info that like again could be any company because I didn't use any proprietary information from HubSpot. I went and did a deep research project to go and collect all this and now it's going to code a new page and in a second I'm going to show you what that new page looks like.

I think that is probably going to do a better. I wonder why. So that thing I've. So you're actually doing the visual. This is an example of visual styling. My visual stylings are different in that they are like styled on well known brands. When they'll influence, that's how I create my styles is like I aggregate together styles based upon creators, influencers, brands and.

What I creative are your styles versus like strategy based styles.

They're, they're incredible. They're like if I use them for ads they work incredibly well. Like unbelievably well.

So, so Kieran, why don't you walk through for everybody the steps we went through to build the world's best landing page in literally under an hour from nothing to code that you could then like deploy, bug check, you know, you probably need a developer to do a few edits to it. But it's like pretty close, right? Like why don't you break that down?

We built land. We build a detailed template for the best high converting B2B SAS page landing pages. So we did that using a deep research prompt that we went through. Kind of showed you some of that structure. Then that build a 33 page template on how to structure and build high convert and B2B landing pages. We give that to Gemini 2.5 Pro. Gemini 2.5 Pro built a structure for a HubSpot landing page based upon the strategy that Kip had for that landing page. So it's based on a product that we have. So Gemini 2.4, 2.5 Pro did the overall structure, all of the copy, we give that to Lovable. We built the first version in Lovable and we realized, wow, the copy is a little bit too wordy. So we applied another template, which is a copywriting template, which is created in a very similar way as we created the Land page template. It's basically me doing some deep research on some of the best learnings from copywriters across the like the, some of the best, most famous copywriters of all time. We distill all their learnings. We create again a 30 page template and we applied that and we did a second version. And that second version was done both in Lovable and Claude. And I would say Claude was good. Lovable actually was much better at the second version. And we actually had a page we would ship. Like maybe a couple of tweaks here or there, but pretty much a great page we would ship. Then we decided to play around with visual style. And so I took a visual style and based upon well known brands, well known influencers applied that in Lovable. It actually wasn't. It didn't work the way I thought it would work. It works really well for ads. Didn't work as great for landing pages. But you're actually doing a version of that where you built a visual style palette, like a brand palette, again based upon a deep research prompt. I can't keep saying that enough. And you were rebuilding this site to adapt to that kind of brand color palette.

Hey, it's more compliant with HubSpot. It made some of the copy worse. Kieran, like this headline is way worse than the previous headline. But like it got the oranges right? It got the. It has our kind of background colors that we use and everything. Right. So, like, the design is much better.

We would have to say keep. Yeah. So it's how you merge design and copyright in together.

Exactly.

That's the big thing.

Exactly.

These different templates, which.

We can do some shows on that in the future too, because that'll be an important topic. But wow. What's clear to me is that you can make the world's best landing page with AI in an hour. And this before would have taken days or weeks. Right.

And multiple resources. Yeah. And actual design and landing page tools. Just, just, just really, really be like. Just to really emphasize that point. We didn't use a single traditional design or landing page tool to do anything.

No. We basically. We would have to take this code and put it in a tool like HubSpot or. Or something similar to go and host that landing page. But we got to all those steps before that. Right. And it was pretty remarkable that we were able to do that and do it so quickly. So this was a show that. Where we walked through everything. We gave you a ton of secret sauce, and you know now how to use AI to go build the best landing page for your product in less than an hour. We'll see you real soon. On the next episode of Marketing against the Grain. This data is wrong every freaking time. Have you heard of HubSpot? HubSpot is a CRM platform where everything is fully integrated. Whoa. I can see the client's whole history. Calls, support tickets, emails. And here's a task from three days.

Ago I totally missed.

HubSpot grow better.