Meet Outside.exe: an offline-first app that intercepts your screen time, uses Gemma to generate a custom real-world quest, and rewards you with a happy little pet.
*This is a submission for the Hacktoberfest Open-Source AI Challenge Week 1: Touch Grass*
What I Built
Every productivity and habit-tracking app I’ve tried feels like a spreadsheet yelling at me. I didn't want another hustle-culture tracker. I wanted a gentle nudge to look away from my screen.
Outside.exe is a cozy, pastel-themed "cottage garden" web app designed to intercept doomscrolling and replace it with tiny, AI-generated real-world "Side Quests."
Instead of an overwhelming dashboard, the app opens with a frosted-glass blur. It asks you to check in with yourself: How are you feeling? What’s your energy level? How much time do you have?
You click "✨ I'm bored — give me a quest," and the AI writes a custom, hyper-specific micro-adventure just for you, like:
- "Find a colorful flower and admire it."
- "Notice three things moving in the wind."
- "Give a passing cloud a silly name."
Once the quest generates, the blur fades away to reveal your garden. As you complete steps, you can use the inline camera feature to snap a tiny Polaroid-style photo memory for each task directly inside the row. Earning XP levels up your companion—a waddling cat named Mochi (or a dog named Bean) who lives in your garden and does a happy little jump when you check off a task. It doesn't require GPS or a map. It gives you a prompt, lets you snap a photo, and gets out of your way.
Demo
Code
💻 Check out the repo: https://github.com/AdibaNaushad/outside.exe.git
Outside.exe 🌸
Replacing doomscrolling with IRL side quests using local Gemma 🐾
Turn your neighborhood into a cozy RPG where every real-world flower found levels up your garden companion.
🌿 Overview
Most mobile and web apps are built around retention loops, push notifications, and endless feeds designed to keep eyes on screens. Outside.exe flips the game loop upside down: it uses open-weight AI to turn the physical world into an offline questing ground.
Instead of an overwhelming dashboard, the app opens with a frosted-glass check-in. Tell it your mood, energy, and available time, and Google's Gemma 2B writes a short set of real-world activities. Complete tasks, log photo memories directly on each task row, and watch your companion celebrate your offline breaks.
🗺️ How It Works (Adventure Flow)
┌──────────────────────┐ ┌─────────────────────────┐ ┌───────────────────────────┐ │ 1. The Check-in │ │ 2. Local Inference │ │ 3. The Garden Hub │ │ • Mood:How I Built It
Outside.exe is a full-stack application relying on a lightweight local AI.
- Frontend: Built with React and Tailwind CSS. It uses LocalStorage to persist your XP and garden state. I used modern CSS tricks (like
mix-blend-mode: multiply) to make JPG sprites blend seamlessly into the garden background, and custom@keyframesto make the pets waddle and jump without needing complex animation libraries. - Backend: A Python FastAPI server receives the user's mood and time parameters and constructs a strict prompt.
- AI: The backend calls Google's Gemma 2B (
gemma:2b) running locally via Ollama. I enforced a strict JSON output structure so the React frontend can perfectly parse the title, description, steps, and XP rewards.
Real Session SampleHere is a live generation recorded during local
📸 App Experience & Flow
| App Experience | App Flow |
|---|---|
 | Step 1: Selected Mood |
 | Step 2: Active Side Quests |
 | Step 3: Generated Quest By AI |
 | Step 4: Choose Your Buddy |
 | Step 5: Companion Reaction |
 | Step 6: Garden Companions |
 | Step 7: More Adventures & Evidence Collected |
🛠️ System Architecture
| Stage | Component | Technology | Role |
|---|---|---|---|
| User Intake | Blurred Onboarding Modal | React, CSS backdrop-filter | Blocks the dashboard to isolate intention and collect time/energy states. |
| Inference Engine | Local Gemma Pipeline | gemma:2b, Ollama runtime | Synthesizes physical constraints into real-world objectives in structured JSON. |
| API Transport | Microservice Bridge | FastAPI, Pydantic, CORS | Ingests client preferences, manages fallback schemas, and validates model output. |
| Feedback Loop | Animated Blossom Screen | Tailwind CSS (animate-bounce) | Clean, zero-dependency transition state while the model streams output. |
| Dashboard | Dynamic Quest Board | React State, CSS Flexbox | Renders actionable quest milestones, photo buttons, and XP progress bars. |
| Evidence Capture | Inline Proof Log | HTML5 Media Capture API | Captures live camera evidence per step (e.stopPropagation() isolated). |
| Companion State | Garden Mascot | CSS Transforms & Keyframes | Tracks pet level and executes celebratory animations on completion. |
🧪 Sample Generated Session
| Parameter | Recorded Value |
|---|---|
| Selected Mood | Bored |
| Physical Energy | Low (Keep it easy) |
| Allocated Time | 10 minutes |
| Generated Quest | A Little Pond Pause |
| Generated Steps | 1. Find a safe, peaceful spot. 2. Notice three things moving. 3. Take five slow, comfy breaths. |
| Evidence Collected | Inline photo verification captured per step via device camera. |
| Companion Reaction | Mochi jumps (+25 XP added to level progression). |
Things that broke (and what I learned):
- Checkbox Chaos: When I added the inline camera to each task, clicking the camera to take a photo accidentally checked off the task box simultaneously. I learned about event bubbling and used
e.stopPropagation()on the camera button to separate the actions. - JSON Hallucinations: Early on, Gemma would sometimes write conversational text before the JSON (e.g., "Here is your quest! { ... }"), which crashed my app's parser. I had to enforce strict prompting and build a fallback
try/exceptblock in Python to serve a default "Cloud Watcher" quest if the AI's formatting failed.
Why Does Open Innovation Matter?
This app handles personal data: your mood, your energy levels, and photos of your immediate surroundings. Sending that data to a closed-source, monolithic API felt wrong for a project focused on mindfulness and safety.
By using open-weight models like Gemma 2B, the entire intelligence of the app can run locally. The fallback mechanisms, the prompts, and the data stay entirely under my control. Open innovation allows us to build software that serves the user's well-being, rather than serving the user's data to a third party. It also means the app has a $0 running cost!
Running Gemma 2B locally ensures:
Complete Privacy: Mood inputs and task logs remain entirely on the local device runtime.
Zero Ongoing Costs: The inference engine runs locally or on self-hosted instances without token consumption fees or rate limits.
Deterministic Control: Open model access allows developers to tune prompt contracts and system fallbacks without risk of upstream model deprecation.
Prize Categories
- Best Use of Gemma: Gemma 2B acts as the creative engine, turning basic parameters (time, mood, energy) into structured, parseable, and emotionally intelligent real-world activities on the fly.gemma:2b powers the dynamic quest creation pipeline, translating mood, time, and physical energy into concise, structured real-world quests.
