The Ultimate AntiGravity Masterclass (3+ HOUR FREE COURSE)
By Jack Roberts
Summary
Topics Covered
- AI Studio Excels at Flashy Prototypes
- BLAST Framework Builds Scalable Apps
- MCP Unlocks Universal Connections
- Skills Make Excellence Repeatable
- NotebookLM Enables Infinite Research
Full Transcript
Anti-gravity is the most powerful AI coding tool on the planet right now. And
whilst most people are using it just as a chatbot, I found a system that lets you build apps 10 times faster to a way better standard. And by the end of this
better standard. And by the end of this definitive masterass on anti-gravity, you're going to be able to build six-figure web applications, animated websites, full dashboards, and so much
more. You'll even be able to recreate
more. You'll even be able to recreate any complicated workflow from NA10 and connect to powerful tools like Notebook LM. Meaning that you can unlock
LM. Meaning that you can unlock capabilities that 99% of people don't even know exist and that you can build essentially anything that you think of faster than your competitors and to a way better quality. And if you don't
know who I am, my name is Jack Roberts.
I built and sold my last tech startup with over 60,000 customers. And now I run a 7figure AI automation business.
Aentic Workflows have changed everything. And this video is the most
everything. And this video is the most comprehensive up-to-date master class on anti-gravity on the entire internet. So
feel free to bookmark this. I've
timestamped everything down below so you can come back to it. And with that in mind, grab that coffee and let's dive straight in. So welcome to the beautiful
straight in. So welcome to the beautiful anti-gravity masterass. Now, as you may
anti-gravity masterass. Now, as you may know, anti-gravity is huge. It's a
pretty big deal. It is essentially Google's new coding app that launched very, very recently. Now, the best way to explain this is to think that Microsoft Word is for documents. Excel
is for spreadsheets. Anti-gravity when
we talk about that is basically just about building software and any software you can imagine for example AI apps websites it can be your personal Jarvis AI systems and you also get access to
Gemini claude and chat GPT so some of the world's premier models within anti-gravity and it's basically an agentic first coding environment that's its kind of main USB now you can build
within anti-gravity beautiful UI dashboards and the thing about great UI dashboards is that they are the translation layer between really complicated data or complex data and
better decisions. And anti-gravity lets
better decisions. And anti-gravity lets us turn that data into beautiful dashboards as an example. Now, you're
even going to learn how to build gorgeous animated websites. For example,
just like this one. Now, this entire thing that you're seeing right now, this beautiful midnight sky, this button effect here, this hobbit over here, all of this was built within anti-gravity.
Every single part of it, even this slider here for the reviews, I come down and this animation right here, again, you might have guessed it. I have no coding background. I did this entire
coding background. I did this entire thing in anti-gravity with the exact same principles that I'm going to show you in this video. And it even lets you create an account on the website using all the skills that you're going to learn in this video. And the truth is
that most websites you see suck, right?
They're either tractors, which means they get the job done, but they don't look very great, or they're Ferraris, which look amazing, but they have no engine. They look flashy, completely no
engine. They look flashy, completely no value. But we want a unicorn, which is
value. But we want a unicorn, which is great design and it's functionality. And
we're going to learn how to do unicorns in this video. On top of that, you're going to learn so much more that people don't even know about anti-gravity. And
you're also going to learn skills within anti-gravity, which basically means any great work, any automation, any system that can essentially automate anything you want to. From lead scraping, lead generation, creating content, you
literally name it. We can build this with an anti-gravity now. And skills let us make that great work repeatable. It
saves us on context windows. It makes
them sharable and scalable. The stuff
we're going to go into in this video explaining exactly what skills are technically, but essentially, we can create skills for anything. onboarding
systems, database migrations, competitive intelligence systems, design protocols. It's just like being in the
protocols. It's just like being in the matrix. And you're also going to use
matrix. And you're also going to use exactly how to use skills, when to use skills. I'm going to give you my top
skills. I'm going to give you my top five skills as well in the video along with all the resources going to be available down below if you in the description. Now, as you'll know, most
description. Now, as you'll know, most coded apps, which do many different things, are broken. They look really bad. They don't work. But we're going to
bad. They don't work. But we're going to cover a proven system in this video that basically lets you build full stack stuff. Now, you might be wondering,
stuff. Now, you might be wondering, Jack, what on earth is full stack? Well,
it's basically the front end and the back end together. So the front end is all about making it look beautiful and the back end is about making it functional. Anti-gravity does both those
functional. Anti-gravity does both those things. My last startup for example, we
things. My last startup for example, we had to hire people who were full stack developers or backend developers, front end developers. Anti-gravity does all of
end developers. Anti-gravity does all of this. And I want to give you just a top
this. And I want to give you just a top level overview here about all the amazing stuff that we can do with anti-gravity that you're going to learn in this video. And that's not all, says Fry from Futurama. You're also going to learn how to integrate over 150 models
within anti-gravity. Some of them
within anti-gravity. Some of them completely from free as well. So you can save money and power up your building and build faster than anyone else.
Anti-gravity is a coding app, right? And
the best way I want you to think about this when we think about different models like this is that anti-gravity itself is kind of like a fighter jet.
It's like an environment. So there are many different options that you could use. So we're using anti-gravity. You
use. So we're using anti-gravity. You
could use something called cursor. You
could use windsurf. You could even build in something called the terminal. These
are what we call your fighter jets, but we're choosing anti-gravity for a few different reasons. And the model that we
different reasons. And the model that we use. So Claude Chad GPT Gemini is the
use. So Claude Chad GPT Gemini is the pilot. So when you hear expressions like
pilot. So when you hear expressions like Claude code, Claude is just the model.
All they're talking about is the fighter jet pilot, not the actual plane itself.
We're talking about the plane and we'll use any of the pilots we want to. And so
the two models that you get with anti-gravity natively are Claude and Gemini, but using open code, as I'll show in this video, we can get access to 150 different models. How we build is
fundamentally changing cuz there's been a huge shift. We can now essentially create automations with our words. Why
don't we take a live example? So, for
example, if I want to scrape the number one AI newsletter, what is the easiest way for us to do that? Well, previously
we would build a really big workflow. We
spend a few hours. We'd watch some tutorials, learn how to do it. And that
required both skill and time. But now,
you can literally just type it into a search bar and type it and build and get amazing AI systems. This is an example of that very thing that I built, just basically talking to anti-gravity. But
what is really happening here? Well, if
you think about it like this, this is important context to understand the big shift that led to the moment. These
platforms here are integrators, okay?
And they connect things to other things basically. Now, Claude and Gemini are
basically. Now, Claude and Gemini are the executors, right? Said another way, it these connect things and this actually does a thing. This executes for us. Now, 6 months ago, if you're on
us. Now, 6 months ago, if you're on YouTube or anywhere else, you would have seen that workflow builders were everywhere and then we had the rise of Vive coding and now we have anti-gravity that can basically do everything for us.
So instead of building out a scenario like this, we just say, "Hey, build the thing, please." And what anti-gravity
thing, please." And what anti-gravity does, which is really cool, is it connects to all of our applications. And
when you connect anti-gravity to anything once you get something in anti-gravity, you can essentially do anything. We can also create parallel
anything. We can also create parallel agents, which means that we're no longer limited to one terminal. We can have 8, 12, 40, as many agents as we want to working in parallel building on our
projects. And the use cases from NAN and
projects. And the use cases from NAN and make. Let's think about these actual use
make. Let's think about these actual use cases for a second. It's a way to talk to a lot of services. It's a place to run things on a schedule and it's a way to glue steps together and also do some basic error handling. But anti-gravity
actually does all of those things now plus it thinks. On top of that, you can also chat with it about various different things which is very cool. So
with that in mind, I found the best way to learn this software is to actually build something together. Now the first thing I want to do is get you your first app developed and built. And we're going to do this in the cloud. So you don't
even need to touch anything on your desktop because if you've never built an app before, it can feel a little bit overwhelming and I want to get you your first one. So if you've already done
first one. So if you've already done that, feel free to jump ahead. But I'm
going to build the first one with you online, step by step in a very quick, easy way. And then once we've built this
easy way. And then once we've built this application, we're then going to head straight over to anti-gravity and start building. Beautiful. Now to build one
building. Beautiful. Now to build one online, there are lots of different options. The one that I'm going to show
options. The one that I'm going to show you is one that I actually first got started with, which is Lovable. They're
crushing it now on the market. you'll
find it really easy. And one of the cool reasons of using Lovable is the integrations they've got natively built in. So, I always say if it's your very
in. So, I always say if it's your very first time ever building an app, I typically say Livable is great. There's
obviously some really cool options, but this is the one that I started off with and really good to help you understand how to build your first app. Now, pretty
much all we do is chat to it and it builds for us, which is really cool. So,
let me show you the concept of how we build an AI app. Now, what I want to do with this one is build, let's say, a canban board. And again, we're not even
canban board. And again, we're not even going to use any of the systems yet.
This is just to show you how this works and how easy it is. I want to build a canban board. So, let's click on the box
canban board. So, let's click on the box and give it a cool prompt. Hey there,
dude. What I would like you to do for me is go and build a canban board. I would
like it to have the following features.
I'd like to be able to have a complete, let's say, a to-do and in progress. And
in fact, what I'd like you to do first of all is ask me questions to clarify your understanding just to make sure we crush the features down. I want the design to be gorgeous and interactive. I
would also like to have an integrated AI chatbot that I can ask questions to at any time. I want to have that in there.
any time. I want to have that in there.
And I also want the ability to save this information in a database so I can come back and use it whenever I want to in the future. Awesome. So, I've given it a
the future. Awesome. So, I've given it a pretty cool prompt to do this. By the
way, I'm using Glido, our speechto text starter, but just launched in beta. It's
very cool. So, I'm say the fastest in the world right now, which is decent.
And what I'm going to do is go into plan mode, which again, this is just like building on easy mode. Click on plan mode so we can get back and forth. But
before we do that, let's actually give it a little bit of design guidance. So,
we're going to go so deep into design this video. I hope you're ready. Like,
this video. I hope you're ready. Like,
we got our AI designers everywhere. So,
these apps are really good at basically creating a front end quite well. And
you'll notice anti-gravity really excels in building super scalable stuff architecturally. And these front ends
architecturally. And these front ends things are incredible for these getting your first prototype out. So, what I want to come on dribble, it's basically like a design interface. We can find things. Let's go down for if I type in
things. Let's go down for if I type in something like canban. And canban is just a cool easy product to-do list.
Very very decent. Let's come and have a quick look to find one that we think looks really cool. So basically whenever you're building with these apps and again this is just dead simple. It's
just an idea. You can pretty much do anything you want to. We'll try to find inspiration. So I really like the look
inspiration. So I really like the look of this one. I mean it could look a little bit better but I think it's not very high color. So we can copy this image. We can come over to our platform
image. We can come over to our platform and drop that in. Bam. Beautiful. Then
we can go back out of it and let's find another one. This one's really cool.
another one. This one's really cool.
Yep. Grab that. That's a little bit better perhaps. Come back over and drop
better perhaps. Come back over and drop it in. And then we say, "Awesome. I'd
it in. And then we say, "Awesome. I'd
like you to build it in the desire in the, you know, use the reference images as your design file." Beautiful. Once
that's done, I'm going to hit off and hit enter. Now, fundamentally, when
hit enter. Now, fundamentally, when you're building an AI app, I've got a full system to make it very easy. But
fundamentally, this level is just sort of explain the thing that you want, give it design references, and then all you're ever going to do is just spar with it, chat with it on the left hand side, and effectively goes ahead and builds it for you. Now, one of the
reasons that I am using Lovable as your first instance is because you'll get a taste and a flavor of basically Belovable Cloud integration. So, Lovable
doesn't require you to add any API keys or any dashboard access. You can connect that obviously. So, it's like a
that obviously. So, it's like a first-time beginner just wanting to get your first thing built. It's easy. And
obviously, I'm going to show you everything in this video step by step, take you from zero to her anti-gravity.
But, if you've never built before, first thing is first is let's get your first thing live so you understand just the kind of process and feel of it. and you
have what I call this magic moment where the first thing gets live and you're like okay cool I kind of get it now then we go deeper down the rabbit hole okay beautiful so now we've got a couple questions to come back and you'll notice this is a common feature place this idea
of planning so sparring with the AI to build up some what columns do you want our canban board I think to do in progress makes sense what information should each task display title only title description due date let's go for full details cuz we're we're nothing if
we're not specific right what should the AI chat about help you with I think create tasks could be cool let's do both actually let's make it super powerful And then again, we can pick the theme that we want to. I quite like dark sidebar. I think that's really nice.
sidebar. I think that's really nice.
Let's go for that one there. Cool. And
then we've got a couple more, which is it's going to be for myself. I'm just
building it for my beautiful self. And
then click on submit. Beautiful. So now
it's done that. We are now going to be ready to rock and roll, which is why I've now taken him out of plan mode. And
now look at this. So let me bring this over so you can have a good look at it.
So we've got the enable cloud, which is built-in backend storage or and ready to use, which means that we're going to be using lovable cloud. That's one of the things that they simplify to make it easy. Add an LM to our app. Free start
easy. Add an LM to our app. Free start
page scale. Sounds cool. Let's just
allow and get started with that. Again,
building your first app is a really cool experience. You get to see the wonders
experience. You get to see the wonders of what's possible and it's very very decent like that. Cool. And they've got some cool stuff like you can edit visually as well, which is really decent. And then as well as building, we
decent. And then as well as building, we can see the progress on the left hand side. So it's built building or system,
side. So it's built building or system, canban board, AI chatbot, and styling with dark sidebar theme, which is really cool. So you can see the progress on the
cool. So you can see the progress on the left. It's enabled relevant security,
left. It's enabled relevant security, which is code for just making sure and you're going to see in this video as well, databases and how this all connects together really beautifully because when it comes to any full AI system, right, we have the front end looks awesome. We've got the back end
looks awesome. We've got the back end does the automations, but then we also need a place to store that data, right?
Could be Superbase, could be the cloud, could be several different locations, but it's a really important component of what it means to build these systems in this kind of beautiful AI future that we're heading into. Beautiful. And now
we've even got a signin bar. I don't
know if I asked for a signin bar, but we got going anyway cuz they're adding an extra value. It's cool. So, we can check
extra value. It's cool. So, we can check this out. Let's log in and sign up.
this out. Let's log in and sign up.
Let's call it like Jack R. Give an
email. Jack at Well, let's give my real email and then we can give down a cool password here. Let's give one that we're
password here. Let's give one that we're never going to forget. and click on create account. Beautiful. We'll save
create account. Beautiful. We'll save
that. And then we've got a canban board.
Cool. I'm I'm liking this designable f.
That's actually really tasty. And then
let's add a task. So come down, add a task. Why don't we call this one
task. Why don't we call this one something like dog shelter. Okay. Find a
best not by and give a donation. Okay,
cool. So I'm giving some things here to do. I'll put that. It needs to be done.
do. I'll put that. It needs to be done.
Category can be personal. Due date.
Let's be bold and say we're going to do that tomorrow. And I reckon that's going
that tomorrow. And I reckon that's going to take like maybe 60 minutes to do. And
then we create the task. Cool. So does
this appear? It does. And we can drag and drop and put that in progress.
Decent. Okay. Nice. Well, we probably want to add one more field, which is cool. I like that. And then we got an AI
cool. I like that. And then we got an AI assistant. And then we can ask it
assistant. And then we can ask it questions. So, let's just say, "Hey
questions. So, let's just say, "Hey there, dude. What do I have in my to-do
there, dude. What do I have in my to-do list today?" All right. Cool. Let's see
list today?" All right. Cool. Let's see
what he comes back and says again. I
think what's really cool about this is I've not entered any API keys. Very
easy. One to do task in a great situation. Could you edit my to-do list?
situation. Could you edit my to-do list?
And I just want to add a dog emoji at the beginning of the to-do list, please.
Okay. So, let's test out this AI assistant. See how good he is. And I can
assistant. See how good he is. And I can use him to build things. I can yap at him, do different things. I can
certainly happy with that. Since my
assistant, happy with actions. I'll
create a new task for the formatting.
All right, cool. So, let's go back over to the board and check out what that looks like. Walk the dog, pet cat. He's
looks like. Walk the dog, pet cat. He's
created a brand new one, which is awesome. And it's due on that day.
awesome. And it's due on that day.
Really freaking cool. I like that. And
then basically we can pop out and then I can give it some things like, hey dude, what would be really cool is if could you add a third category which is going to be complete. What would be decent is if I drop the let's say the actual action into that section. A bit of
confetti would be awesome. I mean, let's step up the design a little bit. Let's
get a bit of vibrancy. Let's get a little bit of I don't know, some color and just like obviously something looks tactful, but just I want it to be gorgeous when I look at the actual cambans themselves. All right, we give
cambans themselves. All right, we give it a little bit of something like that.
Ready to rock and roll. Oh, I'd also like the AI assistant to be able to edit existing ones if I want to. All right,
cool. And send that one off. Decent. And
we just send Libble off. It comes work in the background. But you're kind of getting now the idea of what it means to vibe code that you basically yap at things. It goes ahead and does it and
things. It goes ahead and does it and then we can use it, which is freaking awesome. Cool. So now it's working in
awesome. Cool. So now it's working in the background. The migration status has
the background. The migration status has done. So what it's done now is actually
done. So what it's done now is actually gone ahead and modified the database. So
you're going to see now what the incredible place we're at now in 2026 is that you can actually connect these databases to AI. So you don't even need to think about it. It just kind of does it for you, which is crazy. Cool. And
then this is loading back up and it should be done in just a moment. It's
just going to do a little bit of polishing, a little bit of add a little touch of color and flares and various different things. And just like that,
different things. And just like that, we've now got the completed version which is follow my instructions. We can
click back off and let's take a look at this. So we've got in progress
this. So we've got in progress completed. Let's say that we bought the
completed. Let's say that we bought the dog. We bought Dexter and we say that's
dog. We bought Dexter and we say that's actually completed and we get the confetti. Bam. That's what I'm talking
confetti. Bam. That's what I'm talking about. So, let's come over to the AI
about. So, let's come over to the AI assistant and give him a prompt. Hey
there, dude. I have a task for the dog shelter. Could you actually just make
shelter. Could you actually just make that maybe 120 minutes instead of 60 minutes? Okay, cool. So, the idea with
minutes? Okay, cool. So, the idea with this is we could like ask it to do very similar things like build out a to-do list, make different connections, different apps. Like you get the idea of
different apps. Like you get the idea of how cool this is. Cool. Let's update the task. Decent. Let's go check it out.
task. Decent. Let's go check it out.
Come over here. Dog Shuttle is now at two hours and it's completely done. I
can move things over. Easy. Super duper
easy peasy. I just yapped. I moved
things and then it freaking happened.
And so now you built your first app. A
huge congratulations. Hopefully you had a lot of fun with that. The next thing I'm going to do now is download anti-gravity and begin the anti-gravity magic. But to do that, I have to show
magic. But to do that, I have to show you one really important concept whilst we download anti-gravity and everything that you need to be rocking and rolling and to be set up for the future. So if
you haven't already, you're going to head over to this website which is anti-gravity.google.com
anti-gravity.google.com and you're going to go ahead and download anti-gravity. is super duper
download anti-gravity. is super duper important. One of the thing I'd love you
important. One of the thing I'd love you to do as well is to go ahead and download the Claude app. If you don't have on your computer already, it's going to be very very handy for you. And
then the other thing that we need to download is and there's only third thing is node.js. If I say download node.js
is node.js. If I say download node.js but the good news is anti-gravity can do this for us and as I'm going to show you in a second. This is the wonders of it.
Okay. Now once you've downloaded anti-gravity it will look a little bit something like this. So you click on this and you'll see the wonders anti-gravity. And when you open
anti-gravity. And when you open anti-gravity it will look a little bit something like this which is wonderful.
So in anti-gravity, you open it as like projects. So think of them instead of
projects. So think of them instead of the cloud like we just built. These are
things you're editing on your computer now, which is really cool. So what
you're going to do here to open up any workspace is file, open folder. You're
going to create a new folder. And then
basically you're in it instantaneously.
So I come down to open folder. I click
on new folder. I call this XYZ. I click
on create and then click on open. And
all of a sudden I'm in this folder. But
the question is, what if we've just built an app online on Lovable or maybe AI Studio, Google's version, and I want to get it into anti-gravity to edit.
Well, how do we do that? Well, great
question. So glad that you asked because if I head back over now to our thing here, it's like fundamentally all this is, and you can see this here, is code.
That's it. You can see all the code on the left hand side. And when we talk about websites or apps, we're just talking about code. So what we need to do is take this code and put it somewhere. We need to get that code onto
somewhere. We need to get that code onto our laptop. So the way that we would
our laptop. So the way that we would physically go ahead and do this, I'm going to close it for a second. As you
see this mysterious cam in the top rightand corner, this is GitHub. So
you're going to create a brand new fresh account in GitHub. You can click on connect to GitHub. I'm going to do this over here. So let me explain what GitHub
over here. So let me explain what GitHub is in simple language. If you've never come across it before, it make perfect sense. So GitHub, if I open this up and
sense. So GitHub, if I open this up and just show you. Basically, if you think about this like it files, when we publish applications and apps online, we need a place for those files to live, a repository, like an Alexandria's library
of of all the cool stuff that's happening. So, the idea is that when we
happening. So, the idea is that when we build apps, what we're going to do in anti-gravity, if we publish it, is store it in GitHub. And GitHub becomes the single source of truth for all of this stuff, which is amazing, which is why we
use GitHub, and that's where we get our files. But it also enables us when we
files. But it also enables us when we build an apps, we throw it into GitHub, we can access it anywhere. So once you create an account with GitHub, you click on connect GitHub. This will open a new window and we basically what we call an
oorthth sign in which is we just open and authorize. It's super easy. We're
and authorize. It's super easy. We're
going to give it access like so. And we
click on continue which is beautiful.
And click on connect. Fantastic. Confirm
transfer two-way sync. We're happy with that. Transfer that anyway. And this
that. Transfer that anyway. And this
will work with any online version whether it's uh Bolt or AI Studio like you know which is anti-gravity version online. There's a million different ways
online. There's a million different ways you can do it. So we set it up as a GitHub repo. We click on view and almost
GitHub repo. We click on view and almost by magic. Does this code look familiar?
by magic. Does this code look familiar?
Well, it certainly should do. So, you
come over here. You're going to click on this code. Now, the only button that you
this code. Now, the only button that you need to know. Now, this is set as private. So, let me show you one cool
private. So, let me show you one cool thing. You're going to click on
thing. You're going to click on settings. This where you manage the
settings. This where you manage the settings for your things. And you come all the way down. And what I want you to do again just to keep it simple for the time being is click on change visibility, change to public. All right.
What this now means is that if I share the link of this repository that we have, anti-gravity can download it instantaneously. Now, the truth is
instantaneously. Now, the truth is anti-gravity can download it even if it's private anyway by connecting it.
But I just want to keep it really simple for this for the time being and no one's really going to be searching it in in like the two seconds that we created it anyway. So, all we're going to do now is
anyway. So, all we're going to do now is you're going to click on code. You come
over here and I just want you to click on copy and paste. That's it. Then head
over to anti-gravity, come into the chat window, and we're going to say, "Hey there, I want you to clone this repo and then open it up in a local host." And
now what do I mean by local host? Well,
just because on your computer now, it's your computer that's hosting it. And so,
just paste URL in and then it'll go ahead and do that for you. And one
interesting one to call out here, guys, if it has dependencies, like if the online version of the app has built something that this doesn't have, it will go ahead and install those for us.
Beautiful. So, now it's just loaded there. Let's give this a click and find
there. Let's give this a click and find out what's happening. So, open up the local host and then we have a login section. So, let's click on sign up and
section. So, let's click on sign up and we'll give a random name, random email atoutlook.com, and then a random password and click on create account for instance. Give the hot second and then
instance. Give the hot second and then just like that, we now got this local host. So, and so the cool thing is now
host. So, and so the cool thing is now because this is an anti-gravity, we can make any changes we want to. So, we
could say instead of task flow, why don't we call it, I don't know, change from task flow to bing flow and change purple to I don't know dark obsidian.
Let's see if it can understand what dark a dark obsidian is. But the idea is it will now go ahead and make those changes for us. And on the left hand side guys,
for us. And on the left hand side guys, you'll see that all the modules that we use in loadable do appear there for us as well. But I will say that if you are
as well. But I will say that if you are building it an online app, you want to use Superbase and configuring Superbase and bring it in versus like native cloud platforms. So you have full configurability. But again, anti-gravity
configurability. But again, anti-gravity can make any of these changes you want to. You basically speak to it and it'll
to. You basically speak to it and it'll do that. But essentially what you've
do that. But essentially what you've done now is built this incredible app online. You bought it into anti-gravity.
online. You bought it into anti-gravity.
You've installed it and now you know how you can make changes to it based on your local computer which is the foundation of anti-gravity. And we can see now
of anti-gravity. And we can see now anti-gravity making changes on the left hand side. And then we can check the
hand side. And then we can check the updated version. And so just like that,
updated version. And so just like that, it says it's now running. So let's go check that out. We click this up and would you believe it? Bing flow and it's completely charged. And that is the
completely charged. And that is the premise of how everything works now in anti-gravity. And so the best way to
anti-gravity. And so the best way to learn anything within anti-gravity is to actually build an app. Now to do that, we're going to use my five-step blast framework which I use for building any
application, website, software, you name it and anti-gravity, which is going to take the quality of your builds from this to interstellar. Beautiful. So this
is the blast master prompt. So let's go through the idea of it. The identity is that you are a system pilot. This is
anti-gravity. Your mission is to build deterministic self-healing automation in anti-gravity using the blast framework which is blueprint link architect style and trigger protocol and the ant layer
architecture. So we start off with
architecture. So we start off with protocol zero. I'm going to put a link
protocol zero. I'm going to put a link for this down below so you can grab it and have a rock and roll good time with it. All you're going to do is literally
it. All you're going to do is literally copy all of this like so. Going to head over to anti-gravity and what we're going to do is just basically cleanse a project. So let's create a brand new
project. So let's create a brand new project together. Click on file. Click
project together. Click on file. Click
on let's go for open folder. Click on
new folder and let's call this one scraper with loads of ours and click on create. Okay, cool. And then open the
create. Okay, cool. And then open the folder. So now we're in a brand new
folder. So now we're in a brand new environment scenario. So first thing to
environment scenario. So first thing to bear in mind is that of course as always we can have the conversations with anti-gravity on the right hand side.
Little thing you can do in the middle by the way if you've installed this claw thing is you can double click and then you see this claw thing here. This opens
a cloud code instance which is really freaking cool. Now before I post this
freaking cool. Now before I post this prompt in I want to show you one thing about anti-gravity you'll find helpful.
So, anti-gravity has two views. We have
this view that we've come to love and appreciate. Again, if you ever want to
appreciate. Again, if you ever want to move a position of something, you can right click and you see the position.
You can basically decide where you want it to be, which is really cool. So,
cool. It's very decent. Let's come down and just remove this guy for the moment and click off this. So, you've got what we call the main view. And then if you click on agent manager, you've got this view, which is really cool. So, one
thing a lot of people don't know in anti-gravity is that every workspace or project that you create basically becomes something here on the left hand side. and you can start on your
side. and you can start on your conversation that and this is where we get to the point that we call parallel agents. So you can have four, five, six
agents. So you can have four, five, six different agents all working on your project at the exact same time. So for
example, I've got dashboard UI here. I
can have two different agents doing the same thing. So we're in here. So what
same thing. So we're in here. So what
we're going to do is start a new conversation in and then you're going to select your thing or on the top left come here start conversation and we're looking now for scraper. So we just type in scraper and we should find that near
the bottom. Cool. So might just say hey.
the bottom. Cool. So might just say hey.
All right. Cool. So, what I could do with this, technically speaking, is I could open up as many of these windows as I want to. So, I could say, "What day is it?" In reality, I might say to one
is it?" In reality, I might say to one of them, "Hey, do a review of the design." And another one might be, "Hey,
design." And another one might be, "Hey, quote me a file that does XYZ." And I can have literally almost like as many of these separate conversations as I'm doing. And so, this can go on and on
doing. And so, this can go on and on like in add item basically. So, we can have all multiple agents doing things for us at the same time. If you've got like a second screen, which I recommend when you get into this stuff, you can
actually manage them all in the inbox.
If I click on inbox, when they've all come back with different questions and stuff, I can basically say tick tick tick. That's fine. Approve it. So you do
tick. That's fine. Approve it. So you do everything from just one window. And
then whenever you want to come back, all you're ever going to do is that you come over here and click on open editor. And
that's how you can get between the two walls. Awesome. So now you've got that.
walls. Awesome. So now you've got that.
Now let's build this one together. So I
want to show you something really cool.
So let's come down and you can delete conversations down here. Very, very,
very different. So, what I'm going to do is I'm going to use I show you something cool you can do with an anti-gravity team. Occasionally, if this gives you
team. Occasionally, if this gives you any trouble, it shouldn't do, but if the agent fell for some reason or they're doing an update, you can just chat with Claude inside. So, what we can do is
Claude inside. So, what we can do is double click in the middle, click the Claude icon here, and now we've got Claude code roads rock and roll. So,
what we're going to do now is paste in that entire prompt. So, come down here and paste in everything like so, and it will go ahead and get started. So, it's
going to follow the blast framework.
Now, section zero on blast framework, we bring it up, as you can see, is to initialize the project memory. It's
going to create a task plan MD so for phases goals and checklists a findings.mmd for research discoveries
findings.mmd for research discoveries and constraints what was done errors test and results and then initialize which is a gemini.md
just stands for markdown basically as the kind of project constitution so like data schemes behavior rules architectural invariance and then execution so the idea is it's going to create folders for us now on the left
hand side to build all this stuff out which is really cool and then effectively what it's going to do is then wait for us to come up and ask it to do something. Now, I've just pasted the exact same thing in the right window. So, let's go ahead and use that
window. So, let's go ahead and use that one for this project. So, it's within the native system within anti-gravity, but just to show you, you can spin the same thing up with claw by using that window there, which is really cool. So,
now that's complete. Let's get down here and see what we're going to do. So, we
got the five discovery questions, Northstar integrations, source, truth, and delivery payload. And then it's got a task list here of things that it needs to do. Cool. So, I'm going to say
to do. Cool. So, I'm going to say awesome. Please execute protocol zero
awesome. Please execute protocol zero once I've given you the blow information. So this is the point now
information. So this is the point now where we're going to give it basically a prompt of the thing we want to build.
Now we can build anything we want to but I thought it'd be cool if we could build something that would let's say and again replace this with anything you want to in your business for instance what we typically want to do is start with the biggest bottleneck like what's the
biggest bottleneck in your business and then actually build processes around that. So let's say for example one of
that. So let's say for example one of the things that you wanted to understand was like viral trends and viral outliers. So often times we can use
outliers. So often times we can use Reddit to do this. We can use various different resources. So, I think we
different resources. So, I think we should build a viral trend outlier and let's get anti-gravity to not only build that but go ahead and get the research for us. So, and then we're going to
for us. So, and then we're going to basically explain to explain this to it in plain English. So, let's see what the questions are. So, the questions are
questions are. So, the questions are what is the singular desired outcome in plain English. Awesome. I would like you
plain English. Awesome. I would like you to build for me a beautiful interactive dashboard and in that dashboard what I would like you to do is to present information from me from various
different sources. I want you to collect
different sources. I want you to collect for me and display, let's say, the latest articles from the last 24 hours from a series of sources. For example,
Ben's Bites or the AI rundown and maybe also on Reddit, but let's just start with the newsletters is just a brief example. The source of truth, the
example. The source of truth, the integrations that you're going to need.
I'd like you just to go online and build a scraper for that initially. So, no
need to do anything else yet. We will
ourselves add further integrations as we build this out and add layers of complexity, but we're just going to start off with the basics. the source of truth. I'd like it to exist within the
truth. I'd like it to exist within the website. We are going to connect to
website. We are going to connect to dashboard, but we're going to do that later. That will be to superbase. Again,
later. That will be to superbase. Again,
I'll touch on that momentarily. So,
basically deciding all the different connection points that we want for the entire thing. After that, the delivery
entire thing. After that, the delivery payload should be I'd like it to essentially run every 24 hours. And if
there's new data, new articles, show them. If there isn't, forget about it. I
them. If there isn't, forget about it. I
would like the ability to save those articles. And if I refresh, all my saved
articles. And if I refresh, all my saved articles should be there, as well as all the data that you've brought forward.
First of all, I'd also love the designs to be gorgeous, interactive, and look beautiful. Awesome. So, we give it all
beautiful. Awesome. So, we give it all information and then we just lally send off that like that, which is really cool. And then what I'd recommend you do
cool. And then what I'd recommend you do is put it into plan mode. Uh, at least for this stage, so it can actually spar with you a little bit. One of the things we learned from the founder of Cloud Code, who you basically uses this in is
that having plan mode is really really important. I found that my experience
important. I found that my experience too in terms of really getting out the specifics from anti-gravity. So, this
will go ahead now, plan everything out, create the files from the left hand side, and then we can start beginning to create any uh application that we'd like. And whilst it's doing that, let's
like. And whilst it's doing that, let's head back over to Dribble to get some inspiration for our dashboard. Wouldn't
that be really freaking cool? One of the things we can do if we want to, let's say that, you know, okay, you could have, for example, your own brand like this, which is Glider, which is really cool, our speech tech startup. Let's say
that I want to build a dashboard out in their style. How do I get it? Well, if
their style. How do I get it? Well, if
you have your own brand or a brand that you like, you can upload your brand guidelines to anti-gravity. But if you don't have them, one of the things you can do is head over to filecrol.dev. And
again, I'm going to show you different aspects like this in this video as well where we use this in different ways. But
if you come over here to playground like so. And what we're going to do is simply
so. And what we're going to do is simply enter in the URL. So glider.com.
Actually, let me just come back and do one more. Instead of markdown, let's
one more. Instead of markdown, let's come down to I believe we want branding, which is cool. And this will basically scrape all of the information about the brand for us like the typography, all that sort of stuff. And look at branding's appeared there. And look at
this. This is freaking so cool. So what
this. This is freaking so cool. So what
I can do is literally copy this here. I
can come back over here. I can create a new folder. Just come down and click on
new folder. Just come down and click on new folder. And we'll call this one
new folder. And we'll call this one design guidelines. Like so. And then
design guidelines. Like so. And then
within our guidelines, let's open up new file. And we'll call this one brand
file. And we'll call this one brand guidelines. Cool. And in guidelines, we
guidelines. Cool. And in guidelines, we popped it down like that. Awesome. And
then why don't we also add in our logo.
So we come down here and let's just drag the logo in from our computer. So there
you go. I'm dragging this one over here, which is cool. I've got the Glido logo and I'm just going to bring that into the design guidelines which is really cool. Then what we could do is get
cool. Then what we could do is get something that we think is really interesting from a design point of view.
So let's go and find one maybe on dribble or something. So why don't we go for dashboard and then we can have a quick look at all the dashboards that we think are really interesting and really decent and find something that we would like to emulate. And let's have a look.
I think this one's really cool, but we kind of want something that's a bit more information, right? So we want something
information, right? So we want something where we can see the data coming all the way through. So, I think probably
way through. So, I think probably something along the lines of this looks quite cool. We got some cool visual
quite cool. We got some cool visual panels. Yeah, I think that's nice, but
panels. Yeah, I think that's nice, but it's not really too information dense.
Okay, so say you like the look of this one, for example. This is pretty cool, pretty interesting. I like the way the
pretty interesting. I like the way the panels laid out. So, let's say we want to copy this one. I'm just showing this as an example, right? But effectively
find the design inspiration that you like. And then we should be able just to
like. And then we should be able just to paste this in. That is cool. And then we just drop in image.png, which is decent.
And then we can just rename this to be design inspo, right? So, come down and let's rename. And we call this one
let's rename. And we call this one design inspo. Awesome. Cool. Now that's
design inspo. Awesome. Cool. Now that's
all done. We're going to accept to those changes. And then what we're going to
changes. And then what we're going to say is we're going to an at sign and then we're going to add and there's one thing you can do your file. Right. So if
I design guidelines right there, we can now chat to that. I would like you to build it in the basically ascribe design profile. So I've given you my logo, my
profile. So I've given you my logo, my brand design guidelines, and then some design inspiration also. And so as you can see now phase one has been about the following which is the northstar. So our
desired outcomes, the integrations that we want to have within there, the source of truth, the delivery payload and the behavioral rules. So before we design
behavioral rules. So before we design any project, you really want to think about, well, what integrations do I need? Is it Slack? Is it Telegram? Is it
need? Is it Slack? Is it Telegram? Is it
going to be, you know, Appify or Reddit?
We can pick those specific ones that we like. And then also behavioral rules.
like. And then also behavioral rules.
And obviously, we've given it a data first rule, which is you must define the JSON data scammer, the research, and we've given that now to anti-gravity.
And it's also ready to go. And so now we've completed the first step, which is to outline the thing that we want in plain English. The next thing we need to
plain English. The next thing we need to do is actually connect it. So, for
example, if you and I building a house together, right, and we've got the beautiful blueprints, it looks awesome.
We're getting our amazing furniture in there, but the house isn't connected to the outside world. It doesn't have plumbing. It doesn't have electricity.
plumbing. It doesn't have electricity.
We'd probably not really be able to do too much. So, the idea here is that we
too much. So, the idea here is that we want to connect anti-gravity to all the resources and tools that we need to enable it to actually physically do its job. And that's why the second step in
job. And that's why the second step in our blast framework stands for links.
So, to do links, first of all, we need to tell it to follow the design guidelines. And whilst it starts to work
guidelines. And whilst it starts to work on that, we can now start to think about how we connect everything to it. So now
we basically explained everything we want to what we need to do and you'll notice beautifully now look at these findings.md gem. MD progress MD all
findings.md gem. MD progress MD all these wonderful and beautiful things.
What we're going to do now is it connections and this introduces us to the very first very cool part of anti-gravity which is called MCP also standing for model context protocol. So
the way I want to think about model context protocol is I'll grab this so I can show you. It's basically like a universal remote control. It's a
standardized language that lets anti-gravity or any AI app talk to anything else. So for example, you might
anything else. So for example, you might say that the NA10, right, which is a no code building platform, has an MCP.
Firecrawl, which looks at your meeting nodes, has an MCP. And when you connect anti-gravity to these MCPS, effectively they can do anything that you can do through an API very, very simply without it being very complicated. So what we're
going to do then is click on these dots over here, guys. And you're going to see once you do that, you're going to see MCP servers. So, a couple of things to
MCP servers. So, a couple of things to bear in mind is going to a full list at the MCP store. So, we can say whatever we want to connect to here. Now, what
we're going to need to connect to in this video is Superbase. So, I'm going to type in Superbase. I'm going to go very deep into all the MCPs, but you can see Superbase lets us connect to projects because if you think about it
from this point of view, we're going to have a front end. We're going to have a back end which kind of automations and systems, but we're going to need a database, right? But we need somewhere
database, right? But we need somewhere to store that information. You know,
Excel is like the primitive version of it. Superbase is like a Microsoft Excel
it. Superbase is like a Microsoft Excel has been hitting the gym and crushing it. So, we want to connect to Superbase.
it. So, we want to connect to Superbase.
So, this is a dashboard that's worth learning. And when you do that, you're
learning. And when you do that, you're going to see something that looks like this. So, all you're going to do is come
this. So, all you're going to do is come down here to configure and you're going to click on Superbase access token. So,
this is a great time to understand exactly what Superbase is and what it looks like. So, once you create account,
looks like. So, once you create account, you're going to see something like this including generate new token. I'm going
to call this one something like anti-gravity scraper. I'll put the
anti-gravity scraper. I'll put the expiration date for an hour, maybe for a day. But basically, yeah, I'll I'll
day. But basically, yeah, I'll I'll delete this token afterwards. But you
click on generate the token like so.
That will load up for us beautifully.
And then you're going to copy the token.
That's it. And all you're going to do is swing back over to anti-gravity and then paste this into your Superbase access token. And then click on save. That will
token. And then click on save. That will
then save to what's called your MCP configuration. Sounds very fancy, but if
configuration. Sounds very fancy, but if I click X on this and actually we open and basically if you ever lose it, just do command L uh and it'll bring it back.
Cool. And if you ever lose this thing on the right hand side, you can just press command L and get it back. When we click on these dots, you're going to come down here to MCP servers, which is really cool. And now look at this. If I click
cool. And now look at this. If I click on manage MCP servers on the left hand side, you'll to see now all of these beautiful things. So this was looking
beautiful things. So this was looking red because I I changed my API key recently. But look guys, we come down
recently. But look guys, we come down here to Superbase. You can see it's enabled and you got access to all these awesome MCP servers. Now think about it from this point of view. If you come over to Superbase, for example, it looks a little you know what is it Jack? It's
like kind of like very codelled. You
know if you think about that you and I might to speak English or French or Japanese or Chinese tables speak something called SQL. Now the great thing about being where we're at right now is that you don't need to know how
the complete intricacies. It's worth
learning the basics but basically because we've connected this to anti-gravity now anti-gravity can create tables for us and do anything we want to but a couple of housekeeping things that's worth you know. So on the left hand side you come down here to project
settings. Okay you got all you can
settings. Okay you got all you can access your API keys. Loads of really cool things over here which is decent.
One thing I want to draw your attention to though is the bit that you're going to be spending a lot of time is authentication when you build apps which is cool. So here you can see signin
is cool. So here you can see signin providers a worth server lots of cool stuff but if I click on signin providers now when you create an app using superbase one of the things that you can do is basically determine how can they sign in and look at all these different
things you've got like that's when you go to websites like sign in with Apple sign in with GitHub you can do all of those with superbase. That's how cool it is. One that we're going to turn off
is. One that we're going to turn off right now is confirm email at least whilst we're building because basically when we have users creating accounts we don't want to have to keep going back and forth during the development process. Really cool. Then all your
process. Really cool. Then all your tables live in table editor. As you can see got everything here which is cool.
But what we want to click on and you can see this is the dashboard stats from a different video that I did. You can come down here to database and in database you can see everything which is really cool. But we haven't got anything in
cool. But we haven't got anything in there at the moment. So let's go back over to anti-gravity and we're going to be touching on superbase later. We just
wanted to give it the connection. But
once that's done, it's got everything that it needs to rock and roll. And
crucial guys, check this out. And this
is one of the really cool features about anti-gravity is that it will show you its checklist. So we can actually, you
its checklist. So we can actually, you know, add questions to this. This is the complete discovery questions, research, scraping messages for each source. I
could come down here and say, "Awesome.
I want these websites, right?" So, for example, why don't we go over to a random website and let's just say we go down to, I don't know, rundown AI or something like that. I think it's this one here. Cool. So, we can just give it
one here. Cool. So, we can just give it this random URL. We come back over to anti-gravity and just give it that and add that as a comment. So you can dynamically change its plan. And here we can see it's doing the research the research newslet structures and
finalizing blueprint navigating to this website to understand how are the articles stored and basically anti-gravity will just figure out for you which is awesome especially when you've got a basically a system that looks exactly like this. Awesome. So
that's now done. Current status update.
It's just completed the research on normal newsletter sources what it's discovered. So it's gone RSS feed. It's
discovered. So it's gone RSS feed. It's
figured that out. It's a next.js site.
is going to be able to scope and do various different things. Now, let me update the task checklist and create the implementation plan for our review, which is really cool. And just going now through everything, taking things off, working for us autonomously in the
background. And when you explain things
background. And when you explain things to anti-gravity in the way that I did, using this blast framework, it just works for you on autopilot, you tasks, and it just does everything for you in the background. Beautiful. And now
the background. Beautiful. And now
anti-gravity has finished that. Let's go
and check it out. So, I've opened up and look the host. And guys, would you look at this? The viral AI agent takes the
at this? The viral AI agent takes the internet by storm. It is organized everything in the exact way that I specified it. Look at this. Because
specified it. Look at this. Because
here's the interesting thing, right? If
you actually go over to the AI rundown, for instance, the apps, they're not organized like this. What's really
fascinating about this, like if I click on this, for instance, right, is that each of the things that we've pulled out are separate articles. and anti-gravity
has gone ahead and just separated this out for us beautifully because it's identified what the title is with the images and we've got this awesome stuff that we can see now and I can down and say you know find dozens of free idols
Google labs that's interesting and if I like it why don't I just come ahead and give it a heart beautiful go ahead okay so we need to quickly update this so let's just say we need to go back and anti-gravity and I'm so glad that's happened cuz I can be specific and
saying hey there dude whenever I heart something in the application I get this error message Please just fix it. It's
so hard. It is saved to the database and saved as my saved items. I'd also want the ability to delete when I hit the delete button. And when that happens, it
delete button. And when that happens, it should remove it entirely. And we come down and we just paste in the error code and send that straight off to anti-gravity. So when I come back over
anti-gravity. So when I come back over here after anti-gravity has completed it. So let's see if I can things. I like
it. So let's see if I can things. I like
the look of that. It's now saved, which is cool. So I head over to the save
is cool. So I head over to the save section, and I should see the lobster magically appeared when I refresh the page. Or I can just click this refresh
page. Or I can just click this refresh button. And there I go. So now it's
button. And there I go. So now it's actually physically gone ahead and fixed it. And I'm really happy now with the
it. And I'm really happy now with the functionality. I can pretty much add any
functionality. I can pretty much add any ones I want to. I can check all the sources and we've got a really cool format now for how everything looks. Do
you see how consistent it is, guys, like between bend bites and I've just got this really nice, beautiful flow and everything's there. So I'm really happy
everything's there. So I'm really happy now with the functionality of our wonderful dashboard. And so now we've
wonderful dashboard. And so now we've completed the functionality and we're very happy. The fourth step in our blast
very happy. The fourth step in our blast framework stands for stylization. So
we've got a beautiful house. We're
connected to the outside world. We've
got our connections. But the thing is it's looking a little bit better. The
walls are white and you and I like a little bit of style. So, we want to refine that a little bit and that's exactly what we need to do in the fourth step. So, this section is all about
step. So, this section is all about stylization and refining the UI. So,
we're going to do the payload refinement, format, all outputs of Slackbox, notion outputs, email HTML for professional delivery, and then the UI and UX. So, if the project includes a
and UX. So, if the project includes a dashboard or a front end, we want to apply clean CSS, HTML, and layouts. And
then we want to give feedback on what we think about the design. So, let's head over to anti-gravity. Okay, beautiful.
So, now we're back. Now, here's the thing. In this video, we're going to go
thing. In this video, we're going to go so deep into design. I'm going to show you skills. I'm going to show you things
you skills. I'm going to show you things that used to be reserved only for professional designers. But what I'm
professional designers. But what I'm thinking we should do here is open up a little project and just show you just generally speaking what this is about.
All right, guys. So, I'm in it now. Now,
this generally speaking is the bit I'm going to get into all the design systems later in the video, but I just wanted to outline the framework for you so you understand where we take a look at it and just make some judgment calls on what we think about the general design and you know, what do we like and what
do we not like. Well, one of the things I want to show you we can do very quickly in this video is something called UI sniping. So, what we can do is head over to a website like 21st.dev and we can find UI components that we
think are pretty cool and we can just integrate those directly within our website. And again, we're going to go so
website. And again, we're going to go so deep on this guy. I really hope you're caffeinated for this video or have an orange. So, my last video said I'm going
orange. So, my last video said I'm going to grab an orange instead of coffee. I
said that there's no place for you in the Jack Roberts YouTube channel with that kind of attitude. So, we've got these things on borders, buttons.
Effectively, you can look on the left hand side for anything that you need.
Maybe images, maybe maps, whatever the thing is for your design that you like.
You can also give just general feedback.
But the point is find stuff that you want. Like really go into the detail,
want. Like really go into the detail, have a think about it, be creative. And
the cool thing is you're not having to design from scratch anymore. Do you know what I mean? You're actually able to like take components and interesting things like this and do essentially whatever you want to with it. And so
when you found something that you like within basically 21st.dev, dev, whatever it might be. Little hack, by the way, is best of the week. It's so freaking cool.
And you can see all the stuff. You can
even search by the week. Like look at this liquid gradient for example. So
freaking cool. And what you can do very easily and I'm going to I don't want to spoil it for later in the video, but I'm going to show you we go into depth, but you can just come and grab this stuff, right? So let's say for example, you
right? So let's say for example, you really like the look of I don't know, let's say this. Say this is something that you wanted on your website. You
thought, hey, this looks really freaking cool. What you do is you copy, you click
cool. What you do is you copy, you click on share component. You come over to anti-gravity and all you're going to do is just say, "Hey dude, I want you to go ahead and grab this component and integrate it into my website." Okay, you paste it. And then what you can also do
paste it. And then what you can also do is come back over. I recommend you do this also is click on it's where is it now? Copy prompt. Now check this out
now? Copy prompt. Now check this out guys. I come back right and I might just
guys. I come back right and I might just come down here, paste the prompt in, and look at the level of detail. Some say
we've never seen detail like this detail before. It's crazy. But just to keep it
before. It's crazy. But just to keep it simple, I might just say, "Hey dude, I love the light green. Could you change the color to light blue for me on the website?" Just to give you an idea,
website?" Just to give you an idea, we're basically coming down and we're just kind of tinkering with it to make sure it kind of fits our sensibilities.
And then we're all happy with the design. And as you can see, club code's
design. And as you can see, club code's going ahead now and doing all this wonderful thing. It's making all the
wonderful thing. It's making all the changes, changing all the colors, which is great. Exactly what we like to see.
is great. Exactly what we like to see.
We just again, you can flip between club code and anti-gravity exactly as you prefer. And then when we come back over,
prefer. And then when we come back over, guys, you can see we've gone from green to blue. That's working perfectly. And
to blue. That's working perfectly. And
this leads us very nicely onto the fifth step of our five-step framework, our BLAST framework, which stands for trigger. Now, this is the point where we
trigger. Now, this is the point where we basically decide how do we want this to work? What is going to trigger it? So,
work? What is going to trigger it? So,
there's many different ways that this can work. Either say for example, it's a
can work. Either say for example, it's a canban board or a project management tool or personal assistant that might just run when we're using it. But
alternatively, it could be something that we want to trigger remotely using something called Mr. So, for example, let's say that we want it to scrape every hour. Awesome. Or excuse me, every
every hour. Awesome. Or excuse me, every day. But maybe our laptop is closed
day. But maybe our laptop is closed down, right? Or maybe we're just not
down, right? Or maybe we're just not able to physically do that. How do we make sure that that happens? This is the kind of thing that you think about when you get to the trigger section of the actual build. So to do that, what we're
actual build. So to do that, what we're going to do now is we are going to publish our very first app online. How
freaking cool is that, guys? I think
that's really cool indeed. So we need to do that. We're going to basically
do that. We're going to basically basically publish it to GitHub. So let's
swing over to GitHub very quickly. Once
we're in GitHub, we are going to go ahead and create a new repository. We do
this for any project we like. going to
call this one scraper with a load of bars. That might not be available. Maybe
bars. That might not be available. Maybe
it is. Don't worry about the description. Come down and then click on
description. Come down and then click on create the repo. So, this is going to be a place where all of your code lives, which is awesome. Then, what we're going to do, you basically grab this kit here, swing back over to anti-gravity. Let's
create a brand new window for this again. Actually, I'll pull up the the
again. Actually, I'll pull up the the terminal. And to do that, by the way,
terminal. And to do that, by the way, all you do is command and L. And then
we're here basically ready to rock and roll. Hey, dude. I want you to do a
roll. Hey, dude. I want you to do a onceover check of the code to make sure everything's cool. And then I'd like you
everything's cool. And then I'd like you to post it to the below repository, please. Okay, simple as that. And then
please. Okay, simple as that. And then
we control and v and then wham bam.
Thank you, ma'am. Anti-gravity is then going to take all this code and put it onto GitHub, which is great. Then when
it's on GitHub, we're then going to push it live and we're going to host it on something called the cell. You're
learning so many cool skills in this video. We're just going to go deeper and
video. We're just going to go deeper and deeper and so many honestly I'm showing you like the map of all the cool things of how you do it cuz when you understand how to build, how to push it to GitHub, how to host it, the world is your
oyster. you can build things that you
oyster. you can build things that you used to need sixf figure development teams and I know this I remember CT my last business I remember saying asking a question like how long will it take to get XYZ dashboard up and he said probably 2 to 3 months now we're looking
at 2 to 3 hours if you're slow if you're fast and you watch tutorials like the ones on Jack Robert's YouTube channel you're doing it significantly faster than that I mean I I built one for example in like 30 minutes that did everything I wanted that's the level of
where we're at right now it's it's insane and what's very cool is that actually this will do any kind of security audit for us I always recommend that you say hey do a full security compliance order of this before pushing it live just to make sure everything's
secure and set up. But it even does a good job of just testing it itself in terms of credentials and how everything works. All right. And now it is ready to
works. All right. And now it is ready to rock and roll. So we're going to head over to GitHub which I think is over in this direction. So we're going to come
this direction. So we're going to come back over to Scraper and we should see some files. And we do. Awesome. Now
some files. And we do. Awesome. Now
we're going to head over to Versel.
Versel is the website that we're going to host everything on which is cool. And
just to show you the kind of thing that you're able to build with everything you're learning in this in this video is websites that look like this. the
interactive components how everything I mean look at the detail of this guys this was all done using anti-gravity nothing else like it's actually crazy I mean like you even come down you got this beautiful thing here you can slide
you even got this come up I mean it is gamechangingly cool like really really freaking cool but anyway I'm getting carried away myself you get the idea so we're going to come back over now all we're going to do is essentially come on to add new and click on project and obviously it just automatically connects
to GitHub which is cool and you can use it for everything going to come down and click on import your project will appear automatically and then click on deploy on down there at the bottom like so. So
this will be there for a hot second and essentially this will then deploy on internet. And now the best way to think
internet. And now the best way to think about this is that GitHub okay and Versel are like a mirror image of each other. So the second that something
other. So the second that something changes in GitHub it will automatically reflect into basically Versel. If I
click on this now you'll see we have scraper.vell.app
scraper.vell.app
which means we're now running and rocking and rolling and having a great time. How freaking cool is it? This is a
time. How freaking cool is it? This is a website now. You're live on the
website now. You're live on the internet. You're literally live on the
internet. You're literally live on the internet with this stuff. It's so
freaking cool. Now, but what if you say, "Jack, this is cool, but I want to change a domain. I want to change what the domain looks like." Okay, cool.
Well, how do we do that? Well, look, we come back over here, click on add a domain. This is very cool. And this is
domain. This is very cool. And this is the same thing that I did, by the way, with my agency website. Like, if you're a business, you want to work with me, you do so by coming over to scale your business. Look at this scalewithted.com.
business. Look at this scalewithted.com.
Again, this was built with anti-gravity using the exact systems that I showed you. Like, honestly, like, and all the
you. Like, honestly, like, and all the stuff we're going to get into in this video. It's really, really, really
video. It's really, really, really freaking awesome. And then on top of
freaking awesome. And then on top of that, we can do websites like this, which is ideas with Jack, which is the newsletter. You come on, you can check
newsletter. You come on, you can check things out. Again, all built with
things out. Again, all built with anti-gravity. Very, very cool. So, the
anti-gravity. Very, very cool. So, the
point is you can change domains, do whatever you want to. All you do is click on buy, like so. You come down.
I'd call this one jackoolgy.com.
It is available. Oh my goodness, I might need to buy that immediately. Oh my
gosh, that needs to be my website.
Jackiscoolguy.com. You click on that.
Basically, go through the process and then you you essentially set it up. Then
all you do is reconfigure it. So, just
to show you an example of this, you see on Scale Teddy, we're getting 2,000 visitors a week on the website, which is cool. And then again, like everything's
cool. And then again, like everything's managed under domains. I just want to show you like a real example. Like I
actually do this stuff. This is what it works. And all you do literally is when
works. And all you do literally is when you get skeleton.com, you click on the app name that Vell gave you, you click on edit, and then you click on redirect to another domain, which means if anyone clicks on this link, they will be
redirected to you. Like so. There you
go. Straight to the new website, which is freaking awesome. But now we come back and let's say that we have something that we want to trigger automatically because if we were building an NAM, right? We would have a trigger now node that say run every 6
hours. But how do you do that with this?
hours. But how do you do that with this?
Well, we're going to use a particular piece of software for this called Modal, which is really cool. You're going to head over to modal.com. This is so cool.
I love this place. They're on their homepage. They have this cool thing
homepage. They have this cool thing where you press the button. It does
loads of crazy things. Like I'll show you when it loads up. You ready? Bam. I
could sit here all day doing this. It's
definitely a productive use of my time.
So look, you're going to come over to the dashboard. What Mod does is think of
the dashboard. What Mod does is think of it like the code lives in GitHub. But
actually what we're going to do with Modle is connect Modle to anti-gravity and then we're going to say, "Hey, I want you to go and scrape every five minutes. Go and scrape my emails every x
minutes. Go and scrape my emails every x minutes or go and issue this code or scrape YouTube." I mean, I'm I'm
scrape YouTube." I mean, I'm I'm breaking up even thinking about this, but it enables us to run and execute code when our laptops close down. It's
basically just a container that lets us execute code when we're touching it or not. So, I click on dashboard for
not. So, I click on dashboard for example. I think of just having like an
example. I think of just having like an employee that runs for you in the background. What we're going to do is,
background. What we're going to do is, can you see this? create your first app.
This is so so freaking cool and you get you get free credits with as well. All
you're going to do is you've got this here. So, if you haven't got this
here. So, if you haven't got this already, copy this and head straight back over to anti-gravity. And we're
going to give it the following. I'm
going to say, "Hey, dude. What I would like you to do now is actually run the scraper every 24 hours." And we're going to use modal for this. So, just make sure that you've got it installed first using the below commands. All right. And
come down. Bam. Can you see how much quicker it is using Glider? By the way, I must admit it's the only tool that I've used that's genuinely saved me like hours a week. And so building it with a team of pros has been amazing and I've
really enjoyed that and it's so cool. I
use it all the time. I literally use all the time. It's so so cool. So if it's
the time. It's so so cool. So if it's installed, it will just say, "Hey, we've installed it. Awesome." But if it isn't,
installed it. Awesome." But if it isn't, it'll go ahead and install the dependencies for you. Then this is where it gets cool. We're going to swing back over now to modal. And this is really really sick. So we've got this stuff
really sick. So we've got this stuff here. Make sure it's all run and rocking
here. Make sure it's all run and rocking and rolling. Decent. Then what we're
and rolling. Decent. Then what we're going to go ahead and do is wait for anti-gravity to open up. And look at this. It's going to create a token,
this. It's going to create a token, which means we can authorize it. We
didn't we didn't press anything. I
should have filled my hands during that, but basically my hands were right here.
Nothing happened. API tokens created, which means that it's now connected.
Then we're going to be redirected from this page in a couple seconds. And just
like that, let me create a modal app that will run the orchestrator every 24 hours. So, think of it like this.
hours. So, think of it like this.
Anti-gravity creates a code. And then we have these digital employees that live in this modal land. They just sit there and we say, "Hey, you you're going to do this every x period of time without me even thinking about it." And it will
just execute for you and work. This is
how freaking cool this is. Like, it's so easy. Like I don't have a coding
easy. Like I don't have a coding background. I studied law or European
background. I studied law or European international law at university. So I
was going to become a lawyer at some point and then I did very different things and I never had a coding background. Like all this stuff I've
background. Like all this stuff I've learned and if I can learn it, you can learn it. Like it's that freaking cool
learn it. Like it's that freaking cool and wonderful. And after some configury,
and wonderful. And after some configury, we've now got everything live which is cool. Code is reviewed and approved.
cool. Code is reviewed and approved.
Push to GitHub. Modal automation
deployed. What does that mean? Well, let
me show you over here. So look, if you go on live apps now, we have it here.
It's all ready to rock and roll. How
cool is that? And so you can see how your scraper behaves and you can see exactly when it's doing it. And here's
the really cool thing. You can control it in plain English with anti-gravity to do anything. And when it runs, it'll
do anything. And when it runs, it'll basically progress and give you updates and tell you everything that you need to know. And you can even say, grab that
know. And you can even say, grab that information and throw it into Superbase.
So you can see it. I mean, think of it like Lego bricks. You're basically
building anything you want to. And you
can even schedule an immediate run by clicking this, which is run now. And you
can see down here at the bottom, it took like 1.92 seconds to get startup. It's
now currently running. So if you just want to go ahead and trigger it, you can do. But this is how incredible it is.
do. But this is how incredible it is.
And it succeeded and all done. And
that's literally how simple it is. And
it'll just continue to run on our schedule without us even thinking about it. Meaning we have these digital
it. Meaning we have these digital employees that just work for us 24/7 in the background. And so now you've
the background. And so now you've learned the full framework of how to build any application, website, AI app with an anti-gravity, you are already ahead of 99.99999% of people. Like genuinely, this is
of people. Like genuinely, this is crazy. But before I can show you how
crazy. But before I can show you how incredible and how deep this rabbit hole goes, what I first want to show you is something called anti-gravity skills, which will take your like abilities
within anti-gravity from this to interstellar. So the team at
interstellar. So the team at anti-gravity in Google have just released anti-gravity skills and they have a couple of incredible benefits.
First of all, when you create something excellent in anti-gravity, we can now make that super repeatable, which means that we can do it every single time on repeat. consistently. On top of that,
repeat. consistently. On top of that, you're also going to save so much of your context window when using anti-gravity if you use the skills. On
top of that, it also becomes super sharable and very scalable, which means the skills that I build and I'm going to show you in this video, I'm going to give you all of them so you can use them straight away. I'll put a link down
straight away. I'll put a link down below, but you can share it with your team and it just makes all the environments super scalable. You
basically become, if you want to think about it this way, Tony Stark and the skills are like the Iron Man suit. Now,
if we think about it technically, well, skills are reusable packages of knowledge that extend what the agent can do. Each skill contains basically
do. Each skill contains basically instructions of how to do the thing, best practice what to do, and then optional scripts and resources. And the
skills in anti-gravity are different than claude. And you'll see what I mean
than claude. And you'll see what I mean in a second. So, you can basically create a skill for anything. Onboarding
systems, database migrations, competitive intelligence systems, or even design protocols. It's kind of like the Matrix. You know that scene where
the Matrix. You know that scene where they plug him in? is like, I know kung fu. That's kind of what skills going to
fu. That's kind of what skills going to be like within your anti-gravity environment. Now, when do I use skills,
environment. Now, when do I use skills, right? When would I actually physically
right? When would I actually physically do this? Well, whenever you find
do this? Well, whenever you find yourself repeating a prompt, it's probably a good indication that you want to build a skill. So, you never have to repeat yourself. You're at the gold
repeat yourself. You're at the gold standard once and then you can just call that in perpetuity whenever you want to and improve on it. It's really cool.
What about Claude skills, Jack? Because
I've seen a lot about that online these days. Well, Claude, if you think about
days. Well, Claude, if you think about it now, they are very similar, but there's a key difference. Think about
the Claude skills as knowledge, whereas anti-gravity is knowledge, but it's actually more automation. I'll show you what I mean. So, cl code in this analogy
is like a worldclass chef. Okay? And
he's got a library of cookbooks. These
are its skills if you if you will. Now,
when you ask Claude code to do something, what it does is goes to this beautiful library and grab that skill and it reads the book. It reads what the skill says and then once it's done that
based on the information that it read within the book, Claude Code will then go and do it. So I'm chef, I'm Claude Code, I've read the book. Now I realize I'm going to run a Python script. I'm
going to do something random. Okay, you
think about it another way. You have
yourself here, which is me in a tank top. And we give a command to Claude
top. And we give a command to Claude code. And Claude code reads the skill,
code. And Claude code reads the skill, the book, and then it does the actions itself. Whereas with anti-gravity, given
itself. Whereas with anti-gravity, given the fact that it's an IDE, effectively when it activates a skill, what can happen here is that the code can actually be part of the skill, right? So
essentially what happens there is that it runs the script within the skill. And
so each skill in this analogy is like a beautiful pre-made dish and it because it already executes and does everything that we want to. So Claude skills, think about knowledge, anti-gravity, the ways I understand it, I think about it in
terms of automation. So Claude must reason, write, and execute, whereas anti-gravity can reason and then execute. And this is based on my
execute. And this is based on my understanding from going through anti-gravity's own docs and skills and comparing that with Claude code. So very
interesting. And actually, one interesting thing I want to call out as well is anti-gravity, anytime we launch any changes, they publish on the change log, but I'll put a link down below so you can check that one out, too. Now, to
best understand anti-gravity skills, you need to use them. So, what I'm going to do is run you through five critical skills that you're probably going to use every single week within anti-gravity.
I'm going to give you the full access to all the code. I'll put a link down below. But the first one we're going to
below. But the first one we're going to start with here, because remember, these skills are going to make excellence repeatable, which is awesome. In other
words, diligence, right? It's going to save you token count and it's just going to be overall epic for your environment.
So, the first skill I want you to create is the ability to create other skills.
So, here we go. We've got the anti-gravity skills creator. This
document, by the way, is based on the information from Claude Docs on all the amazing stuff for creating best practice skills, as well as all the specifics for anti-gravity and the unique architecture
for the skills there. So, what I've done, I've created it. Very, very cool.
All you're going to do is literally come down and create all of it like so. And
then we're going to go ahead over to anti-gravity like so. And here we are in the environment. So, I've created a
the environment. So, I've created a sample project called Skill Master. Just
open up a random folder. And then we're going to give it a prompt. And we're
going to give it something like this.
going to say, "Hey there, I would like you to create for me a global skill called Gemini skill creator." And the idea of the skill is that you reference it anytime you're creating any other
skill. Make the skill available across
skill. Make the skill available across all projects. I've put all of the text
all projects. I've put all of the text down below for the skill. Awesome. We're
going to come down here and we're just going to paste that one in there, which is awesome. So, the cool thing about the
is awesome. So, the cool thing about the chat interface, and remember, anti-gravity is an agent first software environment. So, everyone tries to
environment. So, everyone tries to specialize in one thing or another.
Anti-gravity really tries to specialize on, you know, being specific about um being agent first. So, we can actually speak to anti-gravity to create the skills. And this is the whole idea of
skills. And this is the whole idea of coding with our language, right? That we
don't always have to put button clicks.
Anti-gravity can do that for us instantaneously. But just to give you a
instantaneously. But just to give you a bit of an overview of what does make a good skill because you can go very deep on this, but top level from anti-gravity themselves, you name it. You have a description for what it does. Okay, we
essentially talk about when it's used, it's review checklist and then how to provide feedback to it. So you can get some real specifics, but you go so much deeper and this prompt goes way way deeper than that. We cover things in it
like formatting standards, the skill name, we cover things like writing principle, conciseness, so how do you actually create the skills? What are the best practices? And Claude's done such a
best practices? And Claude's done such a good job on breaking down all of this stuff and all the specifics, which is amazing. So as you can see, we come back
amazing. So as you can see, we come back over now. We're going to accept all the
over now. We're going to accept all the changes. As you can see, we've now got
changes. As you can see, we've now got the agent skills, Gemini skill creator, and then we've got everything here, which is freaking amazing. So, workflow,
feedback loops, checklist, validations, lots of different stuff. So, this is now going to be the skill to create other skills. And effectively, the way that
skills. And effectively, the way that you trigger these skills should be based on natural language. So, the idea here is that Gemini will decide when to reach over or whatever model we use within,
right? Could be Gemini, could be Claude,
right? Could be Gemini, could be Claude, could be anything. But the idea is that it decides when to use the skill. You
can also trigger the skill if you want to be 100% sure that it uses it. But in
theory, it should just trigger it by its natural language. And if you ever find
natural language. And if you ever find it isn't doing that, just say, "Hey, use the XYZ skill." Now, Gemini 3 is the best model on the planet today for creating gorgeous and beautiful designs.
They're crushing it. But often times, we can find ourselves copy and pasting the same prompts and messages and design libraries. So, we can solve this with
libraries. So, we can solve this with our second anti-gravity skill, which is going to be brand design. And we can actually use a framework that goes beyond the brand which makes it way more consistent. So for example in the brand
consistent. So for example in the brand design skill we can actually create a unique architecture. So with this one we
unique architecture. So with this one we have almost like a directory structure where effectively what we have over the top here is the skill MD which is whenever you're doing anything design you can then decide which of the three
almost like subsklls if you like you want to activate and leverage. So we can have one for design which colors colors fonts radi make it machine readable. We
have frameworks and coding rules for like what text you want to use and then copyrightiting guidelines. So this is
copyrightiting guidelines. So this is the bit where we could say for example add in hey if you're writing in the voice of you know glido our speechto text startup you could say look we want it to be these colors or write in this
tone of voice. So it just knows automatically and dynamically when to invoke that specific skill. So let's
copy all of this right here. Let's head
back over to anti-gravity and give it the prompt which is awesome. So, I'm
going to say, "Hey, using this skill creator, I would like you to create a the below skills for based on the text."
Okay, cool. There we go. Pop all that information in. Bam. Send that one off.
information in. Bam. Send that one off.
And then again, let Gemini work in the background and create those skills for us. And then from your purposes, what
us. And then from your purposes, what you then want to do is actually load up all of your brand guidelines and information. So, for example, what you
information. So, for example, what you do is say, "Hey, I want you to edit the information and context within the skills based on the blow information."
And literally just drop it in the chat window. Or if it's a PDF, you can
window. Or if it's a PDF, you can literally drag and drop it on the left hand side and Gemini can read that.
Little hack for you as well. By the way, if I actually come over and grab like the Glido brand guidelines, right, I open this up. You can see it's really cool. It's got loads of stuff in
cool. It's got loads of stuff in typography, all our text, all this cool stuff, right? What you can do is drag
stuff, right? What you can do is drag this over into the file and then actually when you want to reference it, for example, what you can do is say, "Hey, I want you to update the information in the brand design
guideline skills based on the information within this document." Okay?
And then what we do is we do at like so and then we can tag that document.
Right? So this is called glido brand guidelines. I just do glido brand
guidelines. I just do glido brand guidelines PDF. Boom. So you can
guidelines PDF. Boom. So you can describe that natural text but this literally grabs the specific route to it and you can just add whatever you want to and then you throw it in there which is awesome. Little side note by the way
is awesome. Little side note by the way if you're looking for inspiration on what do I do this? I talk about this often in different videos but if you go to vcrol.dev you come through to playground. Again what you can do is
playground. Again what you can do is enter in any business website you want to. So what the classic example I always
to. So what the classic example I always use in fact let's even do glido.com right what you can do with this come down markdown and just come down and select branding this will then basically let you go ahead and get all the branding information for a particular
website to create a mood board and a vibe to know what you like. So if you like the look of glider you think dude this is a really cool brand you can see our logo you can see our fabricon you
can see our OG image and you can even see the fonting that we're using as well as the specific accents. So you could be like, I love this. I want to do something similar. I want to play around
something similar. I want to play around with it. And you can do that exactly
with it. And you can do that exactly just like that. And the other thing that I recommend you do as well is actually upload your logos to the skill as a reference file. So when it creates
reference file. So when it creates things for you for your website, you create new pages or anything like that.
It knows what logos to use and when. So
we can test this by saying, "Hey, I want you to create for me a very simple simple HTML landing pages. Do it in my brand guidelines and make it just a gorgeous design, very simple, talking
about why coffee is the best drink on the planet." Beautiful. We're going to
the planet." Beautiful. We're going to turn that one off and we're going to see how this then actually pulls ahead, uses those skills and builds something really simple. And as you can see down here
simple. And as you can see down here already, guys, it's pulling through the skills master agent skills, brand identity, which is awesome. And then
it's creating a bit of a mockup with Gemini, which is fantastic. And I also just want to call out that this is one of the cool things about anti-gravity and the Gemini model being embedded within the chat that when you're doing various different things, it can
actually generate for us these images, which by itself, PS, is a skill you can make. If you're building things, you
make. If you're building things, you want Gemini to generate images, say for your website with the SEO and stuff, you can say, "Look, all the images I want you to generate should be in these dimensions and follow this style and follow this reference image." Meaning,
you can build that as a skill. So, you
actually automate the creation of these incredible images. And now, it's
incredible images. And now, it's completed that. And as you can see, I
completed that. And as you can see, I gave it one prompt. It did it. It
checked everything for the brand guideline adherence. Again, it leveraged
guideline adherence. Again, it leveraged the skill, so I wouldn't need to keep repeating myself. I can come down and
repeating myself. I can come down and all I asked it for was to open up in local host. So, we click on local host
local host. So, we click on local host 8000. And then if we full screen this,
8000. And then if we full screen this, can we see it? Feel my progress. And
what's really cool, guys, it's grabbed the logo. It's followed the exact
the logo. It's followed the exact branding thing. And I even show you now
branding thing. And I even show you now just as a little for instance, I'll come over to Glider itself. Does this does this branding look familiar? Does it
look Does it look like a fast speech to text thing? Damn right it does. But you
text thing? Damn right it does. But you
can tell, but it's it's just automatically and even when I'm highlighting it, it's gone light green now, which is freaking insane.
Obviously, it's just now ready to rock and roll. I just I think this is
and roll. I just I think this is absolutely crazy. It just saves so much
absolutely crazy. It just saves so much time. So, you can get that consistent
time. So, you can get that consistent result. And here's the key thing about
result. And here's the key thing about the skills in anti-gravity is that if the result isn't perfect, that is so cool, just go back and amend it and refine it. But once you get that maxle
refine it. But once you get that maxle standard, it should never fall below that. Now, as you know from my last
that. Now, as you know from my last video looking at what the creator of Claude Co, I mean, Claude Co does a billion a year in annually recurring revenue. So, the creator's got some
revenue. So, the creator's got some interesting things to say. One of those interesting things, and I've been talking about this a lot, is the importance of the planning stage. Ask
stupid question, get stupid answers. In
the same way, we can actually improve the quality of our outputs by asking way better questions. And we can do that by
better questions. And we can do that by leveraging again a skill for brainstorming and a skill for planning.
So there's this amazing repo here which is fantastic. And again, this is the
is fantastic. And again, this is the beauty of skills is that we can all learn from each other and get better as a community which I freaking love. So
you can see here we've got some stuff here for brainstorming which is a great way of doing it. You can see this brainstorming skill which is skill by MD and it's got lots of stuff. So, this is about how do you actually create and brainstorm better ideas? And then
there's going to be a skill for planning, which is phenomenal. So, what
I'm going to do here actually is I'm going to come over to the main page real quick, which is going to be over here on the code. And then we're going to copy
the code. And then we're going to copy the whole thing on code like so. And I'm
going to copy this and head straight over to our beautiful anti-gravity. And
then I'm going to say, hey, using our skill creator MD, I want you to grab this GitHub repository and create me two skills. One for planning and one for
skills. One for planning and one for brainstorming. Awesome. Okay, come down.
brainstorming. Awesome. Okay, come down.
And I'm just going to give it a get and let it do all the work of actually just grabbing it for me. And just like that, it's now completed it. It's done a brainstorming skill and also a planning skill. So I might say something like,
skill. So I might say something like, "Hey dude, I want to brainstorm some ideas of how I could grow my e-commerce business." Okay, something random. We
business." Okay, something random. We
send this one off and then we can activate and see how it leverages the skill. And just like that, you can see
skill. And just like that, you can see it's analyzed skill.md, which is awesome. I also want to show you as well
awesome. I also want to show you as well on the left hand side, you can go on to skills. We can see this now under
skills. We can see this now under planning and skill.md under planning.
And it's given everything we want there.
So you can see it's got some interesting features here. It's an overview. Write a
features here. It's an overview. Write a
comprehensive implementation plan. Each
step is blah blah blah. And it's got this all this great stuff from the GitHub there. And the model itself is
GitHub there. And the model itself is now asking clarificatory questions to help us get that and pretty much crush it. Meaning that you're going to have a
it. Meaning that you're going to have a consistent robust framework for planning and doing anything we need to with an anti-gravity. Imagine you built your
anti-gravity. Imagine you built your dream workflow and you're pushing the envelope. You're doing something very
envelope. You're doing something very different. Invariably at times you're
different. Invariably at times you're going to run into what is known as a bug or it's just not working properly. And
when that happens, we need to troubleshoot it. But the amazing news is
troubleshoot it. But the amazing news is that we can actually leverage a skill which has basically been created on all the best practices, the common things that go wrong, which means that
anti-gravity can leverage the skill to fix the error way faster. And to do that, we're going to leverage this beautiful skill here from this repo, which explains all the specifics, which
is amazing. Master error handling
is amazing. Master error handling patterns across languages, including exceptions, uh, result types, error propagation, graceful. So, what we can
propagation, graceful. So, what we can do is literally come down and we're going to copy this entire repo and we're going to share that with an anti-gravity skill. And this is one of the awesome
skill. And this is one of the awesome things I love about the community of building is that you get to do these things, find all the cool stuff, and basically like leverage all this cool things that we do together. So, if I come over then to anti-gravity, I'm
going to say, "Awesome. I would now like you to forget what we're just talking about, and I want you to create for me a troubleshooting skill, which we'll use to basically troubleshoot any application to make sure that it gets fixed." Fantastic. And then we're going
fixed." Fantastic. And then we're going to throw all that code in there, which is awesome. and send that one off.
is awesome. and send that one off.
Again, you could just give it the GitHub repo if you prefer, but alternatively, you can just post it and craft these skills yourself dynamically whilst you're talking to anti-gravity. And
again, the key here is that anything that you would be asking of these models or within anti-gravity, if you find yourself asking it a few times, ask yourself, should I just take 2 minutes to write like the best thing I can to
get the highest level possible and then I can just use this whenever I need to in any of the applications that I'm building. And that takes us very nicely
building. And that takes us very nicely onto our fifth skill, which is a really interesting one because it's the idea of running scripts within the actual anti-gravity skill itself. So for this one, we're actually going to create some
code that does something interesting like scrape a subreddit for something.
And then once that skill's created, we'll be able to just say, "Hey, scrape this subreddit." It will reach over,
this subreddit." It will reach over, execute the exact code within the anti-gravity skill, and work perfectly for us. So to do this, let's create a
for us. So to do this, let's create a skill. Hey dude, what I would like you
skill. Hey dude, what I would like you to do is to create for me a scraper that would scrape the top three posts of any
subreddit Reddit I choose. I want you to create it, validate that it works and let's do it with the NHN subreddit as if for instance. So, I've sent this one off
for instance. So, I've sent this one off and the reason why this skill here is actually one of the most interesting and most powerful is because when we validate and prove that you can actually create executable code as a skill, we
can know and bank on the fact that we can lean over, leverage that, and use that whenever we want to. Now, I'd like to build these ones in two steps. The
idea I've got here is validate the actual execution performance of it.
Then, we're going to codify it into a skill using our skill creator, and then we can reach over and use it for pretty much anything that we want to. So what
previously used to have to be a dashboard or a project can actually now just very easily be a skill. And again
once again we're using MCPs here. Now
think about this. The skills themselves are code instructions knowledge practice. MCP really is about data data
practice. MCP really is about data data exchange and data gathering. So they all work together. That you know saying
work together. That you know saying don't use MCP use skills is like saying something like don't eat food drink water. Like they're completely different
water. Like they're completely different things. It's like they're just
things. It's like they're just absolutely different things used for completely different contexts and for our purposes it's very cool because we can do some epic stuff way faster.
Beautiful. So within one shot it has done it. It's actually interestingly
done it. It's actually interestingly used the old Reddit to do it reliably without the need for any APIs which is really cool. So what I'm now going to
really cool. So what I'm now going to ask it to do is to codify this into a skill. Awesome. I'd like you to turn
skill. Awesome. I'd like you to turn this into a Reddit scraping skill for me in line with how I explain you need to be building skills in the skill creator MD. Beautiful. Once again, I don't need
MD. Beautiful. Once again, I don't need to specify skill creator MD. I think
that kind of want for it to never go wrong makes us do it. But in reality, Gemini should know this. And the reason why this saves us so much in terms of token usage is that if all this stuff just existed as let's say for example, folders on the left hand side, which is
a way that probably most people are doing it right now because this thing came out like this week. You know, it'd be burning through your tokens and not everybody is on the supermax ultra mega plan. And the thing about that is like
plan. And the thing about that is like you token usage becomes a key thing. So,
what Gemini is going to be doing here is looking into the skill, looking through the description, saying, "Hey, you know, the Reddit generator skill might be relevant for the thing we're doing.
Let's actually go ahead and use it." So,
it's cool. So, now it's literally developing this for us. We're just going to head and accept this, which is cool.
And man, I must admit, I've had a pretty beautiful, interesting week. We're
planning out all the meetups for the community. So, we're doing South Africa
community. So, we're doing South Africa in two weeks. Then, we're doing a meet up in London in March and then one in Japan in April. So, we'd love to come see you. Grab a coffee, say hello, shake
see you. Grab a coffee, say hello, shake your hand. We always have great times.
your hand. We always have great times.
One of the things we do a lot in the community is in-person meetups. I
freaking love it. It's so good to see people in person. So, we're going to buck that. Last time we did, I think it
buck that. Last time we did, I think it was like mini golf. It was very cool. It
got very competitive very quickly. We
rented out this place in London. It was
so cool. So, there's now pip and popping in the background completing everything for us. We're just going to accept all
for us. We're just going to accept all to make sure this is all completed. And
then we can actually test it by creating a brand new chat window and then just asking it to scrape a random subreddit to get a couple of posts. And I like to do that by testing it in a new window.
So, there's no context. It is a fresh, brand new conversation. Now guys, check this out. Can you see now within the
this out. Can you see now within the scraping Reddit folder, we've got resources, right? We've got scripts. So
resources, right? We've got scripts. So
this the Python script is within this.
So we're not saying, "Hey, use it's like literally within that, right?" So let's come over and create a brand new chat window, which I believe they might have changed where you do this. Actually, I
think it is start new conversation.
Cool. So, let's get rid of this and let's give it a prompt like, "Hey, can you just scrape for me the top three posts within the singularity subreddit within the last 7 days?" Awesome. Bam.
Send that one off and then we can see if it actually goes ahead and uses, but I know it will use our actual beautiful skill, but I've not told it to do that.
It will just then actually have to decide whether it wants to use the skill or not. So, let's have a look. It's
or not. So, let's have a look. It's
analyzing whether the scripting is done.
Analyzing skills.mmd, which is cool. So,
let's check it out. And it has decided to use the scraping thing. And again,
it's got description scrapes to top a hot purse from specified subreddits. And
look, it's even now using the scraper that's in the Python script there, which is awesome. This is freaking crazy,
is awesome. This is freaking crazy, guys. So, it's examining it. It's a
guys. So, it's examining it. It's a
Justin Reddit scraper. It's now running in the background. It's got all this information. This is crazy. And you can
information. This is crazy. And you can see now, say, for example, I'm looking at my YouTube channel. I might say, "Hey, just like remind me what were the top posts that I've had so far this week." I create a scraper for it and
week." I create a scraper for it and it's done. And look at this. We've got
it's done. And look at this. We've got
the answers. Driverless van in China are facing all sorts of challenges. Atlas
ends the year with a backflip. Atlas has
its own moves. How freaking crazy is this? This is gonna sit there for us now
this? This is gonna sit there for us now on autopilot. I can pull that skill
on autopilot. I can pull that skill whenever I want to. And this is just one example, but it's spun up in like 20 seconds. It's ridiculous. And so now
seconds. It's ridiculous. And so now you've understood exactly how to leverage skills. The next thing that we
leverage skills. The next thing that we need to do then is build out the toolkit you're going to use with an anti-gravity because bear this in mind that the strength and power of anti-gravity in
many respects is all determined by the number of skills and connections it has.
And I'm going to show you some stuff that is going to make it so unbelievably easy to build anything you want. It's
going to genuinely surprise you. Now,
beautiful, before I show you the very first MCP you should 100% have, I want to do what I call some MCP housekeeping.
So, MCP, as you know, stands for model context protocol. It is the universal
context protocol. It is the universal remote control. I've lost my remote for
remote control. I've lost my remote for the analogy, but you get the idea. The
idea is this. If something has an MCP and we give it to anti-gravity, it can do anything within that app. Now, we
have something called super connectors that are going to blow your mind. The
first port and call we always do with anti-gravity is we come to these dots at the top and we click on MCP servers.
This is a library of existing ones. At
the moment there isn't that many of them, but you can connect to anything.
The classic example of the one that you're going to use a lot of time and there's a lot of different things like they've got Stripe now which is awesome.
So we can connect to Stripe. That's
probably helpful if you want to monetize and do various different things. But you
get the idea. So first thing we do is check in the MCP source. So we go for it does it exist here. Superbase does.
Awesome. We come down as we did last time. We click on configure. We click on
time. We click on configure. We click on boom. This opens up into new window. We
boom. This opens up into new window. We
generate an access token. So we may call this one ABC. Expires in 30 days and we'll put it down for 1 hour. Click on
generate a token. We grab the token and then we just simply input that back into anti-gravity. We come back here. Super
anti-gravity. We come back here. Super
base access token. Bam. So step one is we always check to see is it there? But
if it isn't, what do we do? Well, here's
the cool thing. You have something called your MCP config or your MCP configuration. And if you click on view
configuration. And if you click on view raw config, you have all this information in file. So essentially what we can do is grab the MCP for anything and throw it in here. And what's really cool is we can actually ask anti-gravity
to do that for us. How crazy is that?
Let me give you some game real quick.
What I want you to do is head over to this website mcpmarket.com/server.
This is crazy. This shows you the most popular MCPs on the planet, which means that you can come through this and think, I would quite like superpowers.
I'd quite like playright. What does
playright do? Playright gives you the ability to open up a browser and edit it. Now, that's native within
it. Now, that's native within anti-gravity where you get how cool this is. Superpowers, context 7 fetches
is. Superpowers, context 7 fetches uptoate documentation and code examples for LLMs and AI code editors. We click
on it, we've got key features, we got use cases, everything. It's so cool.
We've even got a readme. It explains
everything of how you add it in. It is
freaking wonderful. And crucially, you even get this in here as well. So, you
can just copy this in, throw that in as your MCP server and kick butt. So, first
thing I'd recommend you do is have a look through this, play around with it, try and find all the different bits and pieces that you like to decide what it is that you want. Now, what are we going to use? We're going to use Zapia. Why?
to use? We're going to use Zapia. Why?
I'm going to show you exactly why. Now,
Zapia is like goated to this stuff. Now,
Zapia is actually what I used initially to build my first business. I freaking
love this platform. But the reason why we're going to be using Zapia here is because it is connected to when you compare it to any tender make, no app has more connections than Zapia, which is one of the reasons why we're going to
be using today cuz they are freaking crazy at connectors. And you're going to see exactly why. So, website's very, very cool, very decent. Let's get into the meat. Let me show you exactly why
the meat. Let me show you exactly why we're going to use Zapia. Because when
we connect anti-gravity to Zapia, we actually get the ability to connect to all of our tools in the Zapia. And when
I say that it's easy to set up like, okay, I'm just going to show you cuz it's crazy. So, what we're going to do
it's crazy. So, what we're going to do is head over to zappy.com, create account if you don't have one already, and let's go and log in. Okay. Now, when
you're logged in, you're going to see something looks a little bit something like this. So, you can create workflows,
like this. So, you can create workflows, chats to it, that kind of thing. But for
today's purposes, what I'm really curious to look at is Zapia MCPS. And
you can reach Zapia MCPS by going to mcp.zapia.com/mcp/servers.
mcp.zapia.com/mcp/servers.
Now, check this out. Let me delete this cuz we're going to go together from scratch on this. Right, this is actually wild. So, click on new MCP server like
wild. So, click on new MCP server like so. And you get to decide what it's
so. And you get to decide what it's connecting to. Now, what I'm going to do
connecting to. Now, what I'm going to do here is click on other, which is fine.
So, click on other and you're going to see some information. Now, what we do first of all, very simply, is pick the tools over 8,000 apps. I said 6,000. I
drastically underestimate that. I click
on add new tool. Now, what I want to do here is use Zapia to connect Gmail and Google Calendar and all my stuff. So I
can basically say to anti-gravity, hey dude, you know what was that email I had two days ago about Jose and it can go and grab that for me. So let's just do so basically scroll through and you can literally look at all the apps that you want to connect. So think of this as
Willy Wonkers Emporium of incredible apps. And honestly the cool thing is
apps. And honestly the cool thing is with Zapia, you don't need to create a workflow for the MCP. You just select the tools. That's how crazy this is. So
the tools. That's how crazy this is. So
come down and click on Gmail. Really
cool. And I'm going to click on all this stuff here that I want. Yes, label's
cool. Create a draft. Create draft
reply. Create label. Bam. B, bam, wham, bam. Thank you, ma'am. Happy with that
bam. Thank you, ma'am. Happy with that sort of stuff. You can even go into advance section if you want to and pick out specifics, but we don't need to worry about that just right now. So,
let's come down and select all of them.
There we go. We can just always This is actually really cool. Okay, so I've selected all of the information down here. And again, just do this for all
here. And again, just do this for all the apps that you want to connect. Then
click on connect. So, say for example, you've gone through this process. You
want Google Drive. If you're doing Google, I like Google Drive. I like
Gmail and I like calendar. With those
three things, I can manipulate files. I
can check my availability and build like super agents. Really cool. So, we're
super agents. Really cool. So, we're
happy with that. Basically just pick as many apps as you want. Then we're going to click on connect. Now this is where the kind of magic happens in. Now we're
going to generate a token. So we come down here and click on generate token.
Click on generate token right here. And
what you're going to do cuz you won't see the credentials again is copy this which is connect to. So we're going to head back over now to anti-gravity and give it the following prompt. Okay. Now
check this out. Come over back to H. Hey
there dude. I would like you to add Zapia MCP to my MCP configuration. Below
is information that you need to do that.
Okay. Ctrl +V which is the initial thing. And we come back over and you can
thing. And we come back over and you can copy the token or you can just copy the full URL which is the what to connect to and actually the token. So let's swing it back over to anti-gravity and give it that information. Just simply replace
that information. Just simply replace this with that full information. That
guys, the Zapia MCP is now configured and ready to use. You may need to restore your MCP client. So what we're going to do is click on this refresh button. And if this has worked properly,
button. And if this has worked properly, we will see Zappia appear now in the left hand side. And just like that, we actually have it fully set up. And I'll
put the Zapia MCP configuration down below in the description for you so you can copy and paste it so you don't have to like speak to it. But look at this guys. We've got add tools, edit tools,
guys. We've got add tools, edit tools, Gmail attachments by file name, all this kind of stuff. The best way to test this is in a new conversation. But what we're going to do is reset it. So let's come down here. We don't need to save
down here. We don't need to save anything. I'm just going to save the MCP
anything. I'm just going to save the MCP config for example. Going to click on X and restart anti-gravity in a different environment. So here we are. Let's put
environment. So here we are. Let's put
it to the test and ask it a question about my last email. Hey dude, could you use the Zappia MCP and just tell me what was the subject line on the last email I received. Bam. Send it off. Now, this is
received. Bam. Send it off. Now, this is amazing because we can now ask it questions about our emails, about anything we physically want to. So,
we're going to send that one off right now. It's then going to go ahead and use
now. It's then going to go ahead and use the Zappia MCP. And look at this. Zapia
Gmail find email. This is crazy. Now,
you look instructions. Find my most recent email in my inbox. Output hint,
just a subject line query is in the inbox. Just like that, someone sent me
inbox. Just like that, someone sent me an email about a paid partnership. And
that is literally fully connected that.
And that's just not where it's up cuz if you come back over into configuration, we can just keep adding tools here. And
so, like, it's insane. You don't need to build scenarios. You just add the tools
build scenarios. You just add the tools and Zappy becomes the super connector for anything you want to. Air Table,
Slack, like you just add the things that you want into Zapio. Connect that to anti-gravity and then effectively can do whatever we want to. That's how freaking incredible this thing is. So, for
example, one of the things we could do is add in Fireflies like so. I click on Fireflies. Very cool. And let's say I
Fireflies. Very cool. And let's say I want to add in all these different things here. Very decent. I can click on
things here. Very decent. I can click on connect. I'm going to go through the
connect. I'm going to go through the whole process. I click on connect. So,
whole process. I click on connect. So,
this now wants us to grab the link and the email, which is fine. just go grab that information and then we open up the page and you can see we just go ahead now and get the API key come down here and simply copy come back over here throw it in the field and then once
you've added in your email address you're done and we just add the four tools now it's just got an even more powerful how crazy is that so as you can see it's all completely connected but and let's say we want to add a different skill like pine cone to give it
long-term memory so we need to grab the MCP service let's come over to our website again and type in pine cone like so so we can get the exact config going to save us a nice step and there we go pine cone developer. That's what we
want. So, we're going to click on this
want. So, we're going to click on this guy here. So, enables air coding
guy here. So, enables air coding assistants to interact with Pine Cone projects. Sweet. So, what we want to do
projects. Sweet. So, what we want to do is on the read me, and all I'm going to do is literally copy this whole page.
Come back over to anti-gravity and say something like, "Hey there, dude. I
would like you to add Pine Cone to my MCP config, please. Here's the
documentation, and I'll post my token at the bottom." All right, come down
the bottom." All right, come down documentation. I'm going to say my token
documentation. I'm going to say my token is, and then we head back over and then we're going to head over to Pine Cone itself. Pine Code, if I'm familiar, is
itself. Pine Code, if I'm familiar, is all about long-term memory. So, let's
just take enormous data, enormous files and store it in a way that we can retrieve it, just the bits that we need, basically. So, let's go ahead and sign
basically. So, let's go ahead and sign into Pine Cone. It is freaking amazing.
Also, anti-gravity will vectorize anything for you. And so, now we're over here going to come left hand side to API keys. And then we come up here to add
keys. And then we come up here to add API key. And then we're just going to
API key. And then we're just going to give this a name like tester and come down and click on create. And then
you'll see the API key generated. You
copy this, close this, come back over to anti-gravity, and then just simply throw it in right there. And just like that, almost by magic, it's done. Except for
it isn't magic. It's working some cool stuff in the background. Now, how do we know it's working? Well, we click on MCP servers. We click on manage MCP servers.
servers. We click on manage MCP servers.
We load it up. And we should see something pop up. So, if I click on refresh, for example, what we should see here on the left hand side now will be our great and awesome Pine Cone. Once
that's finished loading, and just while that's loading up, if I come back over to Pine Cone, these are really cool things. So I can vectorize anything, add
things. So I can vectorize anything, add anything I want to kind of through to my database. We can ask it questions about
database. We can ask it questions about anything. Little little tip when you set
anything. Little little tip when you set this up, you want multilingual E5 large.
Really important cuz it's the best one.
So I've got some information down here from PDF. Let's have a look. Hope to
from PDF. Let's have a look. Hope to
meet you in your company soon at Astro.
Awesome. So I think I basically took all of the fields from Alex's how to make offers so good. People feel stupid saying that. So that's the book that I
saying that. So that's the book that I ingested. Alex Alex's $100 million
ingested. Alex Alex's $100 million office. So let's come back over and we
office. So let's come back over and we should see this loading up right now.
And then when we come back over, pine cone will be visible. Little tip by the way, if you ask anti-gravity to do it and it's misbehaving, sometimes it stores it in a different MCP config.
Very quick workound for that. Click on
view raw configr C and say, "Hey, I would like you to add the below MCP config to my MCP config."
Okay, I'm going to say new config and then type in blah blah blah and then say existing config and then control and v basically everything like this and then say paste the full config back to me.
Okay. Then you come over to this, you control A, you delete everything. Then
you just hit Ctrl +V, then you click on file, click on save, and you're ready to go. So let's give it a little test. So I
go. So let's give it a little test. So I
said, "Hey there dude, could you use my Pine Cone account to check what were the main principles of Alex Mos's book?" And
we send that one off right there. Right.
So let's see what it does now. So what
we know that it's working if it uses Pine Cone MCP. Now, what's really cool with this is you can index anything in Pine Cone to do anything you want to.
It's now checking list of indexes and it will come back and actually check that for data. So, we can throw huge PDFs and
for data. So, we can throw huge PDFs and documents and do whatever we want to with this, which is amazing. We can add multiple indexes, which is crazy. And
think about this. Any app you're building, we can basically now connect Pine Cones as long-term memory. So, you
can see the potential and the configurability of this. It's genuinely
crazy, guys. Look at that. Just as I'm saying, it's all coming down like the Grand Slam offer concept, the value equation, business strategy, scarcity, urgency, all the stuff that we uploaded to Pine Code. It is crazy. We can also
upload any file we want to. For example,
let's ask this question. Hey dude,
create me a document left hand side called jackmp and I want you to write me five sentences about why coffee is the best drink on the planet and let's upload it to both of those indexes. We
call this vectorization. Vectorization
is very cool. Sounds very fancy, but it basically just means taking any document or text and to vectorize it means we turn it into a long string of numbers.
That's all we're really doing. The way
that I like to think about this kind of vectorization and and rag which is long-term retrieval augmented generations long-term memory is imagine we had every Harry Potter book right these models have a context window. We
spoke earlier in this master class about context rot and it's like every time you ask it a question it takes the existing memory of the entire conversation and runs it through and eventually it just
starts to forget things. AI can
sometimes be confidently incorrect.
That's the problem. Right? So here's the interesting thing why that's why we need RA because it's added it to our indexes.
So let's validate that that is true. I'm
now in here. Let's refresh the page and we should see something pop up now about Jack and his beautiful coffee. So let's
come down and like that. Jack coffee is the ultimate elixir that transforms groggy mornings into what? Okay. So
let's take this as a instance. Let's
come back over now. So what I'm going to do now is I'm going to delete this. We
don't need this anymore. Let's
completely delete it. Yeah, 100%. Let's
open up a brand new window and then let's ask it a question. Hey there dude, could you complete the blow sentence based on your long-term memory with pine cone? Bam. And put dot dot dot. And
cone? Bam. And put dot dot dot. And
you'll know that it's actually searched that based on its index calls. So check
this out. Pine cone list indexes. Check
everything out. This is so freaking cool, guys. Honestly, this is absolutely
cool, guys. Honestly, this is absolutely wild. Yep, it's got a coffee index and
wild. Yep, it's got a coffee index and pine cone. You might have guessed. I
pine cone. You might have guessed. I
don't mind my coffee. I love my coffee.
Wonderful. It's doing it. I can see my name space. It's doing lots of different
name space. It's doing lots of different tools. So it's almost like, you know,
tools. So it's almost like, you know, you have like every every Harry Potter book. So instead of checking all the
book. So instead of checking all the contacts, we just chop it up into millions of little mini chunks and then we only grab the thing we need. So look
at this. Coffee is the ultimate elixir that transforms groggy mornings into productive powerhouses. I wouldn't have
productive powerhouses. I wouldn't have said that about the groggy mornings. We
have wonderful mornings over here. But
you can see now it's literally done productive powers delivering both energy and focus. Come back over here to
and focus. Come back over here to deliver rest energy and focus. It is
literally crazy. And that's now at your fingertips and can be added to any application. And if there's anything you
application. And if there's anything you want to add, you just follow that exact same process that I just showed you. So
now you understand how to connect any MCP. What about a service that doesn't
MCP. What about a service that doesn't have an MCP? One of the most powerful tools on the planet today anyone who's super productive is using couldn't be connected to anti-gravity. But then
again, what if it could? Well, I'm going to show you exactly now how you can connect basically anti-gravity to Notebook LM to create the most unbelievable powerful combination. Let's
jump straight to notebook LM can research anything. It can turn content
research anything. It can turn content and research into audio. You can learn anything. It essentially is like an
anything. It essentially is like an unlimited knowledge base. And obviously,
as it's no surprise, Notebook LM is exploding right now. So, Microsoft Word is for documents, Excel is for spreadsheets, and anti-gravity is for building software. It's the best way to
building software. It's the best way to understand what this thing does. Now,
what happens when we combine Google's anti-gravity with Google's Notebook LM?
Well, it turns out quite a lot actually.
So, there's way I want you to think about this. Notebook LM is like the
about this. Notebook LM is like the reader, okay? It understands, it reads,
reader, okay? It understands, it reads, it holds massive context. So you're
talking 40, 50 different documents, resources, YouTube videos, everything.
And it also thinks and then you've got anti-gravity, which in this relationship is like the builder. So it builds software. It builds systems. It connects
software. It builds systems. It connects things. It can connect to anything. Like
things. It can connect to anything. Like
it's really crazy. And it also is kind of like your command center, if you will. Now, here's the problem is that if
will. Now, here's the problem is that if you're using massive files and anti-gravity, maybe for your own personal operating system or you're building things, it costs tokens every time the AI has to read those files and
that can lead to bad performance and actually cost you money because you burn through your usage and you need to like spend a lot more. But when you connect these two things together, anti-gravity and notebook LM, we not only solve this
problem, we actually unlock incredible capabilities. And I'm not exaggerating
capabilities. And I'm not exaggerating because you can create unlimited notebooks programmatically within anti-gravity. You can use that knowledge
anti-gravity. You can use that knowledge for projects that you're working on. You
can ask any question about any notebook that you have in one chat. You can
create infographics, slide decks, reports, even do deep research and create audio overviews and a lot more all from anti-gravity. And you can do this all at scale. And anti-gravity
itself now benefits from this kind of within the realms of a notebook landm this infinite context unlimited deep research agents that happen outside of anti-gravity which is going to save you
money and increase your performance and also I should say that you can upload these documents to anti-gravity and actually add those to your own notebooks with a notebook LM. Now I'm going to show you the incredible capabilities
across five levels of difficulty with each new skill being even better than the last one. None of this will mean anything to you unless you understand the ABCs of Notebook LM. I'll put
timestamps down below, so feel free to skip this bit if you've seen it before, but this context is going to make you a power user of Notebook LM and give you amazing context for this video. So,
Notebook LM is Google's main software to understand any kind of resource. It is
very cool. You access it at notebookm.google.com.
notebookm.google.com.
I'll put a link down below. And the way it works is you can, as you probably know, create notebooks, which is awesome. So, one of the things that we
awesome. So, one of the things that we can do is drop in any resources that we want to. That could be articles, could
want to. That could be articles, could be YouTube, could even be from your own Google Drive or copied text. So, for
example, if I was on Jack Roberts YouTube channel and I wanted to learn about anti-gravity skills, I could copy that link, head over to Notebook LM, drop it in there, really easy, and then I literally just hit enter, which is cool, and it adds that now as a resource
for me. One cool thing you can do in
for me. One cool thing you can do in Notebook LM is do fast research. So, I
could say, hey, teach me about anti-gravity skills. And what Notebook
anti-gravity skills. And what Notebook LM will do is actually go on the internet and compile like a list of 30, 40 plus different resources on that topic. And then effectively what you can
topic. And then effectively what you can do is chat with it. So hey, could you give me a brief TLDDR of anti-gravity skills? So essentially anytime that you
skills? So essentially anytime that you want to learn anything, all you do is add the resources in or get back to do that research and you can have a beautiful conversation with it in the window. But it doesn't just stop there.
window. But it doesn't just stop there.
You can export this as an audio overview, a video overview, mind maps, reports flashcards quiz infographics slide decks, and even tables with data.
With the Notebook LM, you can actually customize the way that it speaks to you by clicking on these toggles here. And
you can say, hey, do you want a conversational goal, style or ro? You
can click custom and then give it these examples there, which is awesome. And
then with a notebook LM, if I just want to have a conversation, say with a couple of things, I can untoggle those resources and then just have a conversation with anti-gravity. But the
TLDDR of it is that it makes learning and creating resources a million times easier. And not only that, you can
easier. And not only that, you can actually chat with your own notebooks within Gemini itself. But the TLDDR of the platform is that you can ingest PDFs documents files research anything from your drive, any research,
put it all together in one really big database and ask it any questions and then turn that into any number of resources to learn presentations you literally name it. So the first level of our five level system here is to
actually be able to create these notebooks from within anti-gravity. And
one of the reasons why you may want to do that is because you can connect anti-gravity to any project you're working on and you can spin up an infinite number of them. So we could say to anti-gravity, hey, I want to learn about creating blue bottles. What would
be the 10 topics I need to know? And
then we can get anti-gravity to create for 10 expert notebooks on notebook lan that we can then query and have conversations and bring into any project that we do. But before we do that, the first thing we have to do is actually
install it and connect it to anti-gravity. And the way we're going to
anti-gravity. And the way we're going to do that is by using something called MCP. So if you haven't already, go ahead
MCP. So if you haven't already, go ahead and download anti-gravity and welcome to the future. Now when you open up panzai
the future. Now when you open up panzai gravity it will look a little bit something like this. Now I've created a random notebook here and you can do that by file at the top click on open folder and then you just create a brand new folder and it'll open up that and that's
going to be our workspace. What we need to do is basically connect it via MCP.
So MCP stands for model context protocol and all it lets you do is connect anti-gravity or any app to any other app. I always use the analogy of
app. I always use the analogy of universal remote control because it's really awesome. So if I connect it to
really awesome. So if I connect it to notion for example which you can access by these dots here MCP servers I can type in notion I can connect to notion I can create articles in notion I can do anything. So it lets the intelligence
anything. So it lets the intelligence within anti-gravity connect to anything.
So the question is well how do we connect to notebook LM? Because as
you'll notice there's nothing in the notebook LM store. So how on earth do we actually physically do that? Well what
we're going to do is give it a beautiful prompt. So to do that I'm going to shoot
prompt. So to do that I'm going to shoot over to my school community and grab this link. I'm going to put this link
this link. I'm going to put this link down below for you as well, just so that you can just copy and paste this and get it done and you don't need to worry about the fafage or all that kind of stuff. So, we're in notion. All you're
stuff. So, we're in notion. All you're
going to do is come down and copy this.
So, what this is all coming from is a GitHub repo, which is awesome. So, let's
come back over here. Come back to the agent and then we're going to paste this in. Now, obviously within this, you have
in. Now, obviously within this, you have many different models. You can choose Claude Sonet or Gemini or whatever you like, which is really freaking cool. And
the really decent thing is when we're connecting to Notebook LM, by the way, is that notebook LM is powered by Gemini 3. like it's one that's really super
3. like it's one that's really super powerful model. So, we get lots of cool
powerful model. So, we get lots of cool stuff. So, I'm going to help you install
stuff. So, I'm going to help you install and set up the notebook LM MCP server.
Let me start by checking your system and then it starts to run and do many different things. Now, if you don't have
different things. Now, if you don't have this installed, it will install that for you. So, if it starts asking to install
you. So, if it starts asking to install things, it'll just for you instantaneously. If it's consistently
instantaneously. If it's consistently asking for permission, I always recommend that you keep that on initially, but one of the things you can do is click on anti-gravity at the top.
Yeah, we're happy with that.
Anti-gravity settings. Anti-gravity
settings. And then under here, you can actually determine the frequency at which you want it to permit and do things. So when you're comfortable with
things. So when you're comfortable with it policy, you can do always proceed or ask your questions for your agent, for your browser, and for everything. So
let's come back off these anti settings and come back over. Awesome. So it's
found the MCP current config file. Let
me check its current contents. So we're
going to allow it for this conversation and then just let it install. You'll
notice now that it's been installed successfully, but we need to update our MCP configuration. What does that mean?
MCP configuration. What does that mean?
So when you click on manage MCP servers, you can see a list of all the MCP servers that we've got here, right? And
you can see notebook alarm mcp's there but we need to connect it which is awesome. So as you can see it's actually
awesome. So as you can see it's actually opened up a brand new browser. Now the
reason why it's doing this is because I basically asked it up to sign in authorize. So the way we're connecting
authorize. So the way we're connecting to MCP is via the browser credentials.
So what this is going to do is open up a brand new window get us to sign into notebook LLM and then that will enable us to connect. And as you can see it's now opened up notebook LM in the browser which is great. And the little blue hue by the way is what anti-gravity does
when it opens up a browser to check various different things. And so the only thing we need to do now with anti-gravity is go over to this website actually login which is going to be awesome. So let's go ahead and do that
awesome. So let's go ahead and do that right now. Beautiful. And after signing
right now. Beautiful. And after signing in, it's now complete. And you can see this in manage MCP servers. And look at this guys. I've got everything here. If
this guys. I've got everything here. If
you don't see it, just hit refresh. And
then it will repopulate because what's happened here is anti-gravity has added it to what we call our raw config, which is where all the data sits that describes what we're connected to, which is freaking awesome. And we have access
to all this stuff. Now what it's done is grabbed the tokens basically from the web browser. And now it's connected to
web browser. And now it's connected to our own notebook element. Now the first thing we want to do really is leverage the capabilities we've got. So in level one, what we're going to do is open up a brand new chat. And what we're going to do is first of all, and I encourage
everyone to do this is if whatever the bottleneck is in your business or the thing you're working on is describe to anti-gravity what that thing is and let's ask for five topics of areas by
the following. So check this out. Hey
the following. So check this out. Hey
there dude, I am trying to learn how to grow on YouTube. If I wanted to learn to grow on YouTube, what would be the five areas of knowledge that I would really have to nail down to make sure that I
succeed? Give me maybe like three or
succeed? Give me maybe like three or four that are specific and one or two that are hyper specialized. And all I want is five topics. A topic and a little bit of an explanation about that.
Awesome. So, what I'm going to do now is chatting with anti-gravity to get five different topics. Again, I could have
different topics. Again, I could have asked for 50 topics. It doesn't really matter. So, content and strategy,
matter. So, content and strategy, audience psychology, packaging, thumbnails, and titles. I agree that's like really important. Retention is
really important. YouTube algorithm SEO blah blah blah. So in the old world, I would have had to gone to YouTube and said, "Right, YouTube SEO, copy a video, come over here. I have and I have to do all this stuff." What I'm going to do now is I'm actually going to get this
now to create for us five different workbooks and research within Notebook LM. Awesome, dude. I want you to use my
LM. Awesome, dude. I want you to use my notebook LM MCP. And what I would like you to do is to create me five different notebooks on that. And I want to use the deep research function on each of those five topics. So I have five different
five topics. So I have five different notebooks that cover all those different areas. Okay. Bam. Awesome. And how do
areas. Okay. Bam. Awesome. And how do you know that it's working? Well, what
you're going to see in this chat window is the notebook LM MCP happening.
Perfect. I'll create five separate notebooks using notebook MC research function. One for each of those critical
function. One for each of those critical things. MCP tool notebook LM. And look
things. MCP tool notebook LM. And look
at it's triggering up. Bam, bam, bam.
So, this is what I mean when I say it can programmatically do all of this stuff. Now, if we were in a folder that
stuff. Now, if we were in a folder that had all the context about everything, you can just see like it's almost like Lego how you can build these things together and create anything you want to. So now we're going to have five
to. So now we're going to have five different notebooks spun up on those topics that we're then going to be able to ask questions about for whatever we want. Now as you can see guys, it's now
want. Now as you can see guys, it's now come down. So check this out. Excellent.
come down. So check this out. Excellent.
I've kicked off the deep research for all five YouTube 5 growth topics. Each
research will take about 3 to 5 minutes.
I will gather around 40 highquality sources from across the web. YouTube
content strategy and audience, YouTube packaging, thumbnails and titles, YouTube retention, storytelling, algorithm, SEO. I should also add by the
algorithm, SEO. I should also add by the way that I could have specified this. I
could have said I only want to hear from creators like Ed Lawrence. really cool
guy, lives out in Dubai, by the way.
Really decent dude. I could have been as specific as I wanted to. I could have had all my contacts on the left about me, which I recommend you do. We call
this business context, your business brain that has all the information about who you are, your customers, and that could influence. So, we get dynamic
could influence. So, we get dynamic research based on your specific business. This is in incent.
business. This is in incent.
But if I want to click on one as a quick for instance and I open up, you can see now that it's already doing the deep research for us, which is crazy. And I
had to open up a different web browser cuz my default is actually a different one than Chrome these days. But I left the Chrome family, I must admit. But if
I come back now to the homepage, I should see five different things. And
look at this guys. We've got five YouTube packaging, thumbnail titles, YouTube retention, story time. So it's
created for us as many notebooks as you want to. I said five. I could have
want to. I said five. I could have easily said as many as I wanted to. And
this will create for as now beautiful, wonderful research on this stuff. And
look at it's even given the prompt for his YouTube content strategy, audience psychology, understanding, view intent, and selection creating content. Again,
if I gave it more contextual information about me, it would have been even more specific. Now, the other thing I want to
specific. Now, the other thing I want to do here is create a skill to leverage this MCP. To do that, I'm just in the
this MCP. To do that, I'm just in the community. I'm going to grab my
community. I'm going to grab my anti-gravity skill resource here, which is going to be the skill creator. So, a
skill is just going to be something that we use very consistently within anti-gravity. I'm going to put a link
anti-gravity. I'm going to put a link for this down below. So, don't worry.
All these resources will be available for you so you can just grab them. But
basically, this is just going to be a new feature came in anti-gravity recently, and it describes ways in which we want it to act. So, we basically get it to do something very repeatable, very specific, and whenever it accesses that
MCP, it can follow a real cool set principles. So, let's come over to
principles. So, let's come over to anti-gravity real quick. Hey dude, I would like you to go ahead and create for me an a skill based on the blow information for accessing the MCP with
notebook LM. Please also be aware I'm
notebook LM. Please also be aware I'm going to show you all the different things that it can do. I want you to create a skill based on the blow. Cool.
Say blow skill template, which is cool.
And then I'm going to say notebook LM capabilities. Cool. And then let's come
capabilities. Cool. And then let's come over and just grab that by again come down here. Come to MCP servers. Let's go
down here. Come to MCP servers. Let's go
to manage MCP servers. Come to notebook alarm and copy all the stuff. Now one of the reasons why I want to create a skill here is because I want to have a lot of control over how this actually behaves.
So for example, there's many things it can do with a notebook, but I want to be really specific. So for example, I might
really specific. So for example, I might say whenever you're creating notebooks, always reference the about Jack section to make sure it's specific. So if I had a file on the left now that said, who is Jack? and it said that Jack is an
Jack? and it said that Jack is an entrepreneur or Jack likes to drink coffee and has white jumpers whatever the thing is you know we can be specific about you need to reference these files before going here. So for example, if I
said that my niche is helping businesses with AI systems, for example, one of the things that this would have done when it went to notebook, it said great, I want you to find YouTube niches about business and I wouldn't have to keep repeating the context because we
actually codify that into an anti-gravity skill. And you can do that
anti-gravity skill. And you can do that really conversationally by just chatting to it in the window. And then meanwhile, if I come back over here, you can see now it's actually got 38 different sources. So at the moment, one of the
sources. So at the moment, one of the limitations is it won't automatically import it. But there's two quick ways
import it. But there's two quick ways around that. One is you just click the
around that. One is you just click the import button yourself. The second
though, if I come back over, what I can actually do here is say, "Hey dude, it's created all five of the different resources. What I would like you to do
resources. What I would like you to do is to go ahead and import them on all five of the notebooks. And what I'd like you to add to your skill.md is that whenever you create these notebooks in the future, after a few minutes, call it
5 minutes or so. I want you to manually open them up in the browser and basically import all of them. So I don't need to do any further actions."
Beautiful. So you see now how valuable the skill is because we explain it once we throw it in skill.md which is amazing and then anti-gravity and notebook lm.
It basically codifies how I want it to behave. It's got the tools but it's me
behave. It's got the tools but it's me saying this is how I want you to go ahead and use those tools. Kind of think of it like it's instruction manual. So
now we've covered exactly how to create infinite numbers of notebooks that are specific and tailored to you without you doing anything apart from yapping to anti-gravity. We've covered how we put
anti-gravity. We've covered how we put those into the skill. The next thing now is how we actually go ahead and leverage and use these skills in any kind of project or something that we're building within anti-gravity because when building them is one thing but then
utilizing within a project or a chat interface is something completely different. Now, one of the things that I
different. Now, one of the things that I want to do alongside this, as you can see, it's just executing all my requests now in terms of opening up the browsers and things, is what we can do is in anti-gravity, and one of the main benefits of anti-gravity is the fact
that we can head over to the agent manager, which means we can have multiple agents working on this project at the same time, which is awesome. So,
I'm going to click on open agent manager. So, all you do is you start a
manager. So, all you do is you start a new conversation, you select the notebook you want to chat with, and then this is an additional agent working on the same thing. So, here's the thing I want to do. Hey dude, what I would like you to do on the left hand side is have
what I call notebook LM brain resources or some or call it something cooler than that. I just want a quick doc that
that. I just want a quick doc that explains basically all of the different notebooks that I have access to on the left hand side. Awesome. So I'm going to send him off to do his thing which is awesome. So you can see now on the left
awesome. So you can see now on the left hand side I've got notebook alm. I have
one where he's gone now actually. Here
you go. He is now working on that for us in the background and it's using that MCP tool to grab a list. Awesome. Then
I'm going to spin up another agent to do something slightly different for us. And
I should also call out guys that it's already bought in all the resources. I
mean check this out. So 49 resources for content strategy and audience psychology. 48 resources. 49 resources.
psychology. 48 resources. 49 resources.
This is crazy. So for example, if I now come back over to Google Chrome, you can see now that it's basically built in for like 50 different resources. Look at
this. This is crazy. And if I go back to the homepage now, let's see it's done it for everything for all these five. There
we go. You can see. So best way to test this is now just to ask it a question.
So, what I'm going to do is come over here and give it something like, "Hey there, dude. I'm starting a YouTube
there, dude. I'm starting a YouTube channel speaking to basically I want to talk about English Springer Spananiels.
Could you do me a favor? Query notebook
LM and find the best most relevant advice to help me start that channel, how to make my first videos, and maybe any tips that would be really relevant for my particular situation. I have the capacity to create three videos a week."
Awesome. And whilst that's working in the background here, I'm actually going to create a folder on the left hand side. Going to call this new file. I'm
side. Going to call this new file. I'm
going to call this one jack.md. All
right. And then what I think I'm going to do is within this skill is describe about me. Hey there, my name is Jack. I
about me. Hey there, my name is Jack. I
have a YouTube channel talking about the English Springer Spananiel. I have the capacity to do three videos a week. I am
pretty bad at communicating on camera.
My passion to monetize this is to fund the Springer Spaniel Rescue Center charity. That's my whole goal and
charity. That's my whole goal and objective. Whatever it is, right? So,
objective. Whatever it is, right? So,
I've given it some information out about me, what I want to do, which is awesome.
And then what I want to do actually is basically tell anti-gravity this skill that whenever it's referencing the beam, it needs to understand and reference that skill. So what I'm going to do here
that skill. So what I'm going to do here as well is we're going to go back over to the agent manager. So we can call up another AI tool and I'm going to give it something interesting. So let's come to
something interesting. So let's come to notebook LM which is our thing and we click on this plus. Hey dude, I want you to update the skill on notebook LM and just basically say whenever you reference notebook LM, one of the things
that you must do is check the information within this folder so that it is contextual. Okay. And then what we do guys is we just do a shift app and what we can do is click jack MD. So that
tells it the file that I'm talking about. So what I've told this guy to do
about. So what I've told this guy to do remember how do you toggle between these two things? Anti-gravity has two
two things? Anti-gravity has two windows. Okay, that's all you need to
windows. Okay, that's all you need to know. You have the agent manager where
know. You have the agent manager where all the agents live. Okay. And you have the editor. The editor is what we're
the editor. The editor is what we're doing here. Everything we've been using
doing here. Everything we've been using for most of video. And then the agent manager is this beautiful thing here where we can chat to all of these different things at the same time. And
again, I could in theory be working on six or seven different projects. And
some people say that people in white jumpers cut multitask, but we'll see about that. So we come back over, come
about that. So we come back over, come to editor, and you can see now we're going to have updated the the skill, which is really freaking cool. All
right. So now let's come down and have a look at everything that's happening within this window. And one of the things that you can see, guys, which is very, very cool. So I'm going to save that JackMD. We want to make sure we've
that JackMD. We want to make sure we've got that sort of stuff done. And there's
our resources. Again, all the tabs just appear there, which is great. And as you can see, guys, after that question, we can see the MCP's been basically asked the question and the answer we got back from the bookm. If I scroll down here,
we've got all of the advice. So, we're
niche down. We got weekly content mix, hybrid funnel strategy, hook mastery, thumbnail psychology, build trust and connection, algorithm focus, and example schedule for the weeks, which is freaking amazing. And we got all of that
freaking amazing. And we got all of that from our incredible resources with the notebook Ellen. So, then I might say
notebook Ellen. So, then I might say something like, "Hey there, dude. Do me
a favor. Could you make an action plan on the left hand side called YouTube strategy for me based on this information? Awesome. And again, we can
information? Awesome. And again, we can go back and forth, ask further clarification questions. We could even
clarification questions. We could even if we want to get anti-gravity itself to build and develop a strategy by speaking to the notebook and actually have these self-contained iterative cycles where
the AI here is quering that AI and the resources to build out the plan, which is going to be incredible. And just like that, I've now got this beautiful YouTube strategy down here on the left hand side that I can follow and advise based on the information from
anti-gravity. So now we're having
anti-gravity. So now we're having full-blown conversations with our notebooks. We're creating them. We're
notebooks. We're creating them. We're
having conversations to inform strategy.
This is the bit now where we can take it to another level, which is why level three is about using the resources and knowledges that we have within notebook LM to actually create and build something really interesting to build an
application with an anti-gravity. So
here what I'm going to ask it to do as an example and of course we could use our classic blast framework for building anything within anti-gravity but I really just want to showcase the capabilities here. So I'm going to ask
capabilities here. So I'm going to ask the model I'm going to say hey I would like you to build me an interactive one pager HTML based on all the information that you can get from the notebooks.
Specifically what I'd like you to do is be interactive and just be as helpful as possible on all of this information. It
should be something they can look at visually beautiful engaging phenomenal.
Okay fantastic. Now, as we know from every video I've done on the channel, we can make these dashboards look gorgeous.
We can do dashboards that are connected to CRM. We can do basically dashboards
to CRM. We can do basically dashboards and websites that are interactive and kind of like animated. There's so many things we can do. The capability I want to double click on here out of respect for your time is the fact that we're
leveraging the notebook knowledge to build something. And once you know how
build something. And once you know how to leverage that notebook knowledge, essentially you can build it into any part of the application that you like.
So, I didn't just want to build like an app. I want to build something based on
app. I want to build something based on all the cool information that we got from the bookm which we can now do via anti-gravity. And what's really
anti-gravity. And what's really interesting here guys, if you actually come in and double click on this, you can see the kind of queries that we've given it here, right? So take a look at this. So one of the things that we ask
this. So one of the things that we ask is extract specific mathematical formulas, metrics and benchmarks for YouTube growth, outline ratio, CTR targets and goals. And then we've got the out part. Okay, awesome. Well, what
else are we asking to? Well, we've got another notebook here. List power words, psychological triggers for titles. What
specific combinations of visual elements, faces, arrow, contrast work best? So this is going to be about
best? So this is going to be about thumbnails. Awesome. Then we've got
thumbnails. Awesome. Then we've got another one here which is going to be about what are the specific engagement techniques to build blah blah blah. You
can see it's quering different notebooks with different kinds of questions and all this knowledge exists there and we just bring it in when we need to.
Wonderful. So now basically anti-gravity's finished designing this and turning this into an interactive dashboard. I could click on this for
dashboard. I could click on this for instance right now which is awesome. And
we got the spring spananiel command center advanced YouTube strategy and operating intelligence system. Cool.
Obviously we could do anything we want to with this design. But the primary goal is three videos a week. Vite watch
time, micro niche, which is cool. I can
connect this to my YouTube channel. I
could do anything. I could scrape. I
could do literally a billion things with this. So, let's see. We've got the
this. So, let's see. We've got the growth lab. So, outlier ratio, video
growth lab. So, outlier ratio, video views. So, let's just say that I don't
views. So, let's just say that I don't know, we just get something like 10,000 video views. Top subscribers could be
video views. Top subscribers could be 22,000. Results ratio. Viral outlier
22,000. Results ratio. Viral outlier
detected. Really cool. We got health check down here, which is cool. So, it's
a clickthrough rate. Let's say that's 8%, which is really, really high.
Average view duration, let's just say that it was, I don't know, 52%. Viral
profitability. I mean, this is really cool, right? So, it's based on all the
cool, right? So, it's based on all the kind of things and then we've got a little checklist built in. So, one man rule, we can take things off as we go.
We can also connect this to Superbase that will just save all these things for us. We could build this out in any way
us. We could build this out in any way we want to, right? It's really cool. But
the cool thing is it's all designed around the entire knowledge base we've got. So, basically, you can spin up any
got. So, basically, you can spin up any app or dashboard. The other cool thing you could do if you wanted to is say for example, you're doing some compliance for a business, right? ISO 9,000
whatever compliance. What you could do is do full research for 40 50 pages then have that built in and turned to apps.
So for example, if I have a page on my website talking about ISO 9000, one of the things I can do is basically say hey anti-gravity go to my ISO 9000 knowledge base and just make sure that everything's accurate. It will pull down
everything's accurate. It will pull down a specific questions and then query notebook LM to make sure that every part of it accurate based on a knowledge base. So you can see the potential with
base. So you can see the potential with these connections. So now we found that
these connections. So now we found that we can build literally any application connected to anything. Level four now is actually about programmatically creating slide decks, presentations, audio
overviews, anything. So essentially what
overviews, anything. So essentially what we're going to do in level four is basically once we've create these beautiful resources, we can now from the herman comforts of anti-gravity create pretty much anything we want to that can
be created within anti-gravity, excuse me, within notebook element itself.
Okay, so this is cool. Why don't we, for example, ask this now? I'm going to say, "Hey dude, could you do me an audio overview on the YouTube database within notebook LM around hooks? I want to
generate one of the audio overviews for that and then also if you can create me a presentation that I can view also."
Thank you. Also use the notebook LM MCP to do this. Okay, fantastic. So we've
specified it, sent it off. So let me just show what this looks like in reality. is if I click on this as a for
reality. is if I click on this as a for instance again you can create audio overviews you can create mind maps you can report and basically the the MCP's configured in a way that we can do that within anti-gravity so why is that
really cool well it's cool because let's say for example that I want to learn about anti-gravity I want to learn about watches I want to learn about the Jack Robert school community and all the cool places that we're meeting up this year whatever the thing is right I can spill
up all these individual scenarios like from all these resources maybe you're moving to Australia or Berlin and you want to learn about the tax and there's like 10 topics we can do this programmatically clean anti-gravity, turn it into audio overview, and have all the files ready for us just to
listen to. So, you don't even need to
listen to. So, you don't even need to come in here manually click things. And
look, generating audio overview. You
didn't even I didn't even guys, my hands were here. I didn't touch a single key
were here. I didn't touch a single key on this keyboard. And it happened almost by magic. Except it isn't magic. It
by magic. Except it isn't magic. It
happened in anti-gravity, which is crazy. And look, I come back over here,
crazy. And look, I come back over here, guys. We've got the audio overview
guys. We've got the audio overview that's been requested, the slide deck, which is great. It's like, dude, build me a slide deck. Build me an audio overview. We can do this for all the
overview. We can do this for all the notebooks we create. Remember, we can create like an infinite number of these notebooks. to the extent that notebook
notebooks. to the extent that notebook 11 will allow you to create like a billion. I don't know what the limit is,
billion. I don't know what the limit is, but you get the idea. As many as you want to. Then this very nicely brings us
want to. Then this very nicely brings us on to level five. So level five is the ability to take any of the files on mass from your own laptop computer and actually create a notebook from them. So
for example, you had several meetings with clients and you want to chat to all of them. Or it could be things in your
of them. Or it could be things in your business that you want to chat about later. Literally any files you got on
later. Literally any files you got on your computer or any knowledge base local we can actually upload. And that
could be text, it could be anything. So
I'll show you exactly how to do that.
Cool. So now we're in anti-gravity.
Let's have a think how we're going to do this now. So there's a couple of
this now. So there's a couple of different things. So when it comes to
different things. So when it comes to storing this information, we could do many different things. So for example, let's say that I create a random piece of information. Like I've got jack.md
of information. Like I've got jack.md
here, right? And I've got notebook brain resources. So how about we try something
resources. So how about we try something like this? First of all, hey the dude, I
like this? First of all, hey the dude, I would like you to create a brand new notebook, a notebook, and I want you to add jack.md and notebook_brain
add jack.md and notebook_brain resources as two resources within this notebook. Thank you. Awesome. So, first
notebook. Thank you. Awesome. So, first
I want to show you is that I can literally tell anti-gravity, hey, this is what I want to do and just add these two things to it. And look, it's automatically identified what they are.
It's going to add it in and do that for us. Meaning that we can essentially take
us. Meaning that we can essentially take any text we want to and that is anti-gravity. Okay, so I have
anti-gravity. Okay, so I have successfully created a notebook and added both the resources. So, let's go ahead and check if that's true. So, we
come back over. This guy is just finishing the audio overview, which is awesome. Let's go to the homepage and
awesome. Let's go to the homepage and have a quick look. So, if we were to refresh this one real quick, let's see what we've got. All right, give it a hot second. It's reloading and oh my gosh, I
second. It's reloading and oh my gosh, I didn't know we wanted to spring manual.
It's a little bit controversial, some might say. All right, we've got it here.
might say. All right, we've got it here.
It says, let's take a quick look. And
we've got jack.md. Hey there, my name is Jack, which is cool. Okay, we like that.
We're very familiar with that. And then
we've got notebook resources, which is everything we mentioned, which is very, very cool. But what if we had a file
very cool. But what if we had a file that wasn't text? What if it was like a PDF? So, let's come down and download
PDF? So, let's come down and download this one for example and see if it will add that to notebook LM. So, bring this over. Click on download. Now, typically
over. Click on download. Now, typically
speaking, when you what we call rag, which stands for retrieval augmented generation, I did like YouTube's like biggest master class on it. I'll put it somewhere on screen for you. But the
bottom line, it's basically how you store information. Now, typically when
store information. Now, typically when you rag documents or text, it's dead easy. But PDFs can be strange. PDFs are
easy. But PDFs can be strange. PDFs are
weird. But this is why anti-gravity is so cool because there's no problem. I
like to believe there's no problem too big that we can't overcome with the right thinking and strategy tools. So,
I've downloaded this PDF, right? I'm
going to head back over to anti-gravity.
And what I'm going to do, and what I recommend that you do, by the way, is you right click. You click on folder.
Okay. And in this folder, you could just say something like notebook to add, right? And then you could add a new
right? And then you could add a new folder which is notebook added, right?
And essentially what we do is we explain this in gemi.md about what this is. And
essentially as soon as it's added, you could think of a better naming convention, but you get the idea. When
it's finished, you just move it over. So
we have got over here notebook to add.
So all we're going to do is come over and drop our PDF into anti-gravity, which you can do by grabbing and just simple drop right there. So now it's in the environment. And look at this. We've
the environment. And look at this. We've
got all this cool stuff. So, I've got anti-gravity skills. I'm going to add it
anti-gravity skills. I'm going to add it in notebook to add. Sweet. And it's a window. So, I'm going to say is, "Hey
window. So, I'm going to say is, "Hey there, dude. I want you to add every
there, dude. I want you to add every file within this folder into that notebook for me." And then let's just tag the folder, which is going to be notebook. Uh, what did we call it? To
notebook. Uh, what did we call it? To
add, right there, it's got one file in it. And when that's complete, please
it. And when that's complete, please place the file into this folder. Right.
And then we just crr and just do notebook added. Okay. So, I've just said
notebook added. Okay. So, I've just said to the complete folder and I've just renamed it complete. I don't think you can tag it unless it has a document in it. Let's just now send this one off.
it. Let's just now send this one off.
So, it's got a PDF. So, we'll see how anti-gravity processes that for us, which is going to be awesome. And if it doesn't process that. So, say for example that you've got something that is like 50 pages long. Anti-gravity can
actually create a script to basically translate that into text for us, which is really awesome. And you just say, "Hey, I want you to create me a script for a skill that will transfer it from this into this." And it'll do that for us instantaneously. Okay. So, this is
us instantaneously. Okay. So, this is really good. So, this has struggled now
really good. So, this has struggled now with converting it in PDF. So, what
anti-gravity is going to do now is actually take it from PDF to text. And
you could leave anti-gravity in the background to do this for us. We could
also turn this into a skill or a script that would just do it for everything where it identifies the file type. Then
based on that file type goes and does whatever we like to. And then all you do is just grab the files that you want to put into a notebook and you just drop it into the section and you'll use this for your business. Maybe you've got SOPs
your business. Maybe you've got SOPs that you want to leverage. There's a
million different things you can do where the documents change on a very regular basis. The other cool thing here
regular basis. The other cool thing here is that if you're building tools and systems that themselves create documents that you then want to put into notebooks, you can just do this all completely automated with this system.
And just like this, guys, what anti-gravity has done since you can't load a PDF through this method is converted to text and then uploaded it, which is awesome. So, it's created a Python virtual environ. It's done a lot of crazy stuff, but the TLDDR of it is
it's all ready to rock and roll. So,
let's head over to notebook now and validate that's happened. And then I've come over, I've refreshed the page, and would you believe it guys, the anti-gravity school creator PDF has finally arrived and we can see all of the information there on the left hand
side. And so generally with this MCP,
side. And so generally with this MCP, this is like an unofficial one. In other
words, it's not from Notebook LM themselves. If you ever run into any
themselves. If you ever run into any problems like, hey, I can't get this kind of document type. Anti-gravity can
help you troubleshoot that and build a system to make sure you can get any files and documents over there. And if
you're not sure how to do something, you can ask the questions and troubleshoot as you go.
>> Beautiful. So, now we've cracked all this amazing stuff around Notebook LM.
The next thing we're going to look at now is how you build beautiful, gorgeous websites that clients pay thousands and thousands of dollars for that make you stand out so far from all your competitors. I'm going to go from
competitors. I'm going to go from beginner to advanced. I'm going to show you two systems. One to get started to get you rocking and rolling. And the
second one is how we take it Interstellar. Let's jump straight in.
Interstellar. Let's jump straight in.
Gemini 3.0 is amazing. It can build amazing websites. It can build
amazing websites. It can build incredible AI systems. But if you combine it with growth systems, you can get outlier results. We want a beautiful
website that converts viewers into buyers will accelerate your business that you can even sell to clients. It's
easy to build and deploy. And you can even leverage AI in it, which I'm going to show you how to do in this video. And
to make this magic happen, we're going to use the four-step site framework that's going to take it from ideas into a gorgeous website that kicks butts and gets results. S stands for strategy.
gets results. S stands for strategy.
Now, a lot of people just skip this step and go straight into creating, but that kind of sets up a false economy. When
I've sold websites to businesses, one of the things that really crushes isn't the design, even though that is now amazing.
It makes a huge difference. It's the
fact that it solves the business problem. So, just take a second to think
problem. So, just take a second to think about this before we jump in. What boat
we're rowing in is more important than how hard we row. And when we combine that with Gemini's capabilities, we kick. So, strategy. First thing to do is
kick. So, strategy. First thing to do is to choose the overall purpose of the website in your endeavor your business.
Okay. Is it behind number one which is cold traffic you're sending there? If it
is then we primarily want to give them a lot of value and do some kind of diagnostic to warm them up, add more value and get them down off. If it's
warm traffic, we're looking again to add value but progress more towards getting some kind of commitment on the page. And
if it's outbound traffic, in other words, you're reaching out to businesses and saying, "Hey, I want to work with you. We can outbound stuff." It's more
you. We can outbound stuff." It's more important to build trust. And if you in doubt, always treat basically when I had this conversation with Alexis. We had a really interesting chat about this that if you treat warm traffic like cold
traffic, they'll still convert better anyway. But it does change how we
anyway. But it does change how we position the whole website. And we need to know this. Now, ask yourself one question. What is the viewers state? And
question. What is the viewers state? And
by that, I mean, we've got to ask ourselves a couple things. What are
their three biggest problems? Because
we're going to want to address that in the actual website design and copy. And
it all blends together nicely. We have
the design and then we have the content to achieve the thing we want to get.
What do they already believe before clicking on our website? What are they unsure about and what made them click?
And once you've thought about those questions with a beautiful cup of coffee, it's time to go on to the second step in our site framework which stands for interface. So, at this point, the
for interface. So, at this point, the first thing we want to do in the interface section is to get a mood board of things that we think are cool or look great. The best site that I found for
great. The best site that I found for this right now is Dribble. You go to Dribble, you can pretty much type in any keyword and find gorgeous websites that you like that. The other one that you can use from more of a code perspective, and I'm going to show you some
interesting things in this video that you've probably never seen before in terms of a design that's going to blow your mind and how you can replicate designs in a crazy crazy way. So, you
can check out Codeepen. And then another great one is Mobin, which gives you great designs, graphics, dashboards, whatever sort of stuff that you need.
Mobin itself, guys, I'm not sure if I pronounced this correctly to be fair, is pretty freaking wild. Like look at this.
They've got cord in there. They've got
all these different AI assistants.
They've got it for mobile. They've got
it for web. You can literally tagle here to go from iOS to web and just take a moment to kind of browse around the shop and see what you like. So you can check out by categories, but obviously in dribble, you just enter any information
that you want to. And then of course we've got Google AI studio. And I'm also going to show you, by the way, guys, how integrating AI into the website itself will actually drive way more sales and drive your business forward because that
was one of the core features I found when I saw my 8,0001. So, what are we going to look at first? Well, I think in this video, what would be cool, and I've deliberately not thought of something ahead of time because I wanted it to be organic and interesting. There's one
website that I've seen that I think looks really cool, which is base 10, which we're using for our text to speech startup glider. And I like the kind of
startup glider. And I like the kind of applelesque feel of it. I like the dotted line feel of it. I think it's a really nice interesting website. So I
was thinking for this video we could do one on something like dental agencies.
So maybe we want to work with dentists and our business helps them implement systems to scale their business which is a lot of AI work in that. So let's say for example we like this and I want to kind of use these dotted lines because
it's a kind of systematic way of doing things. So I want to make it look like
things. So I want to make it look like it is a system for applicable way of doing it. So, first thing you do is just
doing it. So, first thing you do is just grab the mood board and then you're going to come over to Google Studio and start pasting in. A cool little hack that you can do as well, by the way, is head over to Canva, open up a whiteboard
like this, okay? And paste it in and then add a little bit of text underneath it. So, you come down here and you say
it. So, you come down here and you say something like hero section, okay? And
we're going to make that bold and probably a bit larger. So, we're both going to give it the actual information and we're also going to write it down here. So, we can be specific about what
here. So, we can be specific about what we like about each bit and where you want to do what. So, again, Gemini is really clever. Um, but again, you need
really clever. Um, but again, you need to give it some specific. So, I like the hero section of that. I think this is decent. Okay, beautiful. I think this is
decent. Okay, beautiful. I think this is all we need from base 10. So, we'll say goodbye. Then you're going to come
goodbye. Then you're going to come around and have a little look. So, if I just come down here and I said website, let's see if we've got anything interesting. And you're pretty much just
interesting. And you're pretty much just going to have a little look around and browse and find websites that you think are really interesting. So here for example, let's just say we wanted to look at finance because they typically have really gorgeous engaging websites.
I love the style of this. I think this is so nice. I mean if you look at this guys, it's pretty insane. And we one click copy it which is fantastic. You
can come down and have a look and see whatever you want to do. This one really caught my eye here. This Gemini. So I
I'm going to do guys is actually copy and grab that. So let's come down and just uh steal it. Steal it with pride as they say for design inspiration for the purposes of this which is really cool.
So come back over to UI elements and you can see you've got everything here. So
let's come down and just copy that.
Fantastic. Come back over and throw this one over here. Beautiful. And then we come back over to Google Studio and again we throw that one in there. And
then let's give this a bit of a section which is I do want hero section. And
actually I'm going to amend this to say this is how I like dotted line and monochromatic.
Actually, instead of monochromatic, if we just come down and give it a specific piece of feedback, like I know this can seem a little bit like it takes a bit of time, but you'll save a lot more time in general because we want to oneshot this as possible. And then let's also add
as possible. And then let's also add this in for testimonials cuz I think this is gorgeous. So, you pretty much like like a dream list. Just grab any design components that you want. Now,
they do follow a very there are there's a structure to creating websites that does convert. And I'm going to cover on
does convert. And I'm going to cover on this outside of the design point because that's so important to understand. So,
come over here and then we're just going to put this in here. And then we are just going to say design. We come over to Google AI Studio. Drop that core image in. And then what we're going to
image in. And then what we're going to say here is just simply testimonials.
Testimonials.
Beautiful. All right. Nice. Now we've
got this. We've kind of paired the feedback to the image. I'm going to add a bit of a background thing in here just so that it's clear on the dotted lines of Canva what we're looking at. Send
this all the way back.
Awesome. And then let's make this white so it looks nice and tasty. You'll know
when you watch my videos like I tend to get stuck down these design rabbit holes. Like I did it in my community. It
holes. Like I did it in my community. It
was really funny. So in the classroom for example, I went down I had to have this like dotted connected artwork cuz I was like I spent the whole day doing it and I was like I get these I don't know I get these things sometimes and I'm
like dude I just I just think design is just so important to do. It genuinely
is. That was one of the biggest piece of feedbacks I got my first tech business actually was that the website was so good and crisp. people just assumed like I had one guy said oh dude you must have
had like millions in funding and I was like dude we didn't we actually didn't we bootstrapped it to start so it was really funny we get that feedback it that's a difference that it makes so we've got the mood boards which is
awesome now we're going to come and give it a prompt and we're going to establish first of all the design aesthetic the sections and then after that we're going to look at the second part which is going to be the copy and what we want to
do is a kind of easy three-part structure prompt so for example we might say something like Hey, I would like you to design for me a website for an agency that helps dentists scale their business
using proven AI systems. Okay, beautiful. And then we want to give it
beautiful. And then we want to give it some information about the kind of stylistic guidelines and then reference to this and then we can add more specifics at the bottom. So I'm going to come and grab from here some stylistic
guidelines I thought would be really handy and interesting. So let me open up these and we're going to need that conversion blueprint in a second. So
we've got like a design elements cheat sheet. So these are things that we can
sheet. So these are things that we can add in if we want to, right? Like sol
animated background. I think that is really cool. So let's add this one here.
really cool. So let's add this one here.
Let's go for soft animated background light beam texture. Bam. So if I want to add this in, I'm just going to come over to this uh style
to add in these components.
Bam. And then we've got the things like intentional micro interactions, everything reacts. I think that'd be a
everything reacts. I think that'd be a cool one for us to have as well. Let's
add that in there. Yeah. So after we've added this one here as well, you can basically just go through and decide what you would like. I'll show this as a link down below so you can grab it and have fun with it. Just different kind of components that you want like depth layers, strong typography, whatever you
want to. Then the next thing you want to
want to. Then the next thing you want to do is give it like an effect or a style to replicate. So we could do it in
to replicate. So we could do it in anything we want to. So you can decide is there like a particular business that you like the look of that you want to replicate. I think the cell is really
replicate. I think the cell is really nice. So if I just said in the style of
nice. So if I just said in the style of Vel, I think that is gorgeous. Let's
come back over to over here. And then
I'm going to put this one here which is fantastic. Come back. And then at the
fantastic. Come back. And then at the bottom, I've got these like design specific prompts that you can use, which is like anything that you want designwise to change that you think are going to be great, just come down here,
grab the ones that you want to add an amend, and you pretty much go and you're going to come back over here. The next
thing we need to do is add the structure of it. So before we do that though, let
of it. So before we do that though, let me just specify here. I'm going to say I would like you to use the reference images that I provided and copy that style first and foremost, then use the below for additional context in your
design. Beautiful. Okay, we had this one
design. Beautiful. Okay, we had this one here. And then what I'm going to say at
here. And then what I'm going to say at the bottom in terms of structure is I'm going to have I would like you to use this website structure. Okay. Now, what
we're going to have here at the top is simply this. You're going to start with
simply this. You're going to start with a hook at the top. You're going to have a promise of value, a value proposition.
Underneath that, the next section you're going to have then is going to be a essentially is going to be the value proposition. More details. So, two or
proposition. More details. So, two or three things about the value proposition. Then we're going to have
proposition. Then we're going to have proof. And then we're going to have a
proof. And then we're going to have a CTA at the bottom of the screen. Now,
when you do this, this is all going to be influenced by what you did in the first section, which is going to be the strategy section. Then, when we're happy
strategy section. Then, when we're happy with that, we are effectively going to shoot this off and let it build and create some magic for us in the background. And whilst Gemini is
background. And whilst Gemini is building that, I'm also going to show you a new hack that you might not have seen before. Now, let's say, for
seen before. Now, let's say, for example, there's a website that you like. Um, I'll tell you, a really good
like. Um, I'll tell you, a really good one is this one, which is designjoy.co.
So, this is a really beautiful website.
I think it's great. It looks gorgeous.
Let's say that you find a website that you want to replicate. Exactly. Now,
most people will say all you're going to do is take a screenshot, right? They'll
come here and it'll take a screenshot and blah blah blah. What if I told you that basic and you'll know this, but a website is basically HTML and you can download a website. So, what you can do is you
a website. So, what you can do is you basically come over and grab one of these HTML downloaders. So, if I just say HTML gra
um like very poorly explained, but you get the idea. You can go to view page source. So see and download any code
source. So see and download any code from any website. Find a website that you like, grab it, come back over, throw it in the URL. Um, click on view source code and this will be the exact code that you've got for that website. So
we're going to come down and then we will do I believe it's stylized code like so. And then we've got all of this.
like so. And then we've got all of this.
So simultaneously what I'm going to do guys is come down and show you a secondary strategy that if you've just got one that you really like, you're like, dude, I just want to replicate that website. You can do something like
that website. You can do something like this. So, what I'll do once I've copied
this. So, what I'll do once I've copied that is come over to AI Studio.google.com/apps.
Studio.google.com/apps.
I'm going to open a new one. I'm going
to say, "I would like you to create for me a design agency website using the below HTML code. Make it gorgeous and beautiful." Bam. Okay. Enter the HTML
beautiful." Bam. Okay. Enter the HTML code and then we accompany that with different screenshots. So, you basically
different screenshots. So, you basically come down, you screenshot, you come back over, you throw that in, and then you just screenshot a few different elements that you like, that you think are decent. And I'll show you how close you
decent. And I'll show you how close you can actually get with this. It is pretty wild, but you'll see for yourself in a second. Now, I'd never recommend that
second. Now, I'd never recommend that you just lift and shift websites. It's
not a good way to do this. But what is really helpful though when you're doing things like this is that there's lots of things that you want to innovate on and be different on, but website structures that convert viewers into buyers and
certain design principles. You don't
need to actually innovate on all that stuff. So, this is now working and
stuff. So, this is now working and pipping and popping in the background.
Let's come back over to the initial one and see how we're getting on. It's
developing it and it shouldn't take too long. and then we'll get our very first
long. and then we'll get our very first example to look at. Beautiful guys. So
we have dentist scale. Did you realize fill your chairs on autopilot? So it's
got some animations in the background that needs to loop properly. So that' be something that we need to be specific about the operating system for your growth. This is really lovely. I love
growth. This is really lovely. I love
this. It's kind of like you can see as I hover over it, there's a kind of orange hue that appears there. Amazing. And
then this is really cool. That kind of soft fade and connect collaborate launch measure impact. So we can see some cool
measure impact. So we can see some cool stuff here. And then we got feedback.
stuff here. And then we got feedback.
Scale your practice and we are ready to rock and roll. But how are we getting on now with the design joy thing? So check
this out. You're not going to believe this guys. Look at this. You'd be you'd
this guys. Look at this. You'd be you'd be remiss for thinking it's the same thing. Look at this. It's not exactly
thing. Look at this. It's not exactly the same, but to be honest with you, just off that like and it's it's even got the same logos, which is crazy. It's
got these things coming down here. One
subscription, many possibilities. It's
literally copying it verbatim. And even
down to this, we can copy it like this.
It is actually freaking wild how effective that is. And you can just copy the HTML like this to get a good basis if you want to follow a website structure more closely. The next thing I want to do guys is grab this eightstep conversion blueprint which effectively
is all the stuff we want on a high converting uh page basically to turn viewers into buyers. So what I come down here is grab this right here. And as you can see we've got the value proposition, the proof, the fraction CTA, the
follow-up, the debug. So I'm going to come back over then and give it one nice tasty follow-up prompt over here. So
once we've refined the design, you're going to go back and forth. Now,
typically speaking, it's better to try and what we call oneshot the whole thing in the sense that you get it to design somewhere near like 90 95% of the design that you want on your first gun because
it's easy to a amend. Now, good thing to bear in mind with Gemini here with all these things is that it can take what's existing and change it, but if you're asking it to reconstitute the entire design every time, it just gets stuck
down these rabbit holes, even though it is incredibly effective. So, I would rather you hit a fresh blank slate if you feel the design's not getting to the right point. Now, the next thing we do
right point. Now, the next thing we do in this page realistically is look at the copy. So, you want to change the
the copy. So, you want to change the copy to something that's actually going to resonate. So, we want some kind of
to resonate. So, we want some kind of hook at the top. We want some kind of proof and credibility that's kind of easy to look at. And this brings us nicely onto the T section in our site's framework, which is text. When we're
very happy with the design and the visuality of it, we're going to design this website perfectly. We're going to have at the very beginning a hook to grab their attention. There's different
methodologies. Effectively, we can use things like a frustration hook, like dentists frustrated that you're not getting any clients even though you're working very hard every week. Or we
could have an offer hook, which is dentist, you know, dentist, we'll get you 20 new leads in 30 days or you pay zero. So, some kind of hook, a little
zero. So, some kind of hook, a little explainer about what we do, ideally a visual image or something in the background. Then, we want a little
background. Then, we want a little flirtation with the logo's and credibility. Then we go straight into
credibility. Then we go straight into the value proposition which is price is what you pay, value is what we get. And
you explain that in a bit of detail.
Then after that, we kind of want to go through a bit more proof so people know what we're doing and how it works. This
could be testimonials from clients, include videos, include images. So for
example, if you look at this thing I had a while ago on um my community, this is full of testimonials of people who've been in the community, either got their first clients, got their first
automations, you know, goes on and on and got all these videos. We're very
blessed to have as many success stories as we do because what we do talk about works. You basically fill that stuff
works. You basically fill that stuff into the page to kick some butt. Then
once you've done that and you've got the kind of text nailed down, the last thing we want is a what we call a clear next step because you've made a great promise that they care about. You've shown
you've explained it in detail. You've
shown them why you're credible. And the
next thing is a very clear next step.
And this is where we get to our framework. The E which stands for
framework. The E which stands for engine. An engine is the enhancement
engine. An engine is the enhancement side of the website. How you take it from this to this. Now, when I saw my last one for 8,000, one of the core criticalities I had in there was a
chatbot that would take the email and book leads. Now, what's really cool is
book leads. Now, what's really cool is that you can integrate any AI component you want to into the website. It's
crazy. And I'm going to show you how you can do two of those right now. The first
one is going to be a chatbot. Now, to do that, we're going to head over to the wonderful 11labs.io. So, let's load this
wonderful 11labs.io. So, let's load this bad boy up. Let's log in and kick some butt. So, you can build agents. They can
butt. So, you can build agents. They can
be voice agents. They can be conversational agents. It could be
conversational agents. It could be anything that you want to. So, the first thing we do is come and sign up, which is fine. On the left hand side, let me
is fine. On the left hand side, let me just come through. We're going to go with a Let's go with a business agent, which is great. We'll do healthcare and medical, and we'll do customer. Let's
doling. That's fantastic. Call this one, Maria.
And then our website could be something like, I don't know, monza.com.
Your main goal is to provide a helpful experience to the client and to book a 50inute discovery call with Jack, our head of growth. Awesome. Okay. Chat only
or audio? We can be either. We're just
going to do chat only for this, but it could be audio. In fact, you know what?
Let's do it. Let's make a speak. I'm
going to come down. Okay. Need a https.
Okay. Beautiful. And then create agent.
Okay. Did I not do this? That is crazy.
Oh, I added one t too many for a British person. That's pretty wild. Okay, that's
person. That's pretty wild. Okay, that's
loading up. And once we've done this, guys, we can just basically configure it to do anything that we want to. So, I'm
going to show you two different versions that we can do on this. So, there's a new agent configuration that let you scribe in real time. Redesigned agent
config and a new widget, which is cool.
So, on this, you've got a personality that you can work through. You've got
different voices. Like this is Eric, for example. He can play some different bits
example. He can play some different bits and pieces. You can decide which one
and pieces. You can decide which one that you want to. That's what it sounds like.
>> Is riches. Complain is power. Okay,
we're going to go with Stokes because Stokes is great. But basically, you can pick any of these ones that you want to if you wanted to have an auditory like, you know, make an audio thing. And then
we can have the language. So, we would prefer to have UK English, I believe, which they don't have. So, we'll just go with unless they have United Kingdom.
They don't seem to. That's interesting.
Yeah, we'll just go with the States then. That's fine. We'll come down here
then. That's fine. We'll come down here or we can do Italian. I wonder if actually, my apologies, the accent is actually driven by the voice. That's
just English is always going to be English there. So we have all this stuff
English there. So we have all this stuff which is cool and we just click on save when you basically customize this and go through everything you want to and then you can come down to over here and I think it is under preview agent. Then
you can have a conversation with it to do whatever you want to. So you can expect and connect it to all of your apps which is very cool. And to do that you come over to workflow. You can build it workflows. You can do knowledge
it workflows. You can do knowledge bases. So you can give it like all the
bases. So you can give it like all the information add documents policy documents things about your website. So
if you say hey Jack what do you charge for XYZ? It can tell you that. or like
for XYZ? It can tell you that. or like
can you give me examples about companies that you worked with before? It can do all of that stuff. Then it has tools.
These tools can then do things like end the conversation, transfer to agent. So
if it's having a like chat with somebody and it's not getting enough, it can loop you in and do some really cool things.
Then under widget section, you can actually embed this. So what we're going to do here is copy this. We're going to come down here and I think we can save and we're ready to rock and roll. You
can come back over to Gemini and then you can save this. I would like you to embed this chat widget into the website.
Okay. So once you've done all the customization, obviously we cover a lot more about that in the community, all the kind of cool AI tech and how you level it up. But just to give you TDR of respect for your time here, you can just
then copy this embed code which is HTML which will call 11 Labs and then install it within the website. Meaning now that you have this gorgeous website which loops we've got all the animations, we've got everything that we need and then we're going to have this additional
chat functionality in there too. Now
while this is rendering in the background, I think actually this very second I think it's just complete. It
has Oh my gosh, guys, check this out.
So, if I come up and I full screen this, let's have a look. You're now going to have this in the bottom right hand corner, which means that you can do things again. It it could be chat only.
things again. It it could be chat only.
It could be anything that you want. We
accept and we could just send a message.
If it was chat only, it would just be like a chat bot. I'd be like, "Hey man, how's it going?" Boom. And then it'll stop responding to me and we'll have a full conversation. And then we equip
full conversation. And then we equip this with agent tools. We can connect this to automations, clap emails, book calls, whatever you want to. So, this is very cool. But let's say that one of the
very cool. But let's say that one of the CTAs that went on the website wasn't just to book a call, but what we actually wanted to do is give them like an order or something free. One of the things we can do is build a questionnaire into it. So check this
out. I would like you to develop for me
out. I would like you to develop for me a questionnaire embedded at the bottom of the form. The value proposition of this is find out how much money your
dental practice is losing every month by not having email systems installed.
You're going to ask them four questions.
Their email, their number, which is optional, their name. You're going to ask them what their average value per lead is and then how many email subscribers they have and then how many emails they send per week and then click
submit. Okay. Then what we're going to
submit. Okay. Then what we're going to do is actually grab uh an AIP software.
So we're going to head over to GoH High Level. Now Gohigh Level is amazing
Level. Now Gohigh Level is amazing because it lets us build loads of automation sequences out and emails and texts and loads of cool stuff like this.
So for example, what I can do with GoHigh Level is send the information over there to anything. I can send it over to NAN. I can send it over to anything I possibly imagine. You're
going to come on the left hand side right here. Going to come down to this.
right here. Going to come down to this.
And then when you're in your account on the left hand side, you're just going to come down here to automation. And then
when you're on automation, you're going to open up a brand new automation very quickly, which is create workflow, start from scratch. And all we're going to add
from scratch. And all we're going to add into this is a web hook. And web hooks just connect things to other things.
Because what we do here, guys, is grab the information from our app and then bring it over. So, we come over here.
We're going to add a new trigger. We're
going to go for web hook, inbound web hook. And it will give us a web hook
hook. And it will give us a web hook address. And we copy it. And then you're
address. And we copy it. And then you're going to come back over to our design, which is over here, I believe. I'm going
to say send the information to this web hook. And you paste it in. Oops, not
hook. And you paste it in. Oops, not
quite that one. Let's come in and make sure we get the correct web hook address from go high level, which is here.
Right. So, let's come down. All right.
Now, we've copied it. Now, we can enter in and we're ready to go. Send this
prompt off. And then we're going to have a form that will then connect to go high level. And then we can look at how we
level. And then we can look at how we publish it, deploy it, and kick some butt. And just like that, we now have an
butt. And just like that, we now have an update. So let's check out what the form
update. So let's check out what the form looks like. We're going to scroll down
looks like. We're going to scroll down and have a look. And we should see a form on the page. Wow, look at this. How
much money are you losing? So in
reality, we would want to change the design of this, but obviously this is just to get it live and rocking and rolling. So I say, hey, I'd say my
rolling. So I say, hey, I'd say my practice name is Dr. Teeth. Okay, Dr.
Teeth. We'll say it's teeth at Outlook.
Phone number, we'll leave it. Value per
lead is going to be something like $500.
Uh, and then total email subscribers, we'll have 10, two, three, 10,000. Email
sent per week will be one. Then
calculate my loss revenue. Click on
this. It's calculating for us.
Calculation is complete. Awesome. Now,
if we head over to go high level here and I come down, I click on fetch sample requests. Let's one second. It looks
requests. Let's one second. It looks
like it hasn't sent that. So, let's just confirm this one more time. Grab this.
If I just say trigger uh mapping reference. Let's see if we can reference
reference. Let's see if we can reference payload. Nothing's come up yet. So, what
payload. Nothing's come up yet. So, what
we do is come back over to our scenario real quick and then we just give it that feedback that didn't come through. Hey
there, dude. You just need to make sure that you send that information through to the below web hook. When I complete the form, it doesn't actually happen.
Also, give the form a white background so it stands out a bit more and make it top to bottom rather than having questions left to right. And then we give it feedback and send that back off.
And then we can try that one more time.
So, now we've redone this. I've entered
some information and we click on calculate my loss revenue and we'll send this one back off and then we just come straight back over to go high level and then we should see the reference page load. So we come down here and as you
load. So we come down here and as you can see it's pulled through successfully and then we've got all of the data. So
we save that trigger and then the next thing that we do in go high level guys is we've created the contact which is awesome. Uh one moment. So what we need
awesome. Uh one moment. So what we need to do first of all is add a field. So we
had a field we select on email like so and all you're going to do is come down here click on this button here find the hook and type email. So this is saying look Jack you've asked me to create an email where am I grabbing that email
from? We're saying look well you're
from? We're saying look well you're grabbing it from the web hook. Okay then
we add another field and the other field might be something like name right so could be full name and again we just select the inbound web hook trigger and then we it has automatically pulled
through everything for us. So then here we could say great well here is their name and you can keep doing this grabbing information grabbing the financial data and then what we can do once we've created that is simply send
an email. You can also send SMS which is
an email. You can also send SMS which is cool. So I can send you a text message I
cool. So I can send you a text message I can send you a WhatsApp message. I can
send you email sequences and obviously you can build that a really beautiful email sequence to do that by clicking send on email and it goes through the whole process. And typically speaking
whole process. And typically speaking your email sequences it's great to send at least five. Most people don't respond if they don't get response on the first email. But as you can see, having a
email. But as you can see, having a system like this where you're setting things back up personalized user message can really improve conversions and all the sales are happening the more emails that you actually send up there. So now
we've got the website all ready and we're happy with it. The next thing you want to do is actually download it. So
you're going to come down here and you click on download app so click on save.
This is going to download all of these files for us, okay, onto our computer.
Then when it's on our computer, we can edit it, get it ready to put onto GitHub, make any final changes, and then whenever we want to edit it, we have a folder on our computer that says a website, and then we can change it and
do a million different things. So, what
I want to do is head over and download this if you haven't already, which is cursor, which is basically a place that lets us edit code on our laptop. You
could use things like VS Code. You could
use things like anti-gravity, which is Gemini's one. It really is up to you. I
Gemini's one. It really is up to you. I
like to use a combination of anti-gravity and cursor. Then when you download cursor guys, you'll have something that looks like this. So the
first thing we need to do is unzip the thing we downloaded. So come over to your downloads, double click on it and dental scale AI will appear by magic.
Then in cursor we're going to open up that folder to let us edit it. Okay. So
come down here to file, click on open folder, select dentist. Fantastic. And
then this is our new app. Now what I like to use personally is claude code.
So and come down here and click on show terminal. Now claw code you need to use
terminal. Now claw code you need to use in a terminal. So to do that, you need to install it. And to install cloud code, it's dead straightforward. We're
using Claude, by the way, cuz it's like the most powerful model for editing things alongside Gemini 3.0, which we could use in anti-gravity, but I want to show you everything. So you've got it.
So you just come down, you literally just copy this code and paste it into the terminal, and you're ready to rock and roll. So once you've done that, and
and roll. So once you've done that, and it's downloaded, you type in Claude.
Claude will appear. This thing on the right is how you chat within cursor basically. But what I'm going to do here
basically. But what I'm going to do here is right click and I'm going to align this panel to the right. Cool. So, what
I'm going to do if it will actually do that, it's misbehaving at the moment.
Panel position. Right. Thank you very much. So, first thing I want to do here
much. So, first thing I want to do here is I would like to upload this to GitHub. I would like you just to go
GitHub. I would like you just to go through the files, make sure it's as good as possible, make any amendments you think are valuable, and then I would like you to upload it to this GitHub, please. Okay. What we're going to do is
please. Okay. What we're going to do is actually put it into plan mode. Plan
mode just lets it think a little bit more detail. And then we head over to
more detail. And then we head over to github.com. We're going to come down
github.com. We're going to come down here, click on new, and then we're going to create it. We're going to call this one dental 5000. And then we can hear like dental website, something like that. Change visibility will be public.
that. Change visibility will be public.
And then click on create repo, which is awesome. And then you're going to copy
awesome. And then you're going to copy that git. Come over to cursor and then
that git. Come over to cursor and then oops, I need to just read this message cuz I sent that ahead of time. So just
undo that and paste this one in. Cool.
So we give it the proper paste and then we're going to be ready to rock and roll. Cool. And then cursor comes back
roll. Cool. And then cursor comes back some questions. So, we know it is indeed
some questions. So, we know it is indeed public, which is fine. And then we want minimal security issues. Moderate
security and cleanup comprehensive. So,
just answer the questions that it gives you. I think we're going to be fine with
you. I think we're going to be fine with we can go with any level we want to. So,
we want to go for moderate MIT license.
No license is going to be needed. And
then, yes, professional setup is cool.
And we submit answers. And the cool thing you can do if you want to take your website from this to this, you basically say to Claude, you go into deep think mode. You explain the context and the purpose of the website. And you
can actually ask it to go through the entire website line by line to improve anything that you want to. And it will sit there ruthlessly going through the entire website and improving the code. I
did this with my text to speech startup Glido. And honestly, the co the copy and
Glido. And honestly, the co the copy and the quality was insane. So I'd say before you publish it, spend time with it sparring with it and make it amazing.
So we say yes, we're happy to also accept edits. So we don't need to keep
accept edits. So we don't need to keep it pressing one. Maybe it's good for workout actually. A little bit of a
workout actually. A little bit of a rotator cuff training there. Then after
this guys, it will actually then push it through. You accept it and it said it's
through. You accept it and it said it's now published live to GitHub which you can go and validate very quickly. And
now I'm on the GitHub. Let's go over to the code. And if it's worked, we can see
the code. And if it's worked, we can see now guys, check this out. It's all the code there. It's perfect. Now the cool
code there. It's perfect. Now the cool thing is whenever you edit this with Claude, this will update for us automatically when we tell it to do that. We call that pushing the changes
that. We call that pushing the changes live. So think of it like checkpoints in
live. So think of it like checkpoints in a game when you you don't want to go from level one to level 999 without saving it. We need to save it as we go
saving it. We need to save it as we go right through the key. But the cool thing is now is now we've got the code on this repo which is available to everybody. So if you wanted to make this
everybody. So if you wanted to make this protected, we would turn it to private.
The way that you do that is clicking on settings. Scroll down and you'll see
settings. Scroll down and you'll see here visibility which will be set to public. Where are we at right now? Down
public. Where are we at right now? Down
here. Change visibility to private. And
it'll mean that only you and everyone in your house including your dog and Springer Spananiels can see it. Now it's
there. How do I get it on a website and how do I get a call domain which no one shows you but we're going to cover that.
So, you're going to head then over to Versel. Really cool freaking website
Versel. Really cool freaking website blown up. This is where bolt.new pushes
blown up. This is where bolt.new pushes
all their stuff. You're going to come down on the right and click add new and add project. You connect this to GitHub,
add project. You connect this to GitHub, but it just opens a new browser and signs you in. On the left, you're going to see Dental 5000 3 minutes ago. You
click on import like so, which is decent. It auto selects the framework
decent. It auto selects the framework and click on deploy. If you try to push this to GitHub directly from AI Studio, one of the things I noticed is it just never seems to load. You end up with a
black screen of death. When you take it to your computer and you have an actual model sit around with it, play around with it, move some things around, it just actually physically works. It does
all the different changes to make sure it's ready to be website. And I think a lot of the reasons for that is dependencies. Actually, you need to
dependencies. Actually, you need to install the dependencies and that means it can be visible based on the beautiful frameworks that you have ready to rock and roll. So, we click deploy and hold
and roll. So, we click deploy and hold on one second. And just like that, guys, it is now live and rocking and rolling.
And check this out. It's got window this hanging out. There's loads of things
hanging out. There's loads of things going on. You can scroll down. We've got
going on. You can scroll down. We've got
interactivity. We've got loads of stuff happening. And let me show you. If you
happening. And let me show you. If you
come back to cursor now, now this is published. I want to show how cool this
published. I want to show how cool this is. If I say, look, book 20 new
is. If I say, look, book 20 new patients. Let's say I want to say
patients. Let's say I want to say something like I don't like 20. I might
just say, hey, change it from book 20 patients to book 27 patients. All right.
I push that in. Bam. Now, check this out. It's working in the background. I
out. It's working in the background. I
want to show you how this works because it's crazy. We'll have a little thing.
it's crazy. We'll have a little thing.
This will update it. This will update GitHub and then GitHub will update Versel automatically for us now that it's live. So, I want to see I want to
it's live. So, I want to see I want to let you see this in real time. See how
crazy this is as we give it a hot second just to complete that. See, it's edited the code there. 20. It's got rid of that. Anything in red is what it removed
that. Anything in red is what it removed and green is what it replaced it with.
Right? Then it will say, "Hey, it's now complete. It's ready to rock and roll."
complete. It's ready to rock and roll."
And we can go back over and see that it's complete. So, if I come back over
it's complete. So, if I come back over to Vel here, you can see we've got everything here. Guaranteed all you pay
everything here. Guaranteed all you pay $0 blah blah blah. Very cool. This is
the page where I can do anything I want.
I can effectively if I want to change the domain name on here. So, let me just show you where that is. If I click on domains, buy domain, I can then enter the thing I want. It will let me buy any domain, which is coolspringerpananiels.com,
the greatest website in the world. Add
that in. I could change it. And then I can just set it. And now I have a beautiful client website for my business, for my clients. It works well.
Then I come over to the page and I refresh this. Do I see 20 or 27? Buck
refresh this. Do I see 20 or 27? Buck
27. Crazy. And I'd recommend that when you're building apps that you really like that you do use Gemini 3 and also Claude 4.5. If I open anti-gravity, I
Claude 4.5. If I open anti-gravity, I can do the exact same thing by opening the folder. I can open the same thing
the folder. I can open the same thing that I downloaded over here, which is dentist AI. And now I'm just This is
dentist AI. And now I'm just This is exactly the same thing, guys, as we just played with on the actual app, but instead we're doing it and using it in anti-gravity. I like using both Gemini
anti-gravity. I like using both Gemini and Claude because, you know, if you want to have credit to one, you can use the other. And both models are so
the other. And both models are so powerful. Some people say 4.5 edges it,
powerful. Some people say 4.5 edges it, others say that Gemini edges it. I like
to use both for different reasons and have a great time doing it. And so now you've covered the basics. What if you wanted to build something truly spectacular? What if you wanted to build
spectacular? What if you wanted to build an animated website? Well, turns out we can actually pair together a couple of really simple like apps and technologies to give actually like scroll stopping
animated websites. Let's dive straight
animated websites. Let's dive straight in. And so this is the kind of website
in. And so this is the kind of website that we're going to build today.
Something that is gorgeous, animated, is going to be beautifully responsive. As
you go down, you're going to see it's essentially as you scroll through, it is just gorgeous. It's animated. Lots of
just gorgeous. It's animated. Lots of
incredible things happening. You're
going to learn how to build literally all this kind of stuff. You can see the kind of interactivity with these kind of beautiful designs and animations. We're
going to show you exactly how you build all of this kind of stuff with an actual back end where users can create accounts. So they can go test@test.com
accounts. So they can go test@test.com and we'll look at this whole account right now. Boom, beautiful names. And we
right now. Boom, beautiful names. And we
can even add an email address, call it google.com, which is beautiful. They can
sign up, they can access dashboards, they can pretty much create anything they want to and save that information.
And as you can see, everything is super responsive. So with anti-gravity and the
responsive. So with anti-gravity and the systems in this video, we are going to build websites that look gorgeous that are full stack, which means has a beautiful backend and a front end.
You're going to be able to create loginins. It's going to be SEO
loginins. It's going to be SEO optimized, and we're going to be able to do that easier than ever before with no code, I might add. So, this is all possible for two reasons. Now,
anti-gravity skills and Google AI Studio. Now, I've tested this. I've
Studio. Now, I've tested this. I've
tested so many different methods. I
spent a while going through this. I can
give you the best stuff that actually works when brand new stuff gets released. But let's just start with
released. But let's just start with skills to explain exactly what I'm talking about here. As we know, skills are basically like instructions that we can include within our integrated development environments or ids like
anti-gravity. It can include code, but
anti-gravity. It can include code, but the TLD of it is they basically power up anti-gravity, right? They kind of like
anti-gravity, right? They kind of like if you imagine Neo in the Matrix when he's trying to learn kung fu and they plug it in the back of his head and then he knows kung fu. That's kind of how anti-gravity skills work. And all you ever do with it is you literally just copy and paste or you just say, "Hey,
download this and it will add it to your anti-gravity skills repo, which is really cool. Now, the skill that we're
really cool. Now, the skill that we're going to talk about in this video is this new skill, which is the UI and UX pro skill. This is to show you how
pro skill. This is to show you how quickly this is blowing up right now.
This is code for blowing up very quickly, by the way, which is really awesome with over 20,000 five stars review at the time of recording. And
just to give you a sense of what it did, I ran this I basically built a website and I ran it through the skill. And this
is just some of the stuff that it did for me once it ran through all the changes. It did all this and this and
changes. It did all this and this and also this. And I didn't have to do
also this. And I didn't have to do anything. It did over 50 individual
anything. It did over 50 individual changes uh to improve accessibility, UX, SEO, and performance improvements. It
has 100 design plus rules, 57 UI styles, so your design looks amazing. It does
SEO optimizations so you can get more traffic and conversion intelligence so you can get more customers and also UX and UI frameworks so more people can use it. I'm not affiliated with these in any
it. I'm not affiliated with these in any way at all. And before I even wanted to do a video on this, I wanted to test specifically does it actually make a difference and will it build a better website? And if it didn't, we wouldn't
website? And if it didn't, we wouldn't touch it. All right, Jack. So, what is
touch it. All right, Jack. So, what is happening? What what what does all this
happening? What what what does all this mean to us? Well, this is where Google AI Studio comes in, which if you're not familiar is basically Google's online version of anti-gravity. And there's a reason for this. And it comes down to
the design philosophy differences between anti-gravity and Google a studio. And I'm going to show you how
studio. And I'm going to show you how you can leverage both of them to make way better gorgeous applications. So the
design philosophy behind AI studio is to make something that looks really impressive. Their approach is to
impressive. Their approach is to basically throw the kitchen sink at it.
And again, we can improve this in a second. And the result really needs to
second. And the result really needs to be visually striking and wow factor. But
drawback to this is the fact that it's not necessarily constituting a web. It's
very scalable for a website. like it
might break if you try to add things.
So, it's not very like well structured, but it's visually gorgeous. By contrast,
let's talk about anti-gravity and how this thinks about designing websites.
Its design philosophy is to make something professional and maintainable.
It is to make incremental improvements, best practice, accessibility, and then polish and functional, but less flashy.
And so, in this video, we're going to cover all these best practices for creating actually gorgeous websites that aren't coded with just one sentence. And
then we're going to combine that with two core concepts which comes down to basically the sequencing and the anti-gravity skills all to build a beautiful design operating system. So
what this means in this video we're going to build a beautiful website with the design operating system skill and we're going to be able to create a login so users can have an account and we're also going to deploy it so you can edit make any changes that you like. Now to
create this beautiful gorgeous website that enables users to sign in and is interactive and is SEO optimized we have to do only three things. Now, the first step is to create a beautiful front-end
website using AI Studio. So, this is the AI Studio interface. We're going to use this to whip up an initial first shot that we think looks kind of cool. We
just want this to be more like 80% correct. And then we can refine it
correct. And then we can refine it within anti-gravity. Now, what I
within anti-gravity. Now, what I recommend that you do, if I just shoot over to my school community and grab this mega prompt here, this design framework, and I'll put a link for it down below so that you can use it straight away. Basically what this
straight away. Basically what this design prompt does is it draws on all the expertise from the GitHub in terms of all the individual UI and UX components just to make it simple. So
for example the way this looks like it kind of breaks down the design into five components and when we integrate that with anti-gravity it will break your website down into minor chunks and just hyper optimize it. But at the design
creation stage we can actually come down here and use this to help us to think about how we want to design our website.
So for example, you've got pattern and layout, the style and aesthetic, the color and the theme, typography, and then any animations and interactions. So
for example, if I come down to patent layout, you can think about the kind of website that you want to build. So for
instance, ooh, like do I want to build a SAS? Well, okay, cool. Well, typically
SAS? Well, okay, cool. Well, typically
the pattern is hero section, features, social proof, and CTA. And I would completely agree with that is the typical SAS thing having run a couple of SASes and I know that's the fact. Then
you've got things like e-commerce, fintech, crypto. So we can kind of come
fintech, crypto. So we can kind of come down through this document and use it to grab things like you know the style and aesthetic like is there a specific one that you want or you don't have to think of the key words like look at this soft shadows sort of gradients rounded
corners monochromatic tactile technical box shadow insert and outset. So you
don't ever want to make the prompt too long for AI Studio. You want to kind of give it a little bit of free but we want to be really specific. So you can just come down here and copy and paste the different elements that you like. And
while that's happening, let me just give you a little hack as well with Google's AI Studio is that you can actually recreate websites because websites, if you think of them, are basically just code. So, this I think is a really cool
code. So, this I think is a really cool website, but if you come down and check it out, they've got this really gorgeous, they've even got all this stuff going on there, which is awesome.
They've got this really gorgeous animation down here on the pricing, which is at the bottom. You can see there's all this really cool stuff. So,
if you wanted to recreate that, you can actually copy the website URL. You
basically head over to Google and then you just type in HTML website extractor like so and then you're looking for view page source. When you click on this one,
page source. When you click on this one, give this a second to load up and you will see some of the wonders what it can do. You literally click on this. You
do. You literally click on this. You
type that in like so. And click on view source code like that. And then what we can do is download the website basically onto our computer. So you click on download like so. Download comp. And
then what you can do within any of these websites is you can actually add this file just like that. And if you give it a prompt and just say, "Hey, rebuild the website with this HTML." It will actually understand some of the HTML assets. And so, for example, this is one
assets. And so, for example, this is one I did earlier. Like, as you hover over it, it's got that gorgeous, beautiful animation. You can see the spacing. It's
animation. You can see the spacing. It's
just such a good and beautiful design inspired by the other website. So, you
can use that to level up certain parts of your HTML. I never ever recommend that you just like copy a website. What
you want to do is take inspiration and be inspired by. And if there's specific HTML components you think are cool, you can use this to help like grab and kind of like develop those aspects of your own website. A cool thing you can do as
own website. A cool thing you can do as well within Canva, and it doesn't have to be Canva, it can be anything, is to create kind of like a bit of a mood board. So you can head over to different
board. So you can head over to different websites, grab it, and then what I recommend you do is just number them.
Come on left hand side, type in say for example the number three like that. Grab
a three or just type three. I mean, this is a pretty wacky three to be fair, but it helps you explain it. So you could say, "Hey, I want the hero section to look like this." Like hero like this.
And then you may say something like XY you know testimonials like this right you know whatever the thing is right so you can actually help basically AI studio understand that then all you do from your Mac just command shift 5 get a
screenshot and then you can literally just copy that and throw that into AI studio to get a really good prompt and then you might wonder where do I get inspiration from well let me just grab and show if I'm in the community just to show you a few examples of this let me
come over and grab all these different websites where basically you know you can just open up and find website inspiration of things dude I love the look and style style and feel the feel of that and you kind of go through and you can check out these different
websites, these different designs.
Dribble's a really cool one for websites and dashboards generally to give you some cool inspiration where you just kind of type in the thing that you like and you can come down and yeah find websites that you think do not do that kind of really reflect kind of brand
identity that I like. Like you may think, hey, this looks really freaking cool. So this is a gorgeous website. So
cool. So this is a gorgeous website. So
you may say, hey, I want my hero to look like this. And then you simply come down
like this. And then you simply come down and you might screenshot that and use it as inspiration whilst keeping your own brand identity. So, for example, then
brand identity. So, for example, then you come back over to AI Studio and you paste that in and say uh hero section like above. And then if you're not sure
like above. And then if you're not sure on like how you want your brand guidelines to look, but you know a certain brand has something that you want inspired by, if you head over to fircroll.dev, one of the things that you can do in fcral.dev on playground for
example, is actually enter in a specific brand. So I could type in for example
brand. So I could type in for example glido which is the thing that I speak with on my videos. Beautiful speechto
tech startup. So I come in, I type in glido.com and then format. Come down,
type in branding, and then click on start scraping. And then I show you our
start scraping. And then I show you our website for instance, glido.com, which by the way, completely built using the system. The exact same thing for free,
system. The exact same thing for free, five times faster. You see got nice little hover animation. It's got a very specific style. So for example, I come
specific style. So for example, I come back over here. Now, what this will do when you come down and click on branding, it will show you not only our logo, our favicon, the original image, it will show our entire color palette and the fonts that we use. And then you
can use this to prompt and guide AI studio to give you designs that look really cool and obviously like all this sort of stuff which is really freaking decent. And I really like this kind of
decent. And I really like this kind of vibe here, this kind of style. I think
it's like really freaking cool. So if I come down to this building website thing, one of the things I would really like is this for like a SAS. So it's to say we want to do a little bit of a SAS for example and let users log in.
Whatever use case is we just copy this and then come back over to AI Studio and then we can literally come down here and throw that in. And then we want to give it a little bit of an inspiration. So,
hey, I'm building a website design agency that helps viewers, basically helps our clients turn viewers into buyers. And the way we do that is
buyers. And the way we do that is building gorgeous, beautiful websites that actually convert. And then we can just lent here, which is really decent.
And you just kind of come through the document, add bits in you want, add your mood board in, and just kind of free flow style with it. And if the first version isn't perfect, completely cool.
Just open up a new chat window and spin it up. And this is completely free to
it up. And this is completely free to use. So, you're not even spending any
use. So, you're not even spending any credits to do this. And so as you can see from this website I have learned on you might have guessed it glido brand guidelines. So you can see how you can
guidelines. So you can see how you can pull in different aspects elements. So
we build gorgeous websites elevating digital presence through scientific design. We don't just build sites. We
design. We don't just build sites. We
engineer conversion engines and we got this beautiful starite animation. Secure
your order. Really really cool. Scroll
down. These are some of the brands that we work with. Got a nice transition engine for performance. So six different things that we do. Very cool. Ready to
convert. Secure a slot. I like it. Free
AI conversion critique. Okay. We could
play around with that but you get the idea. And this can analyze a website. So
idea. And this can analyze a website. So
it's got a really cool inbuilt feature.
Plans at scale. And let's see.
Ridiculously cheap. Totally free.
Serious business. Do you know I I really think it's it's pretty cool, right? And
then you come down what our partners say. And I can just see as many or as
say. And I can just see as many or as few as I want to. And then we got the thing at the bottom. Really freaking
cool. All built with AI Studio using the techniques I just showed you. So then
what do we do after this? Well, what
we're going to want to do then is actually post this onto GitHub. So how
do we do that? Well, first thing we do is exit out of here. And then what you want to do is click on this save to GitHub thing by clicking on this. I'm
going to give it a repo name. We'll call
this one something like, I don't know, let's call it gorgeous websites, right?
And we can just do the same thing for description. We'll make this public for
description. We'll make this public for the time being. Come down and create git repo. If you're not familiar with what
repo. If you're not familiar with what git repo is, it's basically just a online site where we put code. It's just
it's like it's like a Dropbox. You just
store your files into it. It just keeps all that different things. And it's cool because if you create a git repo for a website and you want to share that with somebody else, like we have some of those resources in our community like all my personal AI systems that help me scale my businesses. You can go into
those GitHub repos and download it.
Meaning you don't need to create it yourself. So, it's really freaking cool.
yourself. So, it's really freaking cool.
So, we've got all these cool things. We
stage and commit changes. It just means we push them live. And the cool thing now is that this is now in our GitHub repo. So, we could share this with
repo. So, we could share this with others if we wanted to. But most
importantly, what it's going to enable us to do now is let our anti-gravity download and grab that, which is really freaking cool. So, how do we know it
freaking cool. So, how do we know it works? Well, you just click on this. It
works? Well, you just click on this. It
opens up. And would you believe it? Here
are all the exact same files. How
freaking cool is that? Now, the only thing we're going to do is click on this code. And you're going to come down and
code. And you're going to come down and you're just going to copy this. Awesome.
Then the next thing we're going to do is go ahead and download anti-gravity.google if you haven't
anti-gravity.google if you haven't already download it down to your computer which is cool. So basically all we're going to do ask it is to clone the repo. As you can see you just paste it
repo. As you can see you just paste it in and then essentially it will come down. It will grab all the information
down. It will grab all the information and look at this. This repository has been successfully cloned. It looks like a react typescript project. Here are the files blah blah blah. Here are
directories. Awesome. So as you can see everything now is in rocking and rolling and downloaded with an anti-gravity. And
so now we have the project in anti-gravity and we've got our first shot of what our website looks like.
This is the point where we take it from zero to hero. We're going to go through the entire thing and basically get like an AI operating designer brain. Now,
this involves heading over to this GitHub repository. As you can see, it's
GitHub repository. As you can see, it's got everything in here. UIUX Pro Max.
And this kind of explains everything that it does in a website, all the specifics. Now, this isn't really
specifics. Now, this isn't really necessarily just about the design. The
biggest asset of this actually is also about user experience, accessibility, making sure it's got all the different relevant features that make it epic. And
you can see the level of effort and specificity. 66 67 UI styles. Loads of
specificity. 66 67 UI styles. Loads of
really cool things here. Look at the general styles it's got. Look at the landing page styles. Look at everything it's got. It's really freaking cool. So,
it's got. It's really freaking cool. So,
how do we actually go ahead and grab this? Well, couple ways you can do it.
this? Well, couple ways you can do it.
One is you just copy everything, which is a really easy way to do that if you want to. But effectively, what I
want to. But effectively, what I recommend that you do is simply arrity skill. Awesome. Now, you don't
skill. Awesome. Now, you don't necessarily need to pay for all this sort of stuff, but it is really easy to do this kind of thing. And then what anti-gravity is going to do now is grab it. So, bear in mind, we have these
it. So, bear in mind, we have these different design philosophies with these online builders. They make it look epic.
online builders. They make it look epic.
Now, what we're going to get anti-gravity to do here is to actually make it functional and scalable so you can build multiple websites. It's very
scalable. It can be mobile optimized. It
can tick all of the boxes so you can get more clients or help your clients with the designs itself, which is awesome.
And I think one of my favorite things about this plug-in, which is really cool, is the fact that it'll actually go through from an SEO point of view and make loads of changes to it, which is really freaking cool. And just like that, guys, look at this. So, for
example, it's now added it. If I bring this out, so you can see we've got the gorgeous website, which is our website.
But then, if you come to this Gemini skills UI Pro Max, you can see all these workflows. It's got the markdown file
workflows. It's got the markdown file that explains everything. It's got this Claude skills. It's got astro.csv,
Claude skills. It's got astro.csv,
Flutter HTML Tailwind Jetack NextJV.
All these different things are all now fully available to you from this one skill and all you said is just install it now. So the first thing that we want
it now. So the first thing that we want to do now is just basically optimize the website in accordance with the design and sort of accessibility guidelines within this skill. So for example, awesome dude. The first thing I want you
awesome dude. The first thing I want you to do is in accordance with this skill is to improve and audit the website to make it better. So it basically aligns with all the design principles outlined in the agents UI skills. Fantastic. And
then send that one off and let just go through the entire checklist. And then
what we're going to have it to do afterwards. Awesome. I'd like a just a
afterwards. Awesome. I'd like a just a general checklist of all the improvements that you've made once you've completed also. Great. Just so I can know exactly what it's done when it's completed. I'm beautiful guys. Just
it's completed. I'm beautiful guys. Just
like that, it has now gone through and analyzed absolutely everything. So check
this out on the right hand side.
Analyzed everything. And here's what it's done. UI UX improvements, visual
it's done. UI UX improvements, visual enhancements, added a scale animation, implemented glass formortism on the background drop, hero optimization, increase glow intensity from 30 to 60%.
It's just like the thousand very small micro things that a designer or you know an accessibility specialist would do on your website. navigation bar
your website. navigation bar improvements, pricing cards, polish, audit tool refinement, global styling upgrades. It has enhanced front
upgrades. It has enhanced front rendering initializing and this is the power of anti-gravity skills and you can stack an infinite number of these skills to use within your software. That's how
freaking cool this is. Bug fixes, fix toe and syntax error and then all these design principles it's applied and the impact amazing. So it's now running on
impact amazing. So it's now running on local host 3000. So let's click on it and check it out. We build gorgeous websites elevating digital presence.
We've got the thing in the background.
We've got the secure your order which is cool. We've got this hover which is
cool. We've got this hover which is amazing. Ready to convert secure a spot.
amazing. Ready to convert secure a spot.
We can have that, remove that whenever we want. We've got our different layouts
we want. We've got our different layouts here, which is decent. Free AI
conversion critique, which is fantastic.
And then we can add that in, give it a website, do some really cool stuff, and we could build that in as an AI system.
Super easy. And then we've got this.
Look at this, guys. This is gorgeous.
This is really freaking cool. We may
just want to have one as a border to kind of bring you into ridiculously cheap, but I think it's really freaking cool. And then we've got what our
cool. And then we've got what our partner site at the bottom with all those mini micro improvements, which is cool. So now we've done that. The next
cool. So now we've done that. The next
thing we want to do really is just kind of pick something that we want to improve before we let our users have let's say a login and they can like have let's say for example here where they give this website we wanted them to create an account and within that account we give them a list of
breakdowns and to-dos of things they could do on their website. That would be really cool. But before that what if we
really cool. But before that what if we were to just kind of like actually improve the website itself a little bit.
So let's think about this button here secure your audit. What if we wanted to improve that? Well one of the things
improve that? Well one of the things that we may want to do is head over to let's say we go over to 21st.dev dev and I want to find this and I call this section UI sniping. An idea of it is that you can basically find UI components. We can also head over to a
components. We can also head over to a place called code pan which is cool.
Code pen is just gives you the code directly. You can just like grab that
directly. You can just like grab that code and pull it off where you can search for components and buttons or whatever you want to. Like check out this liquid gradient. This is gorgeous.
Okay, that's a little bit kind of maybe like I don't know fantasmagoric trippy type of vibe. But effectively within copen for instance you could type in things like button or whatever you want and it'll give you resources for it.
Some things it's better than others.
Like button is a little bit maybe not as good, but you kind of get the idea. You
can kind of find these beautiful things or you just go to trending if you just want general inspiration. Again, not I'm not affiliated with these in any way. I
just think it's really freaking cool that they have these gorgeous designs.
Like look at this. How cool is that? And
then all you do if you want this, by the way, is like, okay, this is freaking so cool. Like check this out. Look how
cool. Like check this out. Look how
freaking cool this is. And just kind of deletes it. Like that's a really nice
deletes it. Like that's a really nice scrolling animation. So we could try and
scrolling animation. So we could try and play around with that if you want to.
For example, if I want that, I might just come over, copy this, head back over to anti-gravity. And then
anti-gravity, what I'm going to do is open up a new window. And I'm doing that just so I get like I don't get context rod. So these have a context window,
rod. So these have a context window, 200,000 tokens, whatever it is. But if
you speak too long, the performance goes down the longer you speak to it. So
whenever you do a task, open a new window. Hey dude, I want you to add this
window. Hey dude, I want you to add this into the website, please, down below underneath the testimonials, please. All
right. And then we just give it the code. Actually, come and grab the code.
code. Actually, come and grab the code.
So here, right, copy this and come back.
So I we wouldn't include this on our website, but I kind of just want to show you an example of how it works. So you
can get the idea of the power of how freaking powerful this actually is and how cool this works and the kind of things that you can do in these softwares. And we just send that one
softwares. And we just send that one off. Cool. So whilst this is now working
off. Cool. So whilst this is now working on our project, let's actually head over to something that we would use. So for
example, if I come over here to buttons, for example, on the left hand side, I can search for anything I want to, right? We've got this button. Do we like
right? We've got this button. Do we like this button? It's a very simple button.
this button? It's a very simple button.
Maybe I want something with a bit of a gradient on it. You can just pick anything that you want to literally scroll through, find something that you like. I like that one with a bit of a
like. I like that one with a bit of a gradient. So, I wonder if I come down, I
gradient. So, I wonder if I come down, I type in gradient. Let's see if we can find something cool. So, there's a nice gradient. You can essentially just snipe
gradient. You can essentially just snipe and find the different buttons that you want. Like this, for example, here I
want. Like this, for example, here I think is gorgeous. Look at this. Right?
I think this is beautiful. Say I wanted this on the website. What would I do?
Well, I would come over and copy the prompt, which is really cool. We're okay
for the moment. Thank you very much, 21st Dev. And then we come back over to
21st Dev. And then we come back over to anti-gravity and say, "Hey, dude. I'd
like you to add this functionality for me please onto the web page. And then
you literally just paste in the prompt and it gives you all the information that you need and it is freaking beautiful and gorgeous. And then I just literally hit enter and it goes off there for us instantaneously. And that
will now run after the previous prompt is complete. Beautiful guys. So now it's
is complete. Beautiful guys. So now it's completed. Let me give you a little tip
completed. Let me give you a little tip as well. If you ever find that it
as well. If you ever find that it doesn't do on its first try on 21st dev, a little little hack for you by the way is literally click on share component.
come back over to anti-gravity and say, "Hey dude, I want you to head over to this website and make sure you can import this and copy it line by line or give it a prompt along those lines and then you literally paste it and then it will head over and extract the component
exactly." Well, let's check that it's
exactly." Well, let's check that it's actually done that right. So, let's head over to the website now. Now, check this out, guys. This is going to blow your
out, guys. This is going to blow your mind. You ready? We're going to refresh
mind. You ready? We're going to refresh this local host. Here we go. Beautiful.
If I scroll all the way down to the bottom, do I see this? Does this look familiar? Look at this. How freaking
familiar? Look at this. How freaking
sick is this? And obviously, these can be anything. And we can put this
be anything. And we can put this anywhere we want to. Like this is literally amazing. Like this is
literally amazing. Like this is ridiculous. Then if I scroll up, does
ridiculous. Then if I scroll up, does this look familiar? Look how epic. This
is actually ridiculous. And if you scroll left or right, it just basically crushes all of it. It's actually insane.
So what I'm going to do now is basically tell it to remove this ready to convert thing and put these put this component somewhere that makes sense. So let's go back over. I'm going to say, "Hey dude,
back over. I'm going to say, "Hey dude, could you remove the book a call pop-up in the bottom right from the page? Could
you put that beautiful button animation somewhere on the website that makes sense and looks epic?" And then maybe add some text above the card animation that we've got that says something like no need to burn your credit card money or something like that. So the animation
makes sense and it's all connected together beautifully. Perfect. And we'll
together beautifully. Perfect. And we'll
anti-gravity work on that in the background. And so now you basically
background. And so now you basically have a website that is gorgeous and takes the world's best UI components and it's been completely assessed by this incredible intelligent fist design system. The next thing that we want to
system. The next thing that we want to do then is create what we call a backend. Somewhere where customers can
backend. Somewhere where customers can actually create accounts. They can add information. all that information gets
information. all that information gets stored. And to do that, we're going to
stored. And to do that, we're going to leverage a database. But I can tell you this, it's really interesting. We're
connecting something called an MCP, which stands for model context protocol, which is basically just a way, it's like a universal remote control basically that lets anti-gravity talk to anything.
You actually don't need to know loads of information about it. And it means that anti-gravity can create all these databases for us. We give it the credentials and it's effectively ready to rock and roll. So the way that we effectively accomplish this and I can
see anti-gravity is making some cool changes in the background is you click on additional options and click on MCP servers and the one that you're going to look for very simply it's just something called superbase really cool you click on that mine is installed now if you
haven't installed it all you're going to do is going to come down to configure and you see superbase action access token you click on this button now superbase you can make an account completely for free which is cool I
think you have two environments then all you're going to do is come down to generate new token I'm going to call this one website expires in how many days that you want to. I'll put mine for an hour for argument sake. Click on
generate token and then what it will do is generate this token. Then I want you to copy that. Okay? And then what we can do is just obviously delete the ones that you don't need. You won't delete this because you don't need it, but you get the idea. Now once you've done that, you're going to head back over to
anti-gravity and you're going to paste in your Superbase access token right there and click on save. Okay. Now this
is saving to your config, which is just the configuration. And when you come to
the configuration. And when you come to MCB config, you'll see Superbase there on the left hand side, which is fully enabled, which is amazing. And that
basically means you can use it. Now,
Superbase is just basically think about Microsoft Excel, but on steroids.
There's a many incredible things you can do with it. But crucially, since you've now connected it, you can speak to anti-gravity in plain English and tell it what you want it to do. And this will manage everything from storing images
and text and login. You literally name it. But there's one setting I do want
it. But there's one setting I do want you to have a look at in Superbase. This
is one thing that's really worth you learning because understanding databases is an incredible skill. It's going to make you amazing. But let me break it down the the kind of 2080 of it. Right
on the left hand side, if you come over to authentication, and I recommend that you do this just as you're building the app, just to make it easier, let's say you want to have like an email sign up.
You can click on sign in providers here, which is cool. And you can let them all sign up by email, by phone, by Apple, by Gmail. There's a million different
Gmail. There's a million different things that you can do. It's so cool.
What you can do here is confirm email, which means that we're not going to allow you to sign up for service unless you're heading to email and you sign.
That's a little bit cumbersome when you're testing it. So, typically
speaking, what I do when I'm testing the project is I'll just turn that off.
That's what I'll generally do. And you
can always see your databases and what exists by on the left hand side coming to databases, right? And we'll see on in a second. You can see this is everything
a second. You can see this is everything I've got there already. So, one for YouTube videos, trends, metrics, whatever it is. And you know, you but you can speak to anti-gravity in plain English and anti-gravity will make these changes which is really cool. And so
let's actually go ahead now and give the command to anti-gravity. Hey dude, what I'd like to do is add for me a login section with an email, a name, and a website. And then what I'd like to do
website. And then what I'd like to do when that happens is create me an account where they can basically log in with that information. It saves it on Superbase. And then in that, I'd like
Superbase. And then in that, I'd like them to have the ability to enter some information about that website. So do me a dashboard in the same style. Let's say
for example, they could be their goal, their income, and how many clients they have. And I'd like all this to be saved.
have. And I'd like all this to be saved.
So if I were to refresh it, all the information would be there. and I'd like to connect it to Superbase and let me know when that's complete, please. I
will make the form look gorgeous.
Awesome. So, we send that off. Now,
check this out. It's going to leverage the Superbase MCP if it doesn't know already. It should exactly have to do
already. It should exactly have to do that, but you're going to see that do that in a second. And actually, we wouldn't need to do any other configuration to get this set up than that. I'll just say here superbase MCP
that. I'll just say here superbase MCP just so it knows exactly what it's talking about. And as you can see, guys,
talking about. And as you can see, guys, right there, it's now using the Superbase MCP tool to do that, just like we thought. Now, as you can see, guys,
we thought. Now, as you can see, guys, anti-gravity is now complete. So, check
this out. This is gorgeous. We've got
this animate thing in the background. We
have this beautiful basically like island that falls us down. We can hover over this and see all these different options and access whatever we want to.
Trusted by industry leaders with all the companies that we're working with.
Scientific precision. Look at this animation. You hover over things. This
animation. You hover over things. This
is gorgeous. This is that beautiful bento style that we've got. Free AI
conversion critique. This is our free lead magnet. Analyze that. Now it's got
lead magnet. Analyze that. Now it's got that beautiful glow. Invest in ROI. So
we can pick our different growth packages as we like. Scroll down and then we've got all these great testimonials. And can you see how well
testimonials. And can you see how well it's adhered to the brand guidelines?
And actually, if I just come back up and show you this. This itself, by the way, can do so many different things. We can
capture emails with this. But if I come back down, you can see start burning cash on bad websites. Look at this, guys. Like, this is amazing. This is
guys. Like, this is amazing. This is
like actually crazy. And then towards the bottom of it, we've got a beautiful signup journey where we can actually capture emails and they can create accounts. And then we've got all of our
accounts. And then we've got all of our links at the bottom with this beautiful, phenomenal design. So, let's test this
phenomenal design. So, let's test this one out, shall we? So, I'll call this one alexalook.com. We'll give it a
one alexalook.com. We'll give it a password. My name will be Alexson. Maybe
password. My name will be Alexson. Maybe
I should say Patty cuz Patty's fighting this weekend. And then we got a weekend
this weekend. And then we got a weekend a kind of like a website.com for all our beautiful MMA fans out there. Then we click on access dashboard
there. Then we click on access dashboard and look at that responsiveness. This is
so gorgeous. I click on access dashboard. Remember it's alexal.com.
dashboard. Remember it's alexal.com.
Let's copy that so we can test it. Yes,
let's save the password. And guys, look at this. This is By the way, I just said
at this. This is By the way, I just said build me a dashboard and it's done it.
So we can I mean this is sample information to show you what I mean. But
you could upload photos here. You could
do anything you want to. Hey dude, my goal is to compete and take home the UFC lightweight title this weekend. Okay,
awesome. Monthly income. Let's put that at $150,000 Rooneyies and active clients can be two million clients, whatever. And we can save those changes. Changes saved
successfully. Cool. So, we got our goals, got everything we need to website, all this data. Now, here's
really cool. If I log out, for example.
Okay. Yeah, that's fine. Then, let's
just say, for example, that I refresh the page again. Now, what if I want to log in? Well, I click on login. It takes
log in? Well, I click on login. It takes
me down here past all of our beautiful cards. I actually think this is so
cards. I actually think this is so freaking cool. Stop burning cash and bad
freaking cool. Stop burning cash and bad websites. It's like your credit card
websites. It's like your credit card getting crushed and stuff. It's cool.
I'm going to put all the link for this website in the community. It's so
freaking sick. But look, we got alexal alex.com. We can come down here. I click
alex.com. We can come down here. I click
on login and let's see if it's got my information. And would you look at this
information. And would you look at this guys? Monthly income goal active
guys? Monthly income goal active clients. How freaking sick is this? And
clients. How freaking sick is this? And
we can also validate this in Superbase.
So if I head over now to Superbase this is in Chrome. Let me come over to a different web page which is going to be this one right here. So we've got users which is cool. What we can do on the left hand side is click on tables which is sweet and test this all out. So if I
come down to I think it's going to be users down here. So we click on this button here and click on view in table editor and we should see Alex right. So
just to show you how this is all connected. I've got Alex.com. Look at
connected. I've got Alex.com. Look at
this guys. Alex alex Alexen website.com.
So if I change this to Bellator.com right will that be reflected? Well let's
test it out and find out shall we? So if
I come back over to web conversions and I refresh this I'll just uh come back into the dashboard real quick and we see beltor.com. How freaking cool is that?
beltor.com. How freaking cool is that?
And again, if I go monthly income is now $1. I save changes. I come back over to
$1. I save changes. I come back over to here and then I refresh this. I don't
think we store the actual dollar amount here, but like yeah, you'll see that this is now going to be reflected. So if
I come back over to it should be on user dashboard, for example, we will see the $1 mark appear. There you go. Income is
$1. So obviously we'll need to add role level security to this. Make sure it's protected and kicking both. And the way that you do that obviously is you click on it for example and you click on RLS disabled. Just enable RLS for this site.
disabled. Just enable RLS for this site.
That enables role level security within the superbase. All right, cool. So
the superbase. All right, cool. So
that's all enabling. Very very very cool. We got for our tables and we are
cool. We got for our tables and we are ready to rock and roll. And so now we've created this beautiful gorgeous responsive website that users can create accounts with. They're kicking butt. The
accounts with. They're kicking butt. The
next thing that we need to do now is actually host it online so that people can actually log in, buy our services, and see it whenever they want to. And so
the first step of that is actually pushing it back to GitHub. So we're
going to come over here and say, "Hey there, dude. I want to push this live
there, dude. I want to push this live now to GitHub. Could you make sure that the files are in order and that everything is appropriate so I can actually push this onto GitHub? I then
plan to host this on Versel. So, please
do any necessary amendments and push this back to GitHub, please. Beautiful.
We send that one off. Fantastic. And
then what we're going to do after that is then host this onto Versel, which will take all the code that we got on GitHub and let it be a beautiful website and from Versel, we can do anything. We
can do things about we can track metrics, we can track views, page speed, pretty much anything we want to. Then
going forward, anytime I ever want to make a change to this website, I just do it here in anti-gravity. that updates
GitHub and then GitHub will because VELL is and I'll show what VELL is in a second. It's just a reflection of
second. It's just a reflection of GitHub. That's all it is. It's just
GitHub. That's all it is. It's just
reflecting the code and it just gives you extra access to do various things which you'll see in a second. So, let's
head over to the cell now and check that one out. So, good. The build works
one out. So, good. The build works there, but let me duplicate the keys in here. XS. Let me fix this quickly. So,
here. XS. Let me fix this quickly. So,
it's doing everything, all the relevant checks to make sure it's all ready to rock and roll and we'll work with Vel.
So, what on earth is Vel? Well, let's
head over and find out exactly so I can show you specifically. So, we head over to versel.com. I want you to create an
to versel.com. I want you to create an account. And all you're going to do is
account. And all you're going to do is connect your GitHub. Okay. And then what you do is you click on add new and you're going to come down to let me just move this out the way. Add project. And
what you're going to see is the thing that you created, which is Gorgeous Websites, which is really decent. And
then you click on import. That was a few hours ago cuz I just went to the cinema to watch 28 years later part two.
Amazing film. Highly, highly, highly recommend it by the way. So, this is very cool. But I want to make sure that
very cool. But I want to make sure that GitHub is updated before I deploy it onto the cell. Okay, beautiful. It is
now fully committed to GitHub, which is fantastic. So, what do we do? Well, you
fantastic. So, what do we do? Well, you
might have guessed it. We head over to the cell. As you can see, the hobby
the cell. As you can see, the hobby plan, their free plan is very, very generous. So, let's come over. We've got
generous. So, let's come over. We've got
it. I'm just going to refresh this page and then we are going to hit on the deploy, which is awesome. So, come down here, hit deploy, and we are ready to rock and roll. You might notice environmental variables. That is the
environmental variables. That is the kind of thing that you would use if you are connecting this to chat GPT or maybe you have various different things you need to do. Now, we're most likely going to need to connect basically our superb base to this. So, we are going to need
to add environmental variables. So, this
isn't going to load in the first instance, but what's really cool is you can actually connect a versel MCP to, you might have guessed it, anti-gravity, which means we don't actually need to mess around with it. But, this seems to have loaded perfectly. So, let's open
this up and check it out. All right, I'm rocking and rolling. And look at this, guys. Gorgeous website at bell.com. This
guys. Gorgeous website at bell.com. This
is amazing. I'm just even turning the brightness up now. It's how powerful this is. View our work. Look at this.
this is. View our work. Look at this.
This is freaking gorgeous. Come down.
And again, we've got everything now. And
so, it's now hosted on its own website, which is beautiful. We're going to come down again. We've got this beautiful
down again. We've got this beautiful animation. Let's now create an account
animation. Let's now create an account together. So, let's go down and create
together. So, let's go down and create one. Let's go for a different email
one. Let's go for a different email address, which is cool. We'll add a bit of a different password. The name will be John Doe. And then a website can be let's just go with YouTube.com.
All right. Sweet. Come down. Access
dashboard. Fantastic. Give that a hot second. Great. We'll save that. And now
second. Great. We'll save that. And now
we are in John Doe which is awesome because our main goal income active clients bada bading come down here save changes. Beautiful. Again obviously this
changes. Beautiful. Again obviously this is just like a sample example but you can kind of get the idea now that basically come back to dashboard and everything is still loaded there for us with all our revenue, our active clients and our main goal. Okay, beautiful. So
that's all locked and loaded but I want to secure this. And the way we're going to secure this now is we're going to make sure that the environmental variables for superbase are actually added through into this. But it's
amazing that it's live. This is how we're now going to go ahead and secure it. So click on continue to dashboard.
it. So click on continue to dashboard.
Now this dashboard here is where you can check everything. You can check your
check everything. You can check your deployments and just see how effortless it was just literally uploaded first time. You are going to get it to do that
time. You are going to get it to do that a lot more if you basically just say to it, hey, I'm going to publish this on Versell. Just make sure that
Versell. Just make sure that everything's in order for me to be able to do that. So you can see everything that you need within here. You've got
things on analytics, which is really cool. One of the things I like to add is
cool. One of the things I like to add is basically this thing here for page views, which is really cool. So you can enable web analytics. You click on enable which is fine. We can do this in the hobby view but basically just cannot
exceed 50,000 views per month. We click
on enable and basically what this lot is doing is it gives you some package. And
so all we do to get analytical view and our cell dashboard is you literally copy this. You come to anti-gravity. You
this. You come to anti-gravity. You
throw it in and then all you do is copy this. Come back over to anti-gravity. Do
this. Come back over to anti-gravity. Do
the exact same thing. That will save it and push it to GitHub. And then
underneath here, you'll get your full web analytics and you can see page views, your bounce rate, all that key data. But the first thing I want to do
data. But the first thing I want to do is make sure that we lock in superbase with the environmental variables.
Remember, but anything like that, we put in the environmental variables. And
guys, I actually have the Vel MCP within my store. And look at this. It's called
my store. And look at this. It's called
the list. So I don't even need to touch the environmental variables.
Anti-gravity has done that for me. Or
should I say Claude Sonet 4.5 with anti-gravity. And so I don't need to do
anti-gravity. And so I don't need to do anything. So if you click on this button
anything. So if you click on this button here, click on MCP servers. I click on manage MCP servers. You can see there's the beautiful VEL. Now the ones that I have activated and I'll show you how you activate it first. What I've done for
you in this document here at the bottom, I put a VEL MCP guide. So the link get API key. Basically just replace this
API key. Basically just replace this here which is insert VEL API key with the token that you create. And then I just want you to copy and paste this text right here. Come over to anti-gravity. Post it in and it'll work
anti-gravity. Post it in and it'll work for you. Now it's got 150 connections.
for you. Now it's got 150 connections.
The 10 I use are 1 6 12 13 14 15 and then I use these ones down here also as you can see the number the last one the last four I use are right there which is really cool and then it'll be able to do
the changes for you and you can validate that by coming over here heading back over to Versel and basically guys let me just run you through how you actually use those code so on here you have all your projects you click on the one that you like which is gorgeous websites all you're going to do is if I click on for
example let's say I want to get speed insights or maybe you want to get analytics let's add this in so install the package copy this. Come back over.
Let's go back to the agent. I'm going to put this in here, which is cool. And
then we come back over here and then let's copy this as well. And then throw that in also. Beautiful. Now, that will then deploy and after 30 seconds, we'll start getting visibility. So, you come
on to settings. Again, it's just like kind of WordPress. And then on the left hand side, what I want you to do, if you come down here to environmental variables, we should see superbase. And
just like that, you can see I've got superbase. And it actually shows the
superbase. And it actually shows the keys right there. And then when I come back over, you can see it's now adding in the speed component so we can start to get website insights. And that's
basically exactly how easy it is. And as
you can see here, guys, we've got Versel analytics. It's been successfully added.
analytics. It's been successfully added.
So that's all completely now and baked in there. And we can track these
in there. And we can track these whenever we want to within Versel. And
then when I come over to Vel and I click on analytics and I refresh the page, you should see now, well, we shouldn't have any page views, right? Because we've not gone live yet, but you get the idea.
We'd actually be able to track it all here just like you would do in WordPress. And so now we've covered
WordPress. And so now we've covered exactly how to complete all those websites. The next thing I'm going to
websites. The next thing I'm going to show you does genuinely change anti-gravity. What if you could get
anti-gravity. What if you could get unlimited usage with an anti-gravity using one of the most fastest growing open frameworks, fastest growing AI open frameworks on the planet? That's exactly
what we're going to learn right now.
Open code, which is the world's fastest AI coding agent. And I'm going to show you why that is significant and how that might affect you in this video. Now,
what it does when you give it access to Open Code is it gives you access to over 150 different models that you don't get access to with an anti-gravity, which will basically help you save money and
power up your building. So, if you hit limits, you're able to continue developing with an anti-gravity. Now, as
we know, anti-gravity is a coding app.
And the best way to think about anti-gravity, your kind of coding app, is as a fighter jet. Think of it as a vehicle. Okay? Now, there are many
vehicle. Okay? Now, there are many options or many different fighter jets that you could be. And the model, the person who flies in that fighter jet is the pilot. And the two pilots, if you
the pilot. And the two pilots, if you like, that we have access to in anti-gravity are Gemini and Claude. And
you can use GPT, Chat GPT, but it's a very, it's not very strong model. It's
only good at very kind of specific things. The point is that we have access
things. The point is that we have access to two brilliant models. But what Open Code does is it gives us access to a full pilot army. So when we power up anti-gravity, we can use any of these models that we want to. And you can use
these crucially from free which is one of the main benefits especially people who aren't on the top tier plan who may run out of credits you can actually use these to to save cost basically. So
instead of you running out of tokens which means that you stop building you can now continue with the introduction of this and you can even use local models. If you've seen this image before
models. If you've seen this image before you you'll know where that's funny. And
the cool thing about it as well is you can use all the GPT models using your chat GPT subscription. So traditionally
we used to have to use our our API token so you could build on token usage. But
what open code lets you do is actually your existing chatgbt plus subscription in it to code and build anything you want to within anti-gravity. You can use it within any of the co-pilots or any of
the even your terminal basically. So
it's really comprehensive like that. And
at the end of the video I'm also going to show you one of the mechanisms that people are using anti-gravity technically for free if they hit their rate limits. But I'll touch more on that
rate limits. But I'll touch more on that towards the end of the video. So let's
start by looking at what open code is.
So, as it says, it's an open-source AI coding agent. It actually ruffled some
coding agent. It actually ruffled some feathers with Enthropic who cut off access to this, but OpenAI have embraced it quite strongly, and it is, as I say, it is so fast growing. And a couple of their stats you can see, actually, if
you come down here, over 70,000 GitHub stars, which is code for internet updates. People really love it. 500
updates. People really love it. 500
contributors and 650,000 monthly devs. So, it's built for privacy first.
There's a privacy first initiative, which is really interesting. And
obviously as you look at very sensitive data it becomes quite a different thing because when you're building in these apps it's within their kind of environment. So lots of different things
environment. So lots of different things but the tilda to take away from this is open code is an open-source agent that helps you write and run code within any AI model. So think about it opening up
AI model. So think about it opening up the whole army of fighter jet pilots and it's available as a terminalbased interface desktop app or you can use it as an IDE extension which we're going to be using inside anti-gravity. So, now
we're going to cover exactly how you can get access to these state-of-the-art AI models for free and how you can get a zerocost alternative. And we're going to
zerocost alternative. And we're going to add this together in anti-gravity, but it will also work in any of these idees or even your terminal. And then I'm also going to show you one of the integrations with anti-gravity that you
can add at the end of the video.
Awesome. So, we are on the Open Code website. All we're going to do is come
website. All we're going to do is come down and just click copy on this code right here. And then I'm going to move
right here. And then I'm going to move to anti-gravity. I've created an example
to anti-gravity. I've created an example environment called Open Code. What we
need to do now is use a terminal. So as
you're familiar with in anti-gravity, most of our conversations happen on the right hand side, right? We pick the model, we pick we want fast or planning, but we're going to use a terminal for this because the other environment we may use and remember anti-gravity is an
agentic first coding platform, right? So
we often use the agent manager and we open the agent manager and we have all our projects on the left. We can do conversations and we've got kind of playgrounds etc. But when we're using open code, we're doing that in the terminal. Now the terminal is something
terminal. Now the terminal is something we can use on our computer as you can access by unmark command spacebar and type in terminal. And essentially as you can see right now it will open up for us and then this is the terminal. We can do various different things and and have a
great time with it. But we're going to use this within anti-gravity because this is the user interface that we're familiar with. So I'm going to come up
familiar with. So I'm going to come up top click on terminal. So you got file edit selection view go run terminal.
Click on new terminal. This opens up the terminal pal. And you can see guys
terminal pal. And you can see guys you've got the terminal which is basically communicating with your computer. And actually in the right hand
computer. And actually in the right hand side we can delete these. We can just literally add a new one, as many as we want to by clicking on the plus. And we
can add as many different, meaning you've got multiple parallel agents running simultaneously. So, we're going
running simultaneously. So, we're going to come down. We're going to paste in that command and hit enter. And as you can see, mine is already installed cuz it said, "Hey, Jack, it's already installed." And if you want to make sure
installed." And if you want to make sure it's installed or not, you can enter this code here, which is open code space- version. And this will tell you
space- version. And this will tell you the version of Open Code that's already on there, which is cool. And it says, "Hey," basically comes back and lets you know the specifics. So the way that we access this just like everything else when you install claude code for example if I wanted to use claude I would type
in the word claude and all of a sudden claude code would start to appear in the terminal and now I'm talking to claude code. Awesome. So as you can see open
code. Awesome. So as you can see open code is now appeared and we got this black interface but maybe we don't like it down below. So what we can actually do here is rightclick and panel position and put this on the right hand side like that right which is looking better. Now
if we want to get rid of the agent for purposes of this we can do on a Mac you can do command L I believe and that sends it away. That does cool. So now
we've got open code exactly where that used to be and you can ask it anything you want to. So the first thing we want to do with this right essentially is now we can get access to all these cool models is you can do command shift which goes from plan and build very very
simple. So what we can do here is we can
simple. So what we can do here is we can go down and we can type in models like so and it shows you all of the models that basically you have access to and you can view all of them by control and A. So if you come down control A you can
A. So if you come down control A you can see all of these different models now that you have access to. So let's say for example we wanted to use the most powerful open air models. We can do this just with our typical chatb subscription or I could just pick one of the free
models or I could connect it to open router which itself is connected to literally everything. So the way we do
literally everything. So the way we do this guys very simply to get to the model is right click and I'm going to go for connect like so. So connect to provider. Let's pick the provider we
provider. Let's pick the provider we want to go for. So let's just say you want to do open AI. And by the way there's an anti-gravity specific plug-in for this that connects the email addresses that I'll get to. And we say do you want to do your manual API key
which is just your API key or your chat GBT pro or plus. If you've got a ChatGBT account, it just runs off that. So, if I click on this one, for example, here, which is awesome. And all it says is basically copy all this information. So,
let's click on that link, open it up, and this should take us through to our Chat GBT account. And then we just simply sign in right here. There we go.
And then basically it pops up with sign into Codox ChatgPT. So, we say, hey, we're happy with that. And we click on continue like so, which is awesome.
Authorization is successful. We can now return to open code. So, we come back over to open code. And that should all be done. And now we've got all these
be done. And now we've got all these beautiful models. So, now we have GBT
beautiful models. So, now we have GBT 5.2 into codeex with an anti-gravity. So
one of the key takeaways here is you can use open code when you run out of tokens or you want to use a different model because remember all the models are specialized for something different. So
even if you're using Gemini or claude for like 99% of the stuff it's really good for you to have the ability and the skills to say you know actually this brand new model just launched I want to use it. We can now use open code to do
use it. We can now use open code to do that and you've got the skills to do that now because you have access to over 150 and crucially also open router which as you can see from that website gives you access to everything and this basically means know that you're not
beholden to any one specific model for whatever you want to do. And so now let's actually give it my anti-gravity master prompt that I use whenever I build anything out. I'll put a link for it down below. You can have it completely for free. I spent weeks
building and focusing on this refining it but you just so you don't have to basically. So all you do is literally
basically. So all you do is literally copy all this stuff all the way down.
concept to come over and grab it without moving it over, which is really cool.
And what we're going to do is come back over then to our beautiful thing here and we're just going to paste it in GPT 5.2 codeex just so you get a sense of how it works. And we hit enter. And you
can see already that the interface is really cool compared to the terminal.
And again, you can run this in the terminal if you want to just while that's thinking for a second. Going to
control command T, type in terminal. One
second. Actually, come down here. I
think I've already got it open here.
Again, you can just come down if you ever want to use your terminal. You can
do open code. This is one of the things that the founder of Claude Code said that they really like using it in the terminal because it's a little bit faster, but again, you don't necessarily need to use it. And just like that, guys, it's basically come back now with everything I suggested. And if you
remember from my last video, again, I'll put a link on screen X specifically.
What this does, it initializes the project. And what it essentially does
project. And what it essentially does before it does anything else is creates gemini.md on the left hand side, which
gemini.md on the left hand side, which is all the core project files. And what
we essentially do first is what we do the north star. What's the thing we want to do? Our desired outcome in plain
to do? Our desired outcome in plain English, the integrations, what are the services we want to connect to, the source of truth, the delivery payload, the behavioral rules, and all that sort of stuff. So, all we're going to do the
of stuff. So, all we're going to do the first part of our project is essentially answer these questions. As you can see, it's already created for us now a bit of a project map. So, what I'd like you to do is I want you to go ahead and build
me a LinkedIn post generator. I'm going
to give you some copy and then from that copy I want you to create for me three LinkedIn posts that follow the best practices that I give you. No need for any integrations source of truth essentially just going to be the best
practices that I give you for LinkedIn.
I want the final product to be on the website and I want to look quite visually engaging and quite cool and yeah no other constraints just all on one page for me there. It's a very very simple challenge just had to go and build that just to get a sense of how
this works and interacts. And the really cool thing with this is that anytime I want to bring in any of the anti-gravity models or cloud code or anything, I can do that really straightforward, which is super duper cool. So you go, it's gone down that it's got that before I can proceed. And a few details, I can refine
proceed. And a few details, I can refine the pay blueprint. The source copy you want post generated from. So let's head over to my LinkedIn and grab some example copy. And to do that, we're
example copy. And to do that, we're going to add a file on the left hand side. Let's go new file and we'll call
side. Let's go new file and we'll call this one LinkedIn content example MD.
Beautiful. And then we can start pasting all the stuff in there that we want to.
Of course, we could just simply get it to go ahead and describe all the stuff from LinkedIn if we wanted to. Cool. So
we've got some example posts on the left hand side and what I can do here is say hey the LinkedIn posts are here and actually what we can do is basically do an at sign and you can type in the name of the file which is LinkedIn content example MV and just say just follow it
and create everything in this tone of voice and style. Awesome. And in terms of the website designs I want you to leverage best practices for beautiful websites UI design patterns all that sort of stuff. Obviously we get way more detailed. I just want to show you the
detailed. I just want to show you the basics of how to actually build something using this stuff. We'll send
that one off like that. And again now chat GBT can go ahead and do all the thinking for us there. Then in terms of design for the dashboard, why don't we come over to Dribble and grab a little bit of inspiration. So we could just say something like, I don't know, like a dashboard and let's see what dribble can
grab for us so we can find something good and decent to give it as a reference image. This I think here looks
reference image. This I think here looks really cool. So why don't we just give
really cool. So why don't we just give this a quick copy again. Normally we
would just mood board this. So we'd get like four or five images and describe the style and detail depending how detailed you wanted to get. So going to come back over and let's just paste that into the file. Yeah, let's paste that image.png and I'll just sort of say use
this as the design reference for the dashboard. Cool. and then an at sign and
dashboard. Cool. and then an at sign and let's go for design image.png.
Beautiful. And let's send that one off.
So what's really cool now is actually built out all the information for the data schema, the blueprint. And if we're happy with it, we just say, "Hey, that sounds good. Let's go ahead and do it."
sounds good. Let's go ahead and do it."
And what's really cool, guys, with this stuff, like you do just get free models.
So all I could do if I wanted to is click on this plus here for example for a new terminal, I could just go open code. And then what you've got here, if
code. And then what you've got here, if I just go for for/models, I've got these free ones. So I can just say, I've got
free ones. So I can just say, I've got the big pickle or we've got the miniax mm2, we've got grot code fast, whatever I want to. I can just ask it to start doing stuff if I want to completely for free. No concern about tokens at all.
free. No concern about tokens at all.
And obviously you've seen the Ralph Wigum thing that people are doing and all that sort of stuff. If you did want to do that and that burns a ton of tokens, you could run things like that or just like low-level tasks that don't interfere with the main projects on
these free models if you want to. I do
think the bigger benefit though is the fact that you kind of get access to all the models. But again, if you're on the
the models. But again, if you're on the more premium subscription anti-gravity, you wouldn't necessarily have to do that. What's cool here is come back and
that. What's cool here is come back and ask for some different add-ons. So it
said for example, what do you want? So
do you want to share copy buttons for each post? Export all post to CSV. Titan
each post? Export all post to CSV. Titan
generation structure. Let's say that I want to be able to let me export CSV and let me copy the post with a nice copy button. And let's do confetti after I
button. And let's do confetti after I copy it. Okay, give it a little
copy it. Okay, give it a little challenge, something kind of like add a little bit of edge to it. And while
OpenAI is working in the background, I'll also show you how you can get access to Claude and also Gemini within Open Code. So to do that, we're going to
Open Code. So to do that, we're going to head over to this website. So to do that, you're going to head up to Open Code anti-gravity orth. Now, the way that this works is you'll have a Gmail account and what this is doing is using the author you use in the browser to
access the models. This is something I genuinely think that Gemini is probably going to patch. I mean, it happened to Anthropic actually and Anthropic like Claude Code, they shut that down. They
changed their terms. So, this is something I don't think is going to exist for too long in the future just because if everyone's using their email basically, they're probably not going to be paying for their usage. But, it does exist at the moment. And the way that
you can get it in anti-gravity if you want just so you understand what is available is you can literally copy this. So you essentially come back over
this. So you essentially come back over and give it a prompt like this which is install the open code anti-gravity or plugin with the anti-gravity model definitions to my global config using this URL give me the Google author later hit enter and after you've done that
what anti-gravity open page you can select the account that you're basically doing it with. So the Google account like so you click on this one. Then it
asks for permissions to connect and it says also you've successfully authenticated with anti gravity. You can
now return to open code and then you can close this tab or head back over to anti-gravity itself. And when you come
anti-gravity itself. And when you come back you just click on accept all and then everything should be available within open code and you can validate that by coming down on the top to terminal click on a new terminal like so. Let me just delete this one down the
so. Let me just delete this one down the way for example. And if I just type in uh let's come here and enter in here open code we should get the full browser and then you should be able to see something from anti-gravity. So if I come down I do models as you can see now
I've got claude opus 4.5 thinking anti-gravity sonet 4.5 and also all the Gemini models and that's basically just using your Google signing credentials.
Again I'm not using this. I've got the pro account and I do think they'll patch it but just so you're aware of what is available and the kind of like options out there to connect certain things to things. But what I want to show you now
things. But what I want to show you now which is really interesting. Now all
this code has been built by basically chatg in any model we want to. I think
the use case that I would probably lean on the most with this stuff is if you're doing an insane amount of code we can leverage some of the free models and then we can bring in Gemini as kind of like essentially to kind of make the
design unstoppable. Now personally
design unstoppable. Now personally speaking I'm always going to be using Gemini include to build everything out.
But if there are really specific mundane tasks that don't require a big brain approach to think about it, I would just whip up open code, get it to deploy, get it to work on something really specific without that. But if you are someone
without that. But if you are someone who's like in a position where you're really trying to stretch and think about your token management, these are really incredible options. So what I can say
incredible options. So what I can say with this is, hey dude, what I want you to do is go through the design and essentially improve the design and layout of the entire dashboard. Make it
excellent, make it gorgeous, and do a sense check of all the code to make sure it is in a beautiful position and ready to go. So we can use Gemini now to
to go. So we can use Gemini now to review everything we want to and do whatever we'd like. One of the I guess limitations of open code I'd say is that you don't have access to the browser like you do. So when you come and leave the anti-gravity section, you don't get
access to the agent manager and you don't get that inbuilt browser thing that you can use within the anti-gravity environment basically. Beautiful. And
environment basically. Beautiful. And
now it's done. Let's give it an example.
So I've got some information here about anti-gravity. Let's come down and click
anti-gravity. Let's come down and click on generate posts and see this turned into a couple of LinkedIn posts for us.
Give that a hot second and see what it'll do for us in the background. There
we go. Imagine XYZ ready to level up.
Build fast with some options. scroll
down and I could literally come down here, copy it and then paste it onto LinkedIn. And obviously we can make that
LinkedIn. And obviously we can make that way better by being really specific on the hooks and give it loads of information. But you get the idea of the
information. But you get the idea of the kind of system you can build now with this then also coming to the terminal new terminal and then leveraging here open code whenever you want to use any of these 150 models that are available
within open code. So you can now use this alongside anti-gravity at the exact same time. And so now we've covered
same time. And so now we've covered everything about videos. The next thing we need to do then is learn how to leverage every skill that we've learned in this video to take it to the complete next level, which you can do by joining me by clicking the top link in the
description.
Loading video analysis...