Watch Me Build An App For Local Businesses

0:00I'm going to show you how I built out this landing page in under 20 minutes by using idea browser, taking that idea, running it through Google AI Studio, and coming out with an ADU calculator in under 20 minutes. Let's get right into it. In this video, we're going to be using the new design variations just released by Google AI Studio because this is the hardest part of designing a landing page is being able to just iterate over and over again on your idea to be able to get the design that you're looking for. So, design variations just launched a few days ago. We can instantly generate, explore, and apply beautiful new front-end layouts with just a single click. Like I said, Google AI Studio is going to be used to build it. But what are we going to build? Well, we're going to go into Idea Browser. We're going to look through their database of where a thousand

0:45ideas, pick an idea, and within 30 minutes, you're going to go from zero to a finished product. Okay. So, like I've said before, finding an idea to build is the hardest part of the process. You don't know if anyone's going to pay for your app. You don't know if it's even worth building. Well, that's why Idea Browser scrapes basically the entire internet, Reddit, social media posts, Google keywords to be able to actually validate the idea that you're going to spend time building. So, like I said, over a thousand ideas on here, but maybe you have an idea yourself that you want to validate. That's where you're going to go into the research where you could plug in your idea and just run through the research agent or the idea agent to be able to just validate what you're thinking about. I mean, maybe you have an idea already. You can run it through

1:30the agent to be able to get back data to see if it's even worth building. But today, we're going to just start a little bit more simple and we're just going to go to the discover tab and we're going to just browse their ideas. And when we come up with an idea, we're going to basically build this idea. See this button right here? It's going to drop in a lot of important prompts and context into Google AI Studio. And like I said, we're going to use the new design variations to really push this thing to the max to see if we could get a beautiful scroll stopping landing page. And then we're going to connect the back end to make sure everything works. So, let me go through these ideas and pick out something that is going to solve a major problem. Okay, so I found this. Can I build a backyard home? This

2:15is going to be directly targeted for people who want to do Airbnb or midterm rentals. This is a tool that is going to allow you to scan your backyard to allow you to see if you can even build an ADU. So, it says homeowners considering an accessory dwelling unit or additional dwelling unit ADU spend thousands before learning whether or not their lot actually qualifies. Architects even charge $5,000 for a feasibility option. and municipal zoning documents read like legal filings. So, it's really hard to figure out if I'm even eligible for this, right? So, it can says weeks disappear into research that ends in a m clarity on a $100,000 building decision runs through a process designed for

3:00professionals and most homeowners stall before even getting an answer. Lot view generates an address specific ADU feasibility report in minutes. A homeowner enters an address and the platform pulls the parcel data, measures setbacks, and then checks lot coverage limits. So the MA and it maps the zoning rules to specific properties. I love it. This is going to be a perfect thing to build and we could basically pull in all this context into Google A Studio and start cook. So I'm going to show you after you find an idea that you like on what I do personally to take the next step into building this. So, there's a lot of information here. It can be overwhelming for a lot of beginners that have never built an app before. I'm going to lay it out as easy as possible.

3:46Don't be overwhelmed. Don't think you need to know how to code to build your app. This is the year of building and you don't need to learn how to code. You don't even know how to code. You need to learn how to have the AI how to code. You need to be able to direct the LLM that you're using how to build your idea. That is what you need to learn. And the things that I've learned after building apps for this last year is you just need to basically act like you're building a house. You know, laying a foundation. What is the foundational steps to build your app upon? Because no one ever has a finished app idea in their mind of like, okay, this is what it looks like finished completely. We start building and then we start iterating and we start, you know, kind of getting in that flow state of like, oh, coming up with other features and

4:31other ideas within that app that you never would have really thought of until you start that building process. So that's why building's so fun because your finished product may look completely different from what you actually imagined it, you know. So this is just a great simple app that solves a problem and, you know, there's a lot of information here. It can be overwhelming, but idea browser does break it down pretty easy for you. Like understanding what your offer is, understanding who is your target avatar, why now, proof signals, market gap, and execution plan. All this should help you understand, okay, I have a good grasp on who my app is for. It also solves a big problem. Also validated by search terms and keywords. So, this is great. It

5:16should give you the confidence to build. So you can see top keywords right here on this right hand pane. You know it has garage conversion to ADU, ADU building permit and detached ADU all trending with search traffic. But the highest volume one which has a lot of it's a low competition accessory dwelling unit. Just in general ADU gets 200,000 searches. So you can see a full keyword analysis by clicking this button here too. But just reading through the why now and the proof signals should give you more confidence on your build project. So also goes over a framework fit too just like if this fits your actual you know vision and your business style. You can see if it's a founder fit. So basically once you sign up for

6:01idea browser you could put in your information and then it's going to validate it according to like you like who you are. Is it going to fit fit your business principles? Is it going to fit your vision? So, it'll be able to, you know, you'll be able to build ideas that actually fit who you are as a person um or as a business owner, which is really helpful when you're scanning through thousands of ideas every single month. So, this is great. That's a lot to cover here, but the first step after you find an idea, I'm just going to go ahead and giving Google AI Studio some context, I'm just going to highlight this first few paragraphs and just pull that into Google AI Studio. And I'm just going to paste this in. And I use a voicetoext um voicetoext app called Whisper Flow. It

6:47really helps me communicate with any LLM. I think in this time day and age, you need to be able to just dump ideas without having to think too hard. So that's why I use voice to text. Super helpful. Highly recommend it. It's free, by the way. Um so I found this idea. I would like to build this idea as a web app. Let's use some modern architecture for the landing page. I'm going to drop in the landing page prompt. Be able to pull in some frame or motion. I want the hero section to stand out. I also want the landing page to not have more than 1,000 words on it. I want it to be very simple what the app does, who it's for, and why they should use it. Also, pricing. Put the pricing down below. So,

7:32that's going to put that in there. And then I talked about prompts. So, here when you find an idea, there's a lot of buttons, right? There's a build this idea button right here. You're going to want to click that. You're going to want to click on idea builder. You could pull in these prompts into Google AI Studio. You're not going to need all of them, by the way. You're not going to need all of them at, you know, just a few because there's a lot, right? There's ad creative prompt, there's a brand packaging prompt, there's a landing page prompt, and there's eight marketing prompts, three product prompts, four business prompts, and two research prompts. you really only need a few to get going. So, the first one we're going to cover is the landing page. It says, "Create a high converting landing page for this business idea." And then it goes on and talks about the structure of what it should look like. This is going to give us, like I said, a great start

8:18to building our foundation. So, I'm going to paste that in here and we're going to let Google AI Studio do its thing. All right. So, after it went for a while, it had built out the landing page, which is beautiful. But for the first attempt, it could be better. And I want to use this new feature that they just released, design variations. So, I want to get into how I can actually use this. Okay. So, there's a button right here that we can do uh exit edit tool. So, we can do the design variation right here and go to designs in variation. Awesome. So, it's going to generate multiple variations. I love that. That's awesome. So, it's already come up with a much

9:03better one. I like this one already. This is great. This is going to allow you to just iterate so much faster on different styles. Ooh, I like that one, too. Wow, that is awesome. Let's go with that one. And then you can just hit generate, submit. Wow, awesome. So, it's going to work on that in the background and give us that updated variation. All right. So, it just took a few seconds to actually see this come to life. And I love the way it just is so easy to have a different variation. Like it just, you know, maybe you're not happy with the first result. I think this did a really good job. So, let's get into just kind of fixing the back end, getting the database going, and kind of the next step after this. Just want to like go

9:48over it real quick on like what it actually looks like and just kind of see if there's any tweaks that we can make because we don't want it to be too wordy and this has way too much text in my opinion. Like no one wants to read through all of this. So that's the first change I want to make. I do like the design though. It does look really good and I think it did a great job with that. Clean, sleek, buildable size in minutes, not months. skip the $5,000 architect fee. I love that part. So, let's go back into Google AI Studio and let's make those changes. So, I think that the landing page is way too wordy. It has way too many words. We need it simplified. It's just way too overwhelming. No one wants to read this

10:35many words. We want to keep it simple. All right, let's see how it did because too much text is a big turnoff for people that are looking at to buy your product. It did much better. I still think there's too much text, but the hero section is a lot better, less wordy. You got buildable size in minutes, not months. Really nice H2 header, and then you can enter your address right here, and then see if your property qualifies for an assessment. So, that is good. I think we're going to leave that for now. Let's get uh started building out the feature spec. You're going to go into the product dropdown, and you can see feature specs prompt. This is going to give you a prompt to start building out the features within your app. So, generate comprehensive feature specifications that provide clear direction for development teams. We're going to drop that in and let it

11:21cook. This is a feature spec guide prompt to help build out the feature specs for our app. This is the next step in our iteration process. I also want you in the meantime to even make the landing page less wordy. Too many words is a big distractor, so cut down on the words. We're going to let that go. All right, cool. I've significantly simplified the landing page text to make it much punchier and less overwhelming. So, it did all that and then the feature specification guide was finished detailing the user stories, acceptance criteria, technical requirements, and MVP. That is awesome. The next thing we're going to do is the product requirements document. This is the vision and roadmap for your actual product. It says, "You are a senior

12:06product manager and technical specification expert. Create a comprehensive PRD that clearly defines what to build, why you could build it, and how success will be measured." We're going to copy that and plug that in as well. These are important. Don't skip these steps. This is the vision and road map for your idea. Without them, it's much harder to build and you're going to be squashing bugs later down the road because the LLM, Google AI Studio, is probably going to lose context as you keep building on. So, we're going to drop this in and I'm going to use Whisper Flow. Here is my product requirements document. Please look at it. Please fill it out and please apply it to our project and then let me know the next step in this build. We're going to send that along with it. I also want to try something else and go to Google Omni and create a beautiful video of a

12:53house being built inside of someone's backyard. something simple like a tiny home or something simple like a studio in their backyard coming together beautifully that we can overlay the text in the hero section. I believe this is what makes your website stick out in 2026 because everyone is vibe coding, everyone is building landing pages. I believe that Google I studio is responsible for over a million web apps shipped this year. So, if everyone's just doing the bare minimum, we need to take that next step in our design process to stand out, to stop the scroll. In Gemini Omni, it says create anything from any input. So, it's like their nano banana, but for video. And I've been using this for some of the hero builds uh over the last few episodes in this series, and it's been

13:39performing really well. So, let's go into videos and let's try it out. create me a beautiful studio slashtinyhouse being built in someone's backyard coming together beautifully from the start to the finish in a timelapse style fashion and the camera is almost doing like a drone style pan as the home is being built. That's what I was envisioning. So I think that can be turning out pretty good if we overlay the text on top of our landing page. Our landing page looks pretty good right now, but it's very plain and no one likes plain landing pages anymore. I know it looks clean and simple, but we want to stop the scroll. I think if you're looking at this, you're like, "Man, that's a lot of blocks and a lot of text." You want to

14:25stand out. You need to take it a step further. Trust me. And it's so much simpler these days to just go into Google Omni and do it. I mean, you just saw 2 seconds that prompt. It's going to pop out a video that's going to be beautiful. And we're going to overlay this text and it's going to look amazing. Okay, these videos have been really good and I've been loving them. I mean, look at that. To me, that is just awesome. Everyone should be doing this. And the video is like 2 megabytes. So, I'm going to download it and we're going to overlay the text in the hero section for that. You're going to click on the code section here and you're going to drop that video into your source folder. Simple. And the name of the video is create me a beautiful studio. Okay, so I just dropped a video in that I want you

15:10to overlay the text of the hero section over. It's called create me a beautiful studio video. And then also it came back with the PRD and what to do next. So before we send that prompt off, it says I have successfully generated and saved a PRD for you based on your business context and specifications. It's available in the codebase. We could check it out. It is right here. for PRD came up with an executive summary, strategic alignment, resource requirements, problem statement. I mean, it's it's beautifully laid out for people to just build a simple PRD. This is so important. You need to get it going. It shows your phase one. Days 1 through 7 is landing page, Stripe integration, manual fulfillment process setup. Days 8 through 14, hand aggregate

15:55top three cities, zoning data, launch ads. month to automate data pipeline using a rigid rigid API and air table v via sap zap year. This is so simple you don't need to take two months to build this out by the way you could get it done in a day but it shows you a great road map and to hold you accountable during the building process. So in the next step to build after that our immediate next step is to bridge the landing page to the core value proposition by building out the functional address input and payment flow. So, we need to actually get the app to work. The hero feature, right? Seeing if it can actually build an ADU in your backyard. So, it's going to be able to take your zoning laws from your county, probably from the county courthouse, just to be able to see, is this compliant with building an ADU in

16:41my backyard, and be able to take complex legalies and terms and concepts that aren't that are basically foreign to a lot of homeowners, but they have property. take a few photos, type in the address, and it's going to give you really easy to read and understandable information if you want to build, you know, an ADU or run a mid-term rental or do some Airbnb short-term rental stuff. It's going to be easy and simple and then we can target those avatars through ads and through content. So, basically, that is the next step, getting everything to work. And it says since we're doing a full stack development, we need to transition the app to an express vite architecture to securely handle the address validation logic and eventually Stripe payments for accepting the payments. Right? So I will say yes, I would like to start converting the app

17:27to a full stack architecture. That sounds good. And then yeah, building the address validation API. Let's do one step at a time. Okay, so it's going to go ahead and do that. Wow, that looks really good. Holy smokes. Um, wow. I just got to show you in full screen. Look at this. Look at how good it looks. Just so much better than before. I mean, I just think it just You want to stop the scroll. This is the attention economy when it comes to building apps. You got to get people's attention. And it just looks so good. Like perfect. So now we're going to actually connect the back end as far as like the database getting people authenticated when we get signups and how the whole flow works. But that is a perfect start from nothing

18:12to something in 20 minutes. That is beautiful. So let's pop into Google AI Studio and finish this build out. So it updated the landing page featuring the new video and then the full stack architecture setup. It created an express server and updated the build pipeline to serve the API alongside the front end and the address validation API. So it built the first backend endpoint that handles property address submission. It currently includes logic to validate that the address is within your supported states California, Oregon, Massachusetts and returns the corresponding eligibility status to the front end. That is awesome. So yes, let's proceed to the next step. I believe it will be the database and then wiring everything up so it all works

18:59properly. So, Google AI Studio directly integrates into Firebase. It's so easy to get your Firebase set up. It connects to your Gmail account and you just click enable Firebase and that's going to authenticate all your users. Easy. Wow. Okay. So, this is how simple that was. I have provisioned your Firebase database and successfully converted the application into a full stack architecture with working data integration. So the database setup is already set. The backend API integration so our hero feature will actually work. And then data persistence. So when a user inputs an eligible California, Oregon or Massachusetts address into the hero section, the address validation API will now securely log that request into new reports collection in your Fire

19:45Store database. Setting the groundwork for saving users, generator reports, and tracking leads. The application is fully compiled and the local server has been restarted to reflect these changes. Are you ready to proceed with automating the full report generation logic and pulling the real zoning constraints? Yes. Let us take the next step and proceed with automating the full report generation logic. All right. So, we can now enter a location. It says everything is compiled and ready to go. So it designed a report page. When the user unlocks the report on the landing page, they are routed to the final view displaying their parcels billable status and financial projections. So let's go look up a

20:31random California address and get that plugged in and see if it works. All right, so we have a completely random address in California. eligible parcel found in sample city feasible report is ready to generate unlock full report error report not found that's okay don't expect things to work on the first goound so let me go back into Google I studio I put in a California address and then I clicked report and then it said error report not found okay so I've resolved the issue the database securely rules security rules were preventing the backend from saving the report to fire store which is our data database. So, this resulted in a missing report ID during the redirect. So, it is now live.

21:17Let's go back and test it out. Return home. Copy the address in. It found the parcel. Oh my goodness. Let's go. It worked. Let's go. It worked. All right. Parcel analysis. 2134 Mabe Drive, Cambria, California. Oh my goodness. That's amazing. Status is buildable. Max size can be 12,200 ft. setbacks is a 4 foot rear side. This is amazing. That's how amazing it is to build apps today using Google AI Studio. Validating the idea inside of idea browser. You guys need to check these two tools out down below. If you have never built anything before, it is okay because with tools like this, you can go from a beginner to expert in just a few days. So, what is

22:02that? 30 minutes. We took from zero idea to an actual MVP. That is amazing. I'll put the links to the two tools down below. Give them a check out and spin them up. Let's see what ideas you can come up with. And we'll see you in the next episode. Bye-bye.