From Google AI Studio prototype to a real Android app

From AI Prompt to Android APK in Under 15 Minutes

Karri Sai Sudheer Reddy — Fri, 22 May 2026 06:01:57 GMT

TL;DR: Describe your app in Google AI Studio, export a React + Vite project, wrap it with Capacitor, run three command blocks, and you have a real .apk on a real Android device — in under 15 minutes.

Why This Matters Right Now

Most mobile development tutorials assume you have a week to spare: install Android Studio, configure an emulator, pick a framework, wire up navigation, fight Gradle. By the time you touch a real APK, the motivation to ship has usually faded.

That window just collapsed.

Google AI Studio now generates complete, mobile-first web apps from a single prompt — including file structure, TypeScript types, component architecture, and a working Vite build. Pair that with Capacitor's native Android shell and the ADB toolchain you already have, and the loop from idea to installed APK is genuinely under 15 minutes.

This post documents exactly how I did it with a Habit Tracker app: what I generated, how I packaged it, what broke, and how to verify it worked on a physical device.

The time split:

~5 minutes — generate the app in AI Studio
~5 minutes — wrap with Capacitor, build the APK
~5 minutes — install via ADB, smoke test

No backend required. No app store yet. No React Native learning curve if you already know React.

What AI Studio Actually Generates

Before diving into commands, it helps to understand what you're working with.

AI Studio (Gemini) does not output a native Android project. It generates a React + Vite + TypeScript web application — a mobile-first PWA-style codebase optimised for a phone browser. The screenshots below show exactly what came out of a single prompt:

The code view — AI Studio scaffolded 11 files in under 5 minutes: App.tsx, full component tree (HabitCard, CalendarGrid, StatsDashboard, AddEditHabitModal, MobileFrame), typed data layer in types.ts, utilities in utils.ts, and a complete package.json with Vite, Tailwind, TypeScript, and Motion already wired.

The preview — Switch to mobile preview mode and the app renders fully: today's habit list with streak counters, category filters, a floating add button, and glassmorphism UI. This is running entirely in the browser — no native APIs, no device, just a React SPA.

This is the important constraint to understand: AI Studio generates web apps, not APKs. The packaging step covered in Section 3 is what closes that gap.

Section 1 — Generate the App (~5 minutes)

The prompt

Open Google AI Studio and paste this. Adapt the domain (habit tracker, todo list, expense log, journal — anything CRUD + UI):

Build a mobile-first habit tracker app in React + Vite + TypeScript.
Use localStorage only — no backend.
Tabs: Today, All Habits, Stats.
Each habit: name, category, color, icon, daily/weekly frequency, completion history, streaks.
Glassmorphism UI with dark theme, bottom navigation, floating add button, modal for create/edit.
Keep all state in-memory and persist to localStorage on every change.

Gemini 3.5 Flash ran for 275 seconds and produced 11 files. You can watch it build in real time in the Code tab.

What you should have when the timer stops

src/
  App.tsx
  types.ts
  utils.ts
  index.css
  components/
    HabitCard.tsx
    CalendarGrid.tsx
    StatsDashboard.tsx
    AddEditHabitModal.tsx
    MobileFrame.tsx
package.json        ← includes vite, react, tailwindcss, typescript
vite.config.ts
tsconfig.json

The package.json from the generated output included these runtime dependencies:

{
  "dependencies": {
    "react": "^19.0.1",
    "react-dom": "^19.0.1",
    "lucide-react": "^0.546.0",
    "@tailwindcss/vite": "^4.1.14",
    "motion": "^12.23.24"
  }
}

The data model

AI Studio generated a clean typed interface. This is the shape everything else depends on:

interface Item {
  id: string;
  name: string;
  category: string;
  frequency: "daily" | "weekly";
  history: string[];   // "YYYY-MM-DD" completion dates
  streak: number;
  bestStreak: number;
}

Persistence pattern

State persists on every mutation — no server, no sync, just localStorage:

function saveItems(items: Item[]) {
  localStorage.setItem("app_db", JSON.stringify(items));
}

function loadItems(): Item[] {
  const raw = localStorage.getItem("app_db");
  return raw ? JSON.parse(raw) : [];
}

Export the project

Hit Export (top-right in AI Studio) to download a .zip of the full source. Unzip it locally.

cd ~/Downloads
unzip habit-tracker.zip -d habit-tracker
cd habit-tracker
npm install
npm run dev    # verify: opens at localhost:3000

Stop when it runs in the browser. Section 1 done.

Section 2 — Make It Installable (~2 minutes)

The app works in a browser. Now we need it to work as an Android APK. This is where Capacitor comes in — Ionic's native bridge layer that wraps a compiled web app in a thin Android WebView shell.

Install Capacitor

npm install @capacitor/core @capacitor/cli
npm install @capacitor/android

Initialise the project

npx cap init "Habit Tracker" com.example.habittracker --web-dir dist

This creates capacitor.config.ts. It should look like this:

import type { CapacitorConfig } from "@capacitor/cli";

const config: CapacitorConfig = {
  appId: "com.example.habittracker",
  appName: "Habit Tracker",
  webDir: "dist",
};

export default config;

webDir: "dist" is the key line. Capacitor will bundle whatever Vite outputs to dist/ — the compiled, minified web app — into the Android project.

Add the Android platform

npx cap add android

This scaffolds a full Android Gradle project at ./android/. You don't need to touch it manually for an MVP.

Section 2 done — about 2 minutes if the project already builds.

Section 3 — Build the APK (~5 minutes)

Three commands in sequence. Run them from the project root:

# 1. Compile the React app into dist/
npm run build

# 2. Copy dist/ into the Android project
npx cap sync android

# 3. Build the APK with Gradle
cd android && ./gradlew assembleDebug

The APK lands at:

android/app/build/outputs/apk/debug/app-debug.apk

A successful build ends with:

BUILD SUCCESSFUL in 1m 24s
47 actionable tasks: 47 executed

The one gotcha — Java version

Capacitor 8+ requires Java 21. If Gradle fails with:

error: invalid source release: 21

Your system JDK is too old. The fastest fix (macOS + Android Studio) is to point Gradle at Android Studio's bundled JBR:

# android/gradle.properties
org.gradle.java.home=/Applications/Android Studio.app/Contents/jbr/Contents/Home

Re-run ./gradlew assembleDebug. Budget one extra minute for this — it happens on almost every first build.

Optional: Streak logic worth keeping

Streaks are pure functions with no server dependency — the one piece of logic worth implementing properly from day one:

function calculateStreaks(
  history: string[],
  frequency: "daily" | "weekly"
): { current: number; best: number } {
  if (history.length === 0) return { current: 0, best: 0 };
  const dates = [...new Set(history)].sort();

  if (frequency === "daily") {
    // Walk consecutive calendar days backward from today
    let current = 0;
    let best = 0;
    let prev: Date | null = null;
    for (let i = dates.length - 1; i >= 0; i--) {
      const d = new Date(dates[i]);
      if (!prev || (prev.getTime() - d.getTime()) === 86400000) {
        current++;
        best = Math.max(best, current);
      } else {
        break;
      }
      prev = d;
    }
    return { current, best };
  }

  // Weekly: group by ISO week, count consecutive weeks
  // (implement similarly, grouping dates by getWeek())
  return { current: 0, best: 0 };
}

Call it on app start and after every toggle so numbers stay correct when the user skips days.

Section 3 done.

Section 4 — Install and Smoke Test (~3–5 minutes)

Two installation paths

Option A — ADB (USB cable, any machine with ADB)

# Confirm device is connected
adb devices

# Install (the -r flag replaces any existing install)
adb install -r android/app/build/outputs/apk/debug/app-debug.apk

# Optional: launch immediately from CLI
adb shell monkey -p com.example.habittracker \
  -c android.intent.category.LAUNCHER 1

For multiple connected devices:

adb -s  install -r app-debug.apk

Option B — Install directly from AI Studio

AI Studio now has a direct ADB integration. Connect your Android phone via USB cable, and the Install button in AI Studio handles the transfer without leaving the browser. Under the hood it's the same ADB flow — just abstracted into one click.

Option C — Google Play internal testing track

If you have a Google Play Developer account, AI Studio can publish directly to an internal testing track. It automatically creates the app record, packages the bundle as an AAB, and uploads it to Play Console. Your app is available to install within minutes, and subsequent rebuilds from AI Studio update the track automatically — no manual Play Console steps.

For an MVP or internal tool, the ADB route is faster. For anything going to a wider audience, the Play track route gets you proper distribution from day one.

60-second smoke test checklist

Run through these six steps on the device immediately after install:

Step	Action	Pass?
1	App opens — no white screen, no crash	☐
2	Sample data or empty state renders correctly	☐
3	Add one new habit via the modal	☐
4	Mark it complete for today — streak increments	☐
5	Kill the app, reopen — data is still there	☐
6	Stats tab shows updated count	☐

All six pass? Your 15-minute pipeline is real and repeatable.

Section 5 — The Full Picture: AI Studio's End-to-End Workflow

It's worth stepping back to understand what AI Studio is building toward. The current flow (generate → export → Capacitor → Gradle → ADB) is already functional, but Google is tightening each handoff:

Browser-based Android Emulator (no local SDK)

AI Studio now embeds an Android Emulator directly in the browser. You can preview, interact with, and test your app on a virtual Android device without downloading Android Studio, without configuring AVDs, without any local SDK installation. This is the "create and iterate in the cloud" phase — the emulator runs on Google's infrastructure.

USB install from AI Studio

Once you're ready to move to a physical device, connect via USB cable and use the integrated ADB in AI Studio to install directly. No terminal required.

Direct Google Play publishing

For distribution, AI Studio can push to a Play Console internal testing track in one click — creating the app record, packaging the AAB, and uploading it automatically. You stay in the AI Studio tab the entire time.

The trajectory is clear: the entire lifecycle (generate → emulate → install → publish) is collapsing into a single browser tab.

What's Next: Hour 2, Not Day 2

For developers

Upgrade	Effort
Custom app icon + splash screen	Low — replace assets in `android/app/src/main/res/`
Release signing for Play Store	Medium — generate keystore, configure `build.gradle`
Push notifications	Medium — add `@capacitor/push-notifications` plugin
API calls to a backend	Medium — use `fetch()`, never hardcode keys in the WebView
Authentication + cloud sync	High — skip for v1, ship local-first

For QA engineers

Once the APK is on a device, the package ID and APK path are enough to drive automated testing flows. The pattern is consistent across any app generated this way:

# Install
adb install -r ./apps/my-app.apk

# Drive via adb shell input or any ADB-based test runner
# Example: open app → add habit → complete → assert streak

The test harness doesn't change per app — only the APK and package name swap. This makes the generate → test loop highly automatable.

Honest Limits

This stack (React + Vite + localStorage + Capacitor + Gradle + ADB) is intentionally boring. Here's what it handles well and where it hits walls:

Works well: Forms, lists, charts, local data, offline-first apps, internal tools, MVPs, demos, anything CRUD.

Hits walls: Heavy 3D rendering, background GPS, Bluetooth, complex native APIs not covered by a Capacitor plugin.

WebView performance is fine for the workloads above on any Android device from the last four years.

The "5 + 5 minutes" claim assumes the AI output compiles with minor fixes. Budget the full 15 when Gradle or JDK trips you once — which it will on a fresh machine. After the first successful build, subsequent rebuilds take under 2 minutes.

Putting It All Together

AI Studio prompt (5 min)
        ↓
  React + Vite + TS source
        ↓
  npm install @capacitor/*
  npx cap init + add android   (2 min)
        ↓
  npm run build
  npx cap sync android
  ./gradlew assembleDebug      (5 min, incl. one Gradle retry)
        ↓
  app-debug.apk
        ↓
  adb install -r *.apk         (1 min)
        ↓
  Smoke test checklist         (3 min)
        ↓
  ✓ Real app. Real device. Under 15 minutes.

You don't need a month to touch a real APK. Five minutes to generate a focused mobile web app, five minutes to wrap and compile it, five minutes to install and click through it — that's a complete loop product and engineering teams can repeat indefinitely.

The stack is boring on purpose. Boring ships.

Try It

Open Google AI Studio and paste the prompt from Section 1
Run the three command blocks from Sections 2 and 3
Install via ADB or the AI Studio USB integration
Run the six-step smoke test

Post your BUILD SUCCESSFUL screenshot and APK install screen. The loop works.

Tags: capacitor android apk google-ai-studio react vite rapid-prototyping mobile-development adb gemini