Build a Homeschool Science App with Google AI Studio and Gemini Omni

By Beau Johnson·September 8, 2026·8 min read

Prefer to watch? Watch on YouTube · Subscribe for new builds · Read the transcript

Quick answer

I build a DIY homeschool science project app with Idea Browser and Google AI Studio. To get past generic AI design, I attach screenshots, the saved HTML and the link of a site I like. Then I make an animated hero video with Gemini Omni and lay it over the landing page.

In this video I build a DIY science project generator for homeschool families. You tell it what you have around the house, pick your tools, and it walks you through how to build the project. It's for parents and anyone else who doesn't code. I use two tools: Idea Browser for the idea and its context, and Google AI Studio for the build. I also show the trick that fixes the bland design AI usually gives you, and how to add an animated hero video with Gemini Omni.

What I cover in this video

0:00 – A demo of the finished app. It runs a cabinet audit of what you have at home (hair dryer, black trash bag, packing tape, cotton), then gives you build instructions.
0:45 – Finding the idea on Idea Browser and why it matters to me as a homeschooling parent of four.
2:17 – What the product includes, the demand trend, and how the offer is structured.
3:49 – Clicking "Build this idea" to connect to Google AI Studio, and why the AI needs screenshots, context and frameworks.
4:35 – Pulling in the PRD, the feature spec and brand packaging, plus screenshots and the saved HTML of a reference site.
6:05 – Sending the first prompt with everything attached, and why the foundation matters.
7:37 – Using Gemini Omni to generate an animated hero section.
10:38 – Laying the video over the hero section with some transparency so the text stays readable.

Why I picked this idea

We homeschool our four kids and pay about $50 every couple of months for CrunchLabs. It gets them into engineering and hands-on science projects, but with four kids it adds up. When I found this idea on Idea Browser, I recognized it right away: it's basically a make-your-own CrunchLabs kit using things that are already in your house.

The Idea Browser breakdown says homeschooling parents typically spend about $50 a month on educational kits that their kids finish in 20 minutes. This concept, Curiosity Crates, offers curriculum-aligned DIY science projects built from household items. Each monthly box has four to six experiments with step-by-step video guides, educational explanations, and extension activities that can stretch one project over several days. The page also shows homeschool resources trending up since 2022. It lays out the offer too: an educational kit preview as the lead magnet, an introductory DIY kit at $15 to $20 a month as the front end, and a monthly subscription box after that.

The biggest reason I wanted to build it is that I'm the target customer. I know the pain points and I would buy this. When you're your own avatar, that's a strong signal the idea is worth building.

Give the AI a design reference

From the Idea Browser page, I click Build this idea in the top right. That opens Idea Bot Builder, which connects to Google AI Studio. AI Studio is running Gemini 3.5 Flash, which is very good at design if you give it the right context. Don't expect it to build a good-looking, high-converting landing page just because you asked for one. It needs screenshots, context and frameworks.

Here's what I gave it:

The idea context. I copied the whole Idea Browser front page and pasted it in. More context is better.
Screenshots of a site I like. I really like the Antigravity landing page: the style, the typography, and the motion as you scroll. I took a few screenshots of it.
The saved HTML of that site. I saved the page as an HTML file and attached it, along with the link.
The PRD and feature spec. Without the product requirements document, the AI doesn't know what to build or how to build it.

Here's the first prompt I sent with all of that attached:

I want to build up this startup idea. It is a homeschooling do-it-yourself science-based project. Here is the context and here is some screenshots, the HTML file, and the website link for how I want the landing page to look. Take the styling, the typography, the motion, and apply it to our landing page.

I think of it like building a house, where the foundation is the most important part. If you skip the foundation work up front, you'll be fixing bugs later that you could have avoided from the start. That's why I start with the PRD and the right structure. The first version came out clear. It's maybe a little wordy, but it's good enough for an MVP. Since the audience is parents who just want to do a science project with their kids, I'm keeping it simple.

Add motion to the hero with Gemini Omni

Next I wanted a hero section that grabs attention and stops the scroll. Inside Gemini, I went to the video section ("create videos with Gemini Omni"), dropped in a screenshot of my current hero, and asked it to animate the background with something being built from everyday supplies found in cabinets and garages. It finished in about 30 seconds. On the first try the motion was messy and made the text hard to read.

So I dropped the screenshot and asked for just a video:

Just create a video, maybe a cartoon animation of kids putting something together that's crafted around the house for a science project. And just give me the video. Some type of like 3D animation and make it so black text can stand out on top of it overlaid. Also, make the video 16 by 9.

The result was simple, which is what I wanted. I took it back to Google AI Studio, attached the video, and asked it to add the video to the hero section and play it there, with some transparency so the text on top stays readable. It set the transparency at a good level, so the video adds movement without taking over the page.

Key takeaways

A prompt on its own gets you generic design. Attach screenshots, the saved HTML file and the link of a site whose style you want.
Bring over the PRD, feature spec and brand packaging before you build, so the AI knows what it's making.
Gemini Omni can make a simple hero video. Ask for 16:9 and for a background that text can sit on.
Put the video behind the hero with some transparency. Subtle works better than flashy.
Build something you'd use yourself. Knowing the customer makes every decision easier. For more on this approach, see vibe coding and building an app with AI.

FAQ

How do you make Google AI Studio design a better landing page?

Give it more than a prompt. I attach screenshots of a site I like, that site saved as an HTML file, and its link. Then I ask it to apply the site's styling, typography and motion to my landing page.

What is Gemini Omni used for in this build?

I used Gemini Omni to make a short animated video for the hero section, a 3D cartoon of kids building a science project from household items, in 16:9. Google AI Studio then put it behind the hero text with some transparency.

What does the homeschool science app do?

You go through what you have at home, like a hair dryer, a trash bag, packing tape or cotton, and pick your tools. Then it walks you through instructions for a DIY science project built from those items.

How long did this app take to build?

About 15 to 20 minutes using Idea Browser and Google AI Studio, plus Gemini Omni for the hero video.

Chapters

Transcript

Read the full transcript

0:00This crazy that we just got this built together in 15 minutes with these two tools and it's essentially just helping kids that are homeschooled get into science project with tools around the house and it's working just on the first attempt. So you can see and demo it right here. You have pre-session cabinet audit. So you can basically go through your house, see what you have, pick what you have, you know, say you have a hair dryer, a black clean trash bag and you have direct radiant sunlight exposure and you have packing tape and let's say you have some cotton. So then basically you pick your tools, you hit next and then it goes through the special instructions on how to build the project. I mean that's amazing. If you

0:45want to see how we actually build this out end to end, you're going to want to stick around through the whole video from crafting the landing page, the hero section and actually building the hero feature of this app. Check it out and let's get right into it. Okay, so we're going to be using Idea Browser to launch this idea off the ground. It's going to take more than 30 minutes and I really hit home when I found this idea on Idea Browser. We pay $50 every couple months for Crunch Labs. This helps our kids get more into engineering and build out projects that are science-based at home, but it can be costly especially if you have four kids. So we home school them, but I came across this idea where you can essentially build your own type of Crunch Labs kit with just things that

1:31lie around your house. So this is going to be a web app. This is something that is going to be built right on Google AI Studio, really simple. We can connect and pull over the all this context into Google AI Studio, but the whole idea is to be able to take something that we actually use in our life and actually put it into production. So something like this is something that we would actually use and build out. So basically homeschooling parents typically spend about $50 per month on educational kits that kids complete in 20 minutes, but Curiosity Crates delivers curriculum-aligned do-it-yourself science project based on using household items, giving families unlimited hands-on learning without breaking the budget. So, each monthly box includes four to six experiments with step-by-step video guides, educational

2:17explanations, and extension activities that can stretch a single project across multiple days. So, this is stuff that you could basically find in your garage, in your closet, and you can turn it into do-it-yourself science kits. That it's going to be amazing. So, obviously this is in demand. You can see homeschooling resources have been trending up and up since 2022, and it's amazing. Like you have the lead magnet here, which is going to be an educational kit preview. You have the front end, which you can charge $15 to $20 a month, which is an introductory do-it-yourself kit, and then you have a monthly subscription box. So, monthly delivery of new do-it-yourself projects aligned with educational themes and curriculum standards. So, it says why now? The do-it-yourself educational kits market is prime for explosive growth fueled by a thriving do-it-yourself culture, rate

3:04rising homeschool trends, and technological advances that simplify kit creation. Just homeschooling in general is exploding right now. People feel like, man, my kids in public school for What is it, like thousands, 1,100 hours a year, and they come away with not a ton of useful knowledge. So, you can see more people that are just getting into homeschooling. I won't go into the whole philosophy of it, but when you're homeschooling your kids, it seems like they get actual, more practical advice for real-world application. And this is something that is perfect, directly in line. I know the avatar. I am one. This is something that I would buy. So, I know the avatar. I know the pain points. This is going to be great, easy to build. Let's get started. The first place we want to start is there's a top right-hand corner button where it says

3:49build this idea. What happens when you click on that? Well, we're going to go into Idea Bot Builder. This is going to allow us to connect to Google AI Studio and start building essentially. So, Google AI Studio just got a massive upgrade over this last week. You have Gemini 3.5 Flash, which really excels at design if you give it the right context. Don't just expect AI to just build out a beautiful high-converting landing page just by you telling it to do so. It needs screenshots. It needs context. It needs frameworks to be able to understand what to build. And that's what we're going to be doing. We're going to be looking at other example websites to that actually like convert and have modern style aesthetics to be able to build upon this website. So, we're going to pull in the product requirements document from Idea Browser, the feature spec, the brand packaging,

4:35all of that into Gemini, uh Google AI Studio, and we're going to start building this out. Okay, just to give Google AI Studio some context, I just copy-pasted this whole front page. The more context, the better. And then I paste that in. I'm going to go ahead and paste that in with some screenshots of a website that I want to kind of replicate. And I'm going to take some screenshots and just save the website as HTML. I just really like the Anti-Gravity website landing page in general. I love the style aesthetic. I love the typography. I love the movement through the actual landing page. I want to mimic and apply some of those concepts to what we're building here. So, like I said, I'm saving the HTML file. You can just see here, I mean it's

5:20beautiful, obviously. And you scroll down, has some more movement, more movement, really cool. And I just love it. It's really simplistic. For what we're trying to build with this homeschooling do-it-yourself type project, we want to keep it simple. So, save that. I'm going to take a few screenshots, and we'll go from there. We need to remember too that going back to these LLMs, you know, by design, they are all different, right? And Google AI Studio is one of the better when it comes to UI design, but it does need some direction and some more context the better. So, doing screenshots, copying the HTML of one of your websites that you're looking to kind of, you know, go after as far as the styling and typography and movement and things like that and also giving screenshots is

6:05really going to help you at least build the first best version of your landing page. So, again, I'm even going to give it the link. And then, I'm going to also give it that HTML file. And now, I'm going to get this initial prompt started. I want to build up this startup idea. It is a homeschooling do-it-yourself science-based project. Here is the context and here is some screenshots, the HTML file, and the website link for how I want the landing page to look. Take the styling, the typography, the motion, and apply it to our landing page. Now, I'm going to send this off and at least it's going to start building the foundation. When you think about building apps, you need to think about like how a house is built. The most important part of any home is the

6:52foundation. If you don't build and take the time to build out a good foundation for your app, you're going to go back and fix bugs later that you wish you had just squashed from the get-go. This is why we start with the PRD. This is why we start with the right structure and framework to be able to build this out properly. And the next step after that, you're going to want to give it the product requirements document. Without this document, it's not going to know anything about what to build, how to build it. So, we're going to copy this and send it off with the prompt as well. Okay, here's what it came up with after I gave it the PRD and the feature spec. I like this. I'm actually going to try something a little bit different and I'm going to use the new Google AI Omni to generate a beautiful hero section. So,

7:37I'm basically going to give that hero section that we have now along with a prompt to actually create some more movement. I think that we want to stop the scroll, we want to captivate the audience. I'm going to use that tool to be able to really build out a nice looking landing page. I think the website's very clear. Maybe it's a little bit too wordy, but I do like it as far as getting this MVP built. Remember, we're the target audience is parents who homeschool their kids and just want to do a science project. So, we don't want to overcomplicate it. So, if you haven't heard of Google Omni, this is a great way to add animate and add some motion into your hero section, and I think this is going to completely change how websites are being built. So, you can use it straight into inside of Gemini, and I'm just going to take a quick screenshot of this landing page

8:22real quick, and then we can just play around with it. So, you're seeing this happen in real time. I don't know exactly what's going to happen, but I have seen people do this with great results. So, we're going to take that screenshot. We're going to go to video section here, and it says create videos with Gemini Omni. Create anything. Create from anything. That's awesome. So, let's try it. I'm going to plop in my screenshot. Animate this hero section to portray building science projects that are directly related to homeschool kids. So, using things that are from around the house to create something cool. So, this is the hero section that I have now. I would love for something to be happening

9:07in the background behind all of the text. Some type of movement, something being built, some type of object being built or crafted from everyday supplies that are found around the home. From cabinets and garages, things that can be combined together to build something cool like a science project. And we're just [snorts] going to let it cook and see what it comes up with. I have no idea, but let's see. We are on the 3.5 flash model. Let's use the 3.1 promo just to see what happens. I think it's going to give us a 10-second video. Let's go from there. Wow, that was fast. That took like 30 seconds. Let's see how this turns out. I have no idea. Pretty cool. Um I don't know what's going on here. Um might need some

9:53tinkering. So, let's do that. Okay, good first try. Let's redo it so the background video doesn't make the text terrible. So, let's basically just focus on maybe creating a video. Um forget the screenshot that I handed to you. Just create a video, maybe a cartoon animation of kids putting something together that's crafted around the house for a science project. And just give me the video. Some type of like 3D animation and make it so black text can stand out on top of it overlaid. Also, make the video 16 by 9. Okay, it came up with a pretty simple video. I like it. It's simple. I mean, it's just better than nothing, right?

10:38So, I'm going to um overlay the hero page and have this kind of play underneath it, maybe with some transparency. We'll see how we can implement this and pull it into Google AI Studio to have that implemented. Okay, so now I'm back in Google AI Studio and I just told um the LLM, you know, I have attached the video. I'd love for you to add it to the hero section and have it play there. You may need to add some transparency so we can read the text overlaid on top of it on top of it. So, let's have it implement this video. All right. So, after implementing the video, I think it looks great. You don't want it to kind of be overwhelming and kind of go crazy. It just put it at a perfect transparency, very simple. And this is how we need to start thinking

11:24about building when we're building in Vibe coding websites that actually stick out because by design, the LLM, whatever you're using, is just not good. It's not the best. It needs context. It needs screenshots. It needs information. It needs HTML files. It needs skills to be able to put these components together. And using Google Omni in addition to Google AI Studio to put this all together, I mean, what? That took us like 20 minutes and we have a nice, really good looking website, you know, might be a little wordy, so we can go back and fix that. But here's the thing, this works. And like I said, the two tools that we used to make this all happen was simply Google AI Studio and Idea Browser. Those are two tools that help you just ship faster and be a better builder. We need to be able to

12:10learn how to use these tools efficiently and effectively to be able to create high converting landing pages that actually get customers quickly. You know, the days of building and taking weeks and months and years to build are long gone. Using tools like, you know, Google AI Studio and Idea Browser to just fast track the process is really going to help you in your building journey. I'll put the links to them down below. Check them out and we'll see in the next video. Bye-bye.

Ready to start building with AI?

Join Shipping Skool free — 4 live build sessions a week, courses, and a community that ships.

Join Shipping Skool

Keep reading

How to Build an App with Google AI Studio in 22 Minutes (No Coding)

I used Idea Browser to pick a validated idea and Google AI Studio to build Before You List, an app that scans real estate listing photos for AI edits and writes the required state disclosure. It took about 22 minutes and no coding.

Google AI Studio Tutorial: Build a Car Restoration App (No Code)

I build Restore It Right, a car restoration app, in about 20 minutes with an idea from Idea Browser and Google AI Studio. I use three prompts (landing page, feature spec, PRD), a Google Omni hero video, and Firebase with Google Auth, and Gemini turns a photo of the car into a restoration roadmap.

How to Build a Wedding Planning App with Google AI Studio (No Coding)

I built Tiny Knot, a micro wedding planning SaaS, in about 17 minutes. I validated the idea in Idea Browser, built the app in Google AI Studio from three prompts, added Firebase for the database and login, made a hero video in Google Omni, and connected Google Maps to pull in real local vendors.