So, the AI studio in HighLevel is amazing, but there's a couple things that nobody's doing that I want to share with you that takes your designs and your outputs from a 7 out of 10 to a 10 out of 10. So, in this video I'm going to share my screen. I'm inside of HighLevel, the AI studio, the web coding tool.
Uh you can now build websites, landing pages, apps, micro tools, artifacts. And I'm going to show you some of the prompting uh tips and tricks, if you will, that can level up your designs and make it look way better. So, first things to keep in mind, yesterday I had a meeting with um the developers uh responsible for the AI studio, and we've been building this.
I've been a part of it for months now. Uh and I have really good news for you. Um right now, if you build out, let's say 10 different pages, and you say clone this, uh create something similar to this, model this, whether it's a screenshot or a link, it can look at it, it can clone it, and rebuild it, and model something that you enjoy, something that you like.
And then sometimes you might think, when you see it, you're like, "Wow, this is amazing. " Sometimes you might be like, "Uh I'll it's good, but it's not like similar it's not the same as this other design. " So, if we go through some of these designs, you'll see uh I have Here's one where we cloned Coach Full, and um just for fun to see kind of the you capabilities.
And then here you can see it's a Journal 18, and just again, trying to clone it, see what it can do. Here's Well, AI Academy is mine. Um here we have my personal brand page that we're working on.
And so, overall, the design is pretty good, but sometimes you might see a design you're like, "I don't know if I like this 100%. " So, the reason why, and I found this out yesterday, is because with any AI tool, when you have billions and hundreds of billions of tokens. So, the AI Studio HighLevel, there's already been hundreds of billions of tokens spent, meaning people, you and I, are in HighLevel and we're building out pages, funnels, websites, and it's using a lot of credits and AI tokens.
And so, when something breaks, it can be because of Gemini, it can be, you know, because of the language models that are powering AI Studio. Um there's something called a fallback. The fallback model is typically the second best available.
Now, there are some good news coming very soon, so stay tuned for that, where you're going to have access to way more models, so that when when it fails because of external tools or APIs, um it's going to just pick another one that is just as good. Um so, I'll have more news on that soon. But right now, that's why if it's not immediately really good, it's because it's either timed out, the API connection because of Gemini or some other company has failed, therefore it's falling back to another model and the output isn't as good.
Um so, what you can do in that case is you can just try again, open up a new um you know, AI Studio page, same prompt or even enhance the prompt a little bit, and you'll see that the output is much better. So, that's good news. Um the meeting I had yesterday was about how to improve the output even more with the uh fallbacks.
Now, there are other options like Open Router and other solutions where you can get access to all kinds of language models through their APIs. So, I'll got I'll I'll I'll credit you with it when we have updates on the output there, but just know that this is like this is the worst that it's going to be and it's just going to get better from here. But it's already pretty good.
Um speaking of prompting and enhancing the prompt, one thing that you can do is what I call reverse prompting. So, here you can see I've taken a a screenshot or an image from Drbbble. I like Drbbble for different designs.
You can see different themes in terms of colors um, and also the wireframes and the hero section. So, I took something like this, just copy image, go into ChatGPT. You can also just go into HighLevel and say copy, you know, copy this image and build out the section and then build the rest of the page and add animations and scroll effects and hover effects.
But, I said reverse engineer, so reverse prompt engineer this image to make a prompt for Vibe Coding Tool to rebuild a similar landing page including the style, branding, layout, font, colors, background, elements, graphics, button, etc. Add five to seven sections, so it's a full landing page. >> [snorts] >> Um, you could also take that exact prompt cuz I tested it in the AI studio and it'll build something like, I believe it's here.
So, pretty good, right? Um, that's just a tip and trick for you when uh, the output isn't as good as you want it to be, go and reverse prompt engineer. I can also say, um, add a few a few more animations to the prompt.
Few more animations to the prompt. And then, you know, you can use ChatGPT, Claude, doesn't matter. All the AI's are really good So, I got another update for you when it comes to the user experience in AI studio.
So, here we got a page, this one is modeled after a, I believe a a template that I found. Uh, Framer, I think it was a Framer template and I changed the name of it, the background image and everything, the text. And I saw that yesterday it was announced that we now have visual edits inside of AI studio, which is awesome.
So now, instead of just saying, you know, there's going to be obviously you can still prompt. There's going to be suggestions suggestions that you can just click here for the next steps or the next suggested prompt. >> [snorts] >> But then you have visual edits.
So if you click visual edits, you can now go and change the text here. So elevate your performance, accelerate your performance, for example. Um and then I can just hit save.
And you can go you can change the colors. Let's go back to visual edits. Um you can change the background color.
Um styles, and you can change the size of it. Even here, we have font size 36. A little bit small, 48, still small, 60.
Um and then, you know, hopefully we'll add more. I can On the next meeting with them, I'll say we should have up to 92. I think that's good.
Uh 56, 64, 72, 84, and 92 would be good as well. Then we have a font family, so we can test serif font, uh sans, and mono. You can see I already had another uh another font here.
Um speaking of which, some people are asking how do you uh how do you currently add custom fonts? So personally, you know, in Lovable, for example, when I build an app, I can just upload it here, and that's coming soon to AI Studio. Right now it's just one extra step.
So inside of your high level, you go to media storage. So you see AI Studio here, media storage, and then here you can see I've uploaded fonts. So if I um upload a font, you just click upload, upload the font, like this one, ITC Garamond, I use the OTF.
Um I can just right click, get link, and I come in here and I say, "Use this font for headlines. " And then I paste it in. Now it can understand and read that file because it's in HighLevel.
So this is the the unique aspect of HighLevel that no other tool has. HighLevel can say, "If I say you know, 'Add my calendar,' it can find my calendar and say, 'Which one do you want to use? '" Uh it can connect to the CRM.
Soon we also have products and payment, like order forms, where we can say like, "Find my order form and uh you know, add it to the page. " So very exciting times when it comes to the HighLevel AI Studio. Uh I wanted to share a few more designs.
So that's the meter storage with fonts. Um here's another cool thing that I said. Um if we scroll all the way, oh this is remixing the the project.
I had another one as well. I wanted to change the the colors. But um I said, "Add the craziest, the wildest, the most advanced animations you can to different sections on a page.
" And so then I said after that, after it built all the these different sections, I said, "Add a copy prompt to the right side. " So now if I want to use something like this on an AI landing page, I can just go copy prompt and add it here, build it out. Um we can go down, we can see a couple other different um different uh effects.
So some of them are gradient, some of them are hover effects. Some of them This is a scroll effect. So as I'm scrolling, you can see that it's zooming in.
Uh this one, too. Uh this is more of like a physics simulation, hover effects, 3D holographic depth. Uh cursor spotlights, very basic.
Breathing typography. Flow state in the background, it's moving a little bit. Uh scroll tracing.
This is a Uh well, just a a loop uh looped animated, you know, text effect. Interactive field in the background. Uh morphing.
Digital alchemy, this feels like a Yeah, like a live background uh video almost. Uh shatter. There's a lot of things you can do.
Uh liquid, so you can see the effect here when I'm hovering over it. And all you have to do is ask for like, what else can you build? Cre- you know, find more advanced animations you can add to it.
I like the ripple field here in the background, too. Um There's you know, this one. So, you scroll.
Uh 3D spatial gallery. This one is a little bit fast, maybe. Yeah, so um a lot of different ones.
This one is like a dashboard that's kind of flat, and as you scroll, it zooms in and it becomes more visible. And you can obviously make it like fully visible. Uh structural analy- analysis.
Layered interface architectural depth. Et cetera. And so, whatever you want to add in here, we can just say, you know, create uh create a section with modules.
Modules that uh over flows on top of each other on scroll. So, a scroll effect where they're kind of like layering. Um okay, so here's another coach fold that I modeled.
Um I cloned to see what it can do. Then we have This one is Yeah, very similar. So, you can see here Uh I tried this one both in lovable and high-level, and they're pretty equal, like pretty much the same.
So, you can see similar effects here. When I'm scrolling, it moves to the side. Um this one animates this CPU.
This one is pretty cool, this effect, if you just want to make the design a little bit more premium. This one is stacking on each other. Then we got animations, etc.
So, there we already have like 20, 30 different sections. That was the Golf Journal one. This is the AI Academy page.
Um I'm in no rush to launch the actual page. I'm just selling AI Academy through a Google Doc now. And it's because Yeah, um I'm going to build a similar uh where's my personal page?
Similar design to something like this. So, I'm I'm updating my personal brand. And you know, I'm going to use the same type of design for AI Academy.
So, yeah. Um this was another one that I modeled after a brand that I saw online, more playful with more colors. And um believe here we got the slider as well.
All of this is built in the AI studio. So, here's another one. This one is really like this one is one of those where I've added a lot of effects, as you can see when I scroll down.
This one is zooming in. Like this one doesn't feel like AI slop to me. This glitch effect makes it feel more alive.
So, we're getting close to that really good uh this one is the real estate one, Planet Vision. Yeah, we're getting close to that you know, 10 out of 10. And I think the value right now, if I just you know, talk to you for a little bit, the value right now is going to be not in just the visual design, but it's going to be knowing what to create.
It's going to be knowing what a client needs if you build for other people or for yourself. It's the offers, the strategy, the funnel type, the customer journey. It's direct response marketing.
It's branding, building a beautiful brand, building trust. It's traffic, it's conversion, it's ascension to the back end, it's creating a great product. One of the things that we talk about a lot with HighLevel is like we're a product-led, a people-focused company.
We're not a marketing-focused, a hype-focused company. We build a product that people love, then that way they recommend it to other people. So, um that's an update with a couple of tips and tricks in AI Studio.
Hopefully you like this. Uh make sure you subscribe so you don't miss upcoming videos, and I'll see you in the next one.
