Gemini 3.1 Pro + Antigravity Destroys Every Site Designer

Hey, so Gemini 3. 1's like really good at making websites. And I initially thought that this was just going to be some hype BS because I saw a bunch of posts on Twitter like this fellas here and then I saw like some UX's and I was like, "Hey, these are gorgeous. " But everybody's like, "Oh, I'm on one-shotting them. It's like super easy. " And you know, generally speaking, anytime somebody tells me they oneshot stuff, I'm just like really inherently skeptical. But uh you know what I did is I went through and I copied his prompt and then I made my own version of the site. And it's not the same site, right? It's a different site, but I did it with the prompt and I did it in one shot and it's really clean. You have animations run through automatically. You have little cursors moving and stuff like that. Um, you have like automatic blurs as you go down and and zoom out. The quality here is honestly unreal. And I was not expecting this to come out of this website builder um whatsoever. So, you know, I figured I'd just show you guys how to build websites like this in one shot using a simple prompt structure. And like I'm not going to like do some big design. So that's some big design framework 17 steps where you have to like ideulate your vision and your mission and your values. It's literally just a prompt. Uh and then you just have Gemini change the prompt and then it just spits out like gorgeous looking websites every time. So

as a former website designer, I'm kind of pissed cuz you know that's like my whole business commoditized. But anyway, let me show you guys how to do it. And once you know how to do it, you'll be able to develop websites like this, which somebody else put together really, really briefly. Only took him a few moments. Uh this over here. um this really clean with like these nice little like scroll down animations. This one over here, I mean these are all just oneshot um Gemini prompts. So, let me give them to you. So, I actually have Gemini putting a site together for me here, which is why we're doing this. But while it's doing that to be uh efficient on time, I have the prompt just right over here. And I ripped it mostly from that 16-year-old kid. Made some very minor adjustments. Basically, the top tier says, "O act as a worldclass senior creative technologist and lead front-end engineer. The objective is to architect a highfidelity cinematic 1:1 pixel perfect landing page for business name. And then you have uh some aesthetic identities, high-end organic tech clinical boutique. The site should feel like a bridge between a biological research lab and avantguard luxury uh magazine. So there's a lot going on here, right? I mean like this is obviously a very particular prompt setup for a very particular type of website. And when I saw this, I was like, "Oh, okay. Like the guy's already picked the navbar and the morphing logic and how big the freaking hero section should be and all this stuff. Like there's no way it's going to work. " But yeah, if you just like ask Gemini to change it and then have it produce a website for you, it does a really good job. And so I just did this while I was recording the intro to this video. And um it's over here on the right hand side. So I'm just going to tell it to launch it and we can look at the results just fresh out of the gate for left click, which is basically the exact same idea. I just copied and pasted the prompt and I said, "Hey, I want you to do this, but it for left click and I want it to look really luxury. " Okay, launching now. This looks pretty clean. We have a slight little zoom out in the background. We're to the definitive AI growth partner. certain amount of money made and more saved. This is cool. Look at that. We have like a little animation going on. This is static on the lefth hand side. This updates which is nice. It's just these little tiny um changes I would say that like signal that this is a high class website. I mean I like it. We have um you know beautiful like scrollover animations and stuff like that. Things zoom in and zoom out. And finally at the very bottom we have the ability to schedule call. And oh I didn't even notice those buttons. Look at that. That's really neat. I like that. [gasps] Yeah. So, I mean, like, you know, is this website going to win a bajillion awards? Probably not. Um, but it's really clean. It's way higher quality than a website that I'd produced, to be honest, using basically any other design system or model, and I

did it in just a few minutes. So, I ended up building my own little mini CLI app for this. Um, that you guys can load up an anti-gravity. Basically, I took that initial prompt, I made some adjustments to it, and then I did what's called an ask user question call, which just pops up a little Q& A bar for you. So, if I ask, "Hey, make me a website," or just something similar. or you could say whatever the heck you want. Um, it'll now pop up some questions that uh it'll essentially guide me through in order to put something like what I just showed you guys together. So, hypothetically, let's say leftclick inc. We build growth systems for B2B agencies. Let's say high rev $50,000 plus month B2B agencies. Aesthetic direction, we'll go hm brutalist signal. three key value propositions. Let's do Okay, so short time to revenue since we start sending on day one. We have low acquisition costs since we use AI to personalize at scale and have preferred pricing and discounts. And then we're also a proven vendor. We've worked with multi-billion dollar portfolio companies. That's about as good as you can get if you're just an agency and not like a SAS product. After that, it's just going to plan the implementation and let's see what the website looks like. Boy, am I excited. And it looks like we have a hell of a landing page here. Good god. So, deploy the growth engine. We build growth systems for high rev B2B agencies. Pure information density, zero latency scaling. Up at the very top, you have this really cool effect with the logo and hero header. It says map growth up top. And as you scroll down, you get that cool like frosted look. Oh man, that is clean. That is really clean. You have what looks to be some animations here for each of my three value props, which is nice. Uh most agencies focus on vanity metrics and billable hours. We focus on systematics uh growth. How cool is that? Oh, and we have both the logo, which is kind of suspicious, but uh and then as we scroll down, we also have what looks to be like some sort of AI personalization thing. Underneath that, we also have that heartbeat, which is really clean. And then at the very

bottom, we have our pricing. So, I mean, like that took me what, like 5 minutes and it oneshotted it. Let's do another one. Okay, what do we got? New brand name. Let's do one second copy. It's the name of my copyrightiting agency. um the fastest and most affordable content for your company. Sure. Okay, cool. So, I mean, like, you know, is this a real thing? Kind of. Do people really use content writing agencies these days? Probably not. Uh it's worth noting that we do currently have like a website up for 1 second copy. Content writing with a twist. I painstakingly put this thing together like 5 hours. Um I imagine this is probably going to oneshot something way better than this in just a few minutes. Here's the 1 second copy site. Damn, I think that looks clean. Nice job. I like the colors. That's uh really nice. Engineered advantages. So, we have these cards that are popping up. That's kind of neat. Um as we continue scrolling down, most content agencies focus on slow turnaround times, expensive overhead, and massive retainer bloatware, whereas we focus on lightning velocity. Pretty clean. Uh you know, at a certain point, this sort of design is just like it's like so high-end that my brain can't even really process what's going on. It's just like, wow, that's a really clean website. And I did that with one prompt. So this particular approach uses a couple of specific libraries. There's vit then there's react tailwind CSS post CSS auto prefixer gap and then lucid

react. I want you guys to know that like you don't have to use this particular design system. It's not actually the design system. I mean I just this prompt is okay. You know it's not very well vetted or verified or you know I've made like 10 websites with this now and nine out of the 10 of them have been pixel perfect like oneshots. Um but you guys don't have to use my prompt. It's not the prompt that's actually the magic here. It's just the model. the model's really good. And I think we're going to a point where essentially like design is completely commoditized. And I don't just mean website design in this particular instance. I just mean design in general. Like we all have the ability now to make like maximalist designs, which is wild. Um the designs that our forefathers could only have dreamed of these fully immersive 3D experiences and apps for Christ's sake even. And uh we could do it all just by copying and pasting a prompt that some 16-year-old kid put together on Twitter. For this next one, I'm just going to have it do it. So, I'll say this is a demo site for high-end luxury boutique real estate SAS. Come up with each of these yourself. And then I'm just going to see what it does if it's given full free reign to make the best site possible. Okay, looks like our Aura estate site's ready. So, legacy meets precision. It's precision portfolio intelligence for ultra prime properties. We synthesize global market data to do blah blah blah. It's obviously quite pretty. Uh what I like about this is the mixture of both sans serif and then serif fonts. Pretty nice. As you can see, the same thing that we had on the previous uh website is present here. So, we have like kind of hot swapped different cards. We have like this global telemetry thing with some blinking code and you know we have various other modules here. Oh, it's kind of interesting. And we have various other divs here that actually glow up as we mouse over them. So, that's pretty neat. Uh and then we have you know the manifesto with more information as well

as a protocol. And so hopefully you guys are seeing here like this is reasonably templated, but it's just templated because I like I just asked it to make it in a specific way. Um, nobody would be able to tell that these are like templated really. So you could just take this idea of the way that the page should be laid out and then iterate on it and make like 5,000 freaking websites a minute. Like it's insane if you think about it. You could parallelize this, run this across five or 10 or 20 instances of Gemini Pro 3. 1 and then you could send custom websites to whoever the hell you want. You could pitch them business. You could spin up the highest and sexiest sites on planet Earth. You could spin up like dozens of products a day if you wanted to uh and just have extraordinarily clean sites that look really human-designed as well. By the way, if you wanted to launch these websites and actually get them on the internet, it's super easy. You just go to either of these sites, Netlefi or this other one here called Versell. And um you can launch both like with both platforms completely free just using their hobby or their uh what's it called on Netlifi's end? hobby or free plans. Um, literally just like ask your agent, hey, can you host this thing on whatever? It'll walk through the whole process end to end. And then, you know, if you have any API keys, it can

actually just manage it all for you. So, that part's pretty cool, too. Okay, so what's the moral of the story? There is no moral of the story. Find the prompt down below. Feel free to copy and paste that all you want. Um, you could oneshot anything. Everybody here is going to try and make this seem super complicated. Get in and cash in on the gold rush. It's not. It's literally just like a copy and paste a prompt and then you're done. So, yeah. Hopefully you guys enjoyed designing the sexiest, highest quality websites on planet Earth with Gemini Pro 3. 1 High.