Loading video player...
So, Google has just launched Gemini 3 and it is a huge step up. In today's video, we're showing how you can use Gemini 3 to build out your own custom web applications without knowing coding at all and 100% for free. Now, we're actually going over three use cases today. One that's simple, one that's intermediate, and then one that's difficult. So, you can see a breath of ways that you could go ahead and actually leverage this technology in the next few minutes. Now, just as an
example, here's two other use cases that we won't be covering this video, but I thought was really cool to showcase. You could build a full application where you could get Gemini to develop infographics for your users. So, for example, you could type in here temperature in Canada and it would literally give you this um infographic which looks really cool other than the fact that as somebody who actually is a Canadian, it's a bit misleading because it looks like there's
tropical jungles all across the southern part of the country, but really it's just like a giant iceberg across the whole thing. And then the second thing is that we can generate games over here in a matter of a couple seconds. So, if you wanted to go ahead and generate uh games, you could go ahead and do that straight through um Gemini as well. But specifically, we're building out three separate use cases. And in order to get started, we're going to head over to ai studio.google.com/apps.
And if you haven't done so already, you will need to create a free account with Google. Okay, awesome. And the first use case that we're talking about here is how we can clone a website. So, for instance, if you've ever come across a site that you really like and you want to copy, instead of having to reverse engineer it and create it from the ground up, what we could do is we could literally just take a screenshot of that existing website and then jump uh paste
that right into Gemini 3 and just ask it for instance to um create a pricing page like this for a form builder builder SAS app with three different pricing levels. And just essentially the key here is just to copy the exact style. And what it will do is it will go to work for us and generate something very close to that that style that we just wanted to copy. Now this is just going to take a couple seconds to load. So I'll be back as soon as this is finished. Sweet. And
so we are all finished. And here is the final product. So let's actually just take a look at the two side by side. So here's the initial design. And then we have what Gemini created for us that took that exact design but then also customized it to the exact use case that I was looking for which is a forum building software. So we can see like five active forms and 25 active forms. We have basic essential and growth plans. And so really really cool stuff. Now I do want to point out that this
works significantly better on simpler designs. Like if you're pasting in some really abstract really complicated build it's going to be much less accurate. So, here's another example of a website that I liked and I wanted to clone. And so, what I did was I literally just took a screenshot of the whole thing. And then I dumped it into Google Gemini and it got actually pretty close with most of the stuff. The one thing that it had a difficult time cloning was these like
images over here because these are like I think designed uh through like a graphic designer and so it didn't get these images perfectly obviously but nonetheless I was still pretty happy with the design over there. It's just not 100% identical all the time if the designs are super difficult to be able to copy. So that is the first use case that we can build through something like Google Gemini. Now, we can actually take it a step further to an intermediate build where we can add in a whole suite
of functionality onto something like Gemini 3. Now, the beautiful thing about this model is that it's actually multimodal. And what that means is that it can accept multiple different formats like text, images, audio, video, all of that kind of stuff. And you're getting like the whole suite of Google's products in one builder. Whereas if you were to go with an another software like let's say Lovable, it might not have built-in integrations for like databases and voice AI calling and all of these
other um third party applications that you might want inside of it. So then you're stuck kind of like interweaving them all together. But with Gemini, it comes out of the box completely for free. So for example, we could take it one step further and add a voice AI agent onto this page. So, I'm going to type in here, also, can you please add a voice AI agent that the user can call in real time and have a conversation to ask questions about the pricing and get help
choosing the right plan? So all of a sudden it will update this with an external like with an additional service that if somebody is confused on what kind of package they're looking for then they can just call in to an AI agent and then it will help problem solve whatever it is that they're stuck on and then give tailored solutions back to that actual person. This will just take a couple seconds to build out but once it's done I'll return back with the video. Cool. And so we're all set to go.
Now the first thing is is you'll see this prompt over here. Here it says allow this app to request access to the microphone. So we need to give permission to Gemini to be able to have a conversation with us. But we actually added in here and I think unfortunately my face is kind of blocking this. It's this nice little widget over here where we can have full-on phone calls with people. Hey, can you hear me? >> Yes, I can hear you clearly. How can I help you today?
>> Yeah, awesome. I'm looking at the plans and I was just trying to figure out what's best for me. I was interested in having at least 30 forms on my site. What is the best plan that I should be uh taking? >> The essential plan gives you up to 25 active forms. Since you need 30, the growth plan, which has unlimited forms, is probably the best choice. It also includes unlimited submissions and other great features. Are there any other features you're curious about?
No, I also wanted integrations into like make.com or Naden or Zapier. Do you guys have access to that too? >> Yes, we support integrations with make.com and Zapier. Those are included in both the essential and growth plans. Does that help with your decision? >> Yeah, it does. Okay, awesome. Well, thank you very much. And so that's another use case that you could apply directly into Gemini 3 instead of having to integrate in multiple third party applications. You can do it from all
within your app builder right here. Now, the third and final use case that I want to share is the ability to connect Gemini into tens of thousands of other applications through a platform called NADEN. So with NADEN, essentially what this is is it's an app uh it's an automation platform that allows you to integrate into 1,247 applications like Google Sheets or Gmail or for example Slack or Telegram or Air Table, Google Drive and so on and so forth. Literally all of the popular apps
that you're using on a daily basis anyways, you could integrate into via your Google Gemini application. And so how we do this is we'd prompt the um the web builder one more time. So we could say I want to add a form under the pricing table where we ask for the user's name and email to be able to send them a quote through naden. When the user submits the form, we need to send that data as a post request to this URL. And we're just essentially adding in an external URL over here. And we're also
giving in some styling guides, making sure that the form is in line, so it's like in one direction as opposed to it being like underneath each other each field. And so with that being said, what's going on here is as soon as somebody fills out this quote form, okay? And they enter in their email and they enter in their phone number, it's going to start this secondary workflow inside NAD. And remember, NAD is just an automation software that allows you to connect into thousands of other
applications. literally all the applications that you're currently using on your day-to-day basis. Most of them will connect into here. And so, let's walk through exactly how this works step by step. As soon as somebody fills out this form down here, it's going to send the email and the first name or the full name over to this particular node inside Naden. A web hook is just you can think about it like almost a doorbell. As some as soon as somebody rings the doorbell
at your house, you come to the door. Or for example, when you know it's like a push notification on your phone, too. when somebody tags you on an Instagram post, you're automatically going to get notified. And so with a web hook here, it's like a ear that's always listening 24/7 to incoming requests. And as soon as this forum is submitted, Gemini is going to send that request over to this web hook that's going to receive the information. We can take a look and see
the information we received right down here like the name and the email. And then what we can do is we can attach uh Google Sheets node over here, which has access by the way to every previous node. every node has access to the previous nodes. And so for that reason, when we open up this Google node here, we have access to the name and the email so that we can enter this information into our Google sheet over here. The beautiful thing about this is that this
references um a key here which contains dynamic information. So every time somebody fills out this form, the first time it could be John Oatliff, next time it could be Bob uh Smith, John Smith, and so on and so forth. every new person, it will um automatically enter in their custom information, right? So, it'll always change every single time. And so, we can add people into Google Sheets. And then the last thing here is of course sending off an invoice, quote,
proposal, whatever it is that you want. This is just again one example. There's like literally an infinite amount of solutions or possibilities with something like NATO. But in a nutshell, what's going on here is that we are sending off a proposal via email, okay, to a user so that when they open their email, they can go ahead and view the proposal, sign it, they can pay if they want to or do whatever it is that you're looking for them to do. Now, I'm going to link down below to a video walking
through how you can build out proposals and contracts and invoices inside and automatically, uh, where you can take a look and see how this is exactly built. But just as a TLDDR, essentially what's happening is we're sending this off to a CRM. In this case, it's go high level. We're just passing in the user's email and full name. And inside go high level, we are essentially again having a web hook waiting for that data to come through. As soon as that data is
received, it's going to create a contact in our CRM and then send off that document to their email. And then that's going to that means they're going to receive this this agreement over here. And so and so that's essentially the three use cases that we're going to cover in this video. However, if you want to go ahead and publish this, what you can do is you can hit the deploy app button right up top here and you just need to select a cloud project to deploy on. Now, if you guys don't have a
project and this is your first time using the AI studio, you'll need to create a project which um should be free to deploy, but they may ask you to connect a credit card payment in order for you to go ahead and set up your Google Cloud account. And you can just do this straight through the user interface right over here. So I'm just going to call this test and then we can go ahead and generate this project. So in this case it might ask for like billing over here. I'm just going to
choose something else and we're good to go. I can uh deploy the app and view it live and then send this off to whoever else I want to send it off to. And so that's more or less it guys. I really appreciate you watching. If you guys want to automate existing things in your business or in your life, I' i'd highly recommend taking a look at my YouTube channel because there's just so many countless videos covering all different ways on how you can automate all the
things you're probably doing manually. And if you guys want to take it to the next level, I'd recommend taking a look at my school community here where there are three outcomes. Number one is to learn tools like Gemini 3 or NAN or whatever you know AI automation tools you want to leverage so that you can win back your time and you can make money off of it. The second transformation of the is for those of you who want to sell these tools to existing business owners.
And there's literally countless people in this community that are doing that. For example, Mark just closed two deals very early on. Addie closed a $10,000 deal that's recurring every month for 6 months. So, it's technically a $60,000 deal. Joseph signed a or Joseph's doing $10,000 every single month. Sophie from Nigeria hit her first thousand and so on and so forth. countless people in this community doing that literally every single day. And the third transformation
is for those of you who already have an existing business and you want to automate everything that you're currently doing. In my previous business that I just sold, I was literally able to automate up to 80% of it scale to seven figures. And in this community, there's literally copy paste and deployable blueprints that are helping other users be able to do the exact same thing. And if all of this sounds too stressful and you just want a hands-off strategy where you don't have to kind of
do anything, then you can also take a look at my automation agency over here where we literally build this for you and automate your existing business without you having to learn any of these tools. So, thank you guys so much for watching. I hope you have a lovely day and I'll see you guys in the next one. Thank you and bye-bye.
π COMMUNITY https://www.skool.com/automatable/about π FREE BLUEPRINTS https://jonocatliff.gumroad.com/l/isrfbo π SUMMARY In this video, youβll learn why the n8n Code Node is one of the most powerful tools for custom automations, see real case studies in action, and discover how to deploy it fast in your own workflows. π£ SOCIAL MEDIA β’ Instagram β https://instagram.com/jono_catliff β’ TikTok β https://www.tiktok.com/@jonocatliff β’ LinkedIn β https://www.linkedin.com/in/jonocatliff/ β’ X β https://twitter.com/@jonocatliff πΊ RELATED VIDEOS β’ Full crash course on Make.com β https://youtu.be/hinLebdX8aM β’ Full crash course on n8n βhttps://youtu.be/AURnISajubk β’ 11 Favourite Make.com automations β https://youtu.be/dIH1F1WlE84 β’ 12 Favourite n8n automations β https://youtu.be/uQGT2K26W84 π― 1:1 CONSULTING Book a time β https://jonocatliff.com/consultation π AUTOMATION AGENCY Get help with your business β https://www.automatable.co π LINKS (some of these make me money - thanks in advance!) β’ n8n β https://jonocatliff.com/n8n β’ Make.com β https://jonocatliff.com/make β’ Go High Level β https://jonocatliff.com/gohighlevel β’ Apify β https://jonocatliff.com/apify β’ Skool β https://jonocatliff.com/skool β’ Zapier β https://jonocatliff.com/zapier β’ PandaDoc β https://jonocatliff.com/pandadoc β’ Apollo β https://jonocatliff.com/apollo β’ ManyChat β https://jonocatliff.com/manychat β’ Vapi β https://jonocatliff.com/vapi β’ PhantomBuster β https://jonocatliff.com/phantombuster β’ ClickUp β https://jonocatliff.com/clickup β’ ElevenLabs β https://jonocatliff.com/elevenlabs β’ Upwork β https://jonocatliff.com/upwork β’ Instantly.ai β https://jonocatliff.com/instantly β’ Airtable β https://jonocatliff.com/airtable π ABOUT ME Hey everyone, my name is Jono. I run a 7-figure service business that offers DJ, photo, video services (#1 largest in Canada), and spent years figuring out how to automate every part of it (and hired the roles that I couldn't). Conservatively, I used to work 80+ hours per week, before sunrise till long after sunset; missing gatherings, family events and everything in between. Through automation though, I was able to replace my job. My goal is to help share what worked for me, in a dream of helping others find true success with their passion. Please subscribe, like and comment below if you have any questions! Thank you π