Building a Ad-Free, Kid-Friendly Drawing PWA with My Daughter and Google AI Studio

Introduction

"Daddy, another ad?"

If you have young kids who use an iPad, you may know this problem.

Last week, my daughter was using a free drawing app. She was happy and busy making her art. But every few minutes, a loud ad came on the screen. She could not skip it. It stopped her drawing again and again.

After this happened many times, she looked at me and said:

"I just want to draw. Can we make our own app without ads?"

At first, I could have said that making an app takes too much time. But then I thought, why not try?

So we made it a small weekend project.

My daughter became the product boss. She asked for rainbow brushes, a big drawing space, fun sounds, and no pop-ups. I worked on the code.

Together, we built this:

unicorn-draw.vercel.app

The tool that helped us build it fast was Google AI Studio with Gemini.

The Tech Stack

I wanted the app to be easy to use on an iPad. I also did not want to deal with the App Store.

So I made it as a Progressive Web App, or PWA. This means it works like an app, but it runs in the browser.

Here is what I used:

• HTML5 Canvas API for drawing


• CSS for big buttons and bright colors


• Service Worker so the app can work offline


• Web App Manifest so it can be added to the home screen


• Google AI Studio and Gemini to help write and improve the code

Because it is a PWA, my daughter can open it from the iPad home screen. It runs full screen. It has no ads, no tracking, and no hidden pop-ups.

Building with Google AI Studio

Google AI Studio made the work much faster.

First, I asked Gemini to make a simple drawing app using HTML5 canvas. I also asked it to support touch events, so it would work well on an iPad.

Then my daughter tested the first version. She quickly asked for a magic rainbow brush and a simple clear button.

I gave the code back to Gemini and asked it to add a rainbow brush. I also asked it to make the buttons look more fun for a drawing app.

After that, I used Gemini to help create the PWA files, like manifest.json and the service worker.

In a short time, the app started to feel like a real tablet app.

Source Code

The project is open source.

You can see the full code here:

GitHub Repository: gaurav101/unicorn-draw

How to Install It on an iPad or Phone

You can add the app to your home screen in a few seconds.

1. Open unicorn-draw.vercel.app in your browser.


2. On iPhone or iPad, tap the Share button. On Android, tap the three dots menu.


3. Tap "Add to Home Screen".


4. Open it from the home screen and start drawing.

Now your child has a simple drawing app with no ads.

What I Learned

1. AI Helps You Build Faster

Gemini did not just write code for me. It helped me move fast.

Instead of spending time on small setup work, I could focus on how the app should feel for my daughter.

The whole project took only a couple of hours.

2. Kids Can Learn That They Can Build Things

The best part was not the app.

The best part was seeing my daughter understand something important:

Technology is not something we only have to use. If something is annoying or broken, we can try to make a better version.

That was the real win.