How I Built an Offline-First Urban Exploration Game with Next.js, Ollama

This is a submission for the Hacktoberfest Open-Source AI Challenge Week 1: Touch Grass

What I Built

Most developers and tech workers spend 8 to 12 hours every day bathed in the blue glare of code editors, terminal output, and social feeds. When we do step outside, our heads are still tilted down toward glowing smartphones.

ParaQuest is a mobile-first, tactile exploration application designed to break that screen hypnosis. Instead of acting as another addictive feed, chatbot, or gamified streak tracker, ParaQuest acts as an urban field guide with one objective: get you off your screen and into the real world.

Demo

• Live Deployed App: paraquest.onrender.com
• GitHub Repository: github.com/ezabhishek1/para-quest

(You can test the application instantly in your browser using Curated Demo Mode or connect your local Ollama instance for live open-model inference).

Code

ezabhishek1 / para-quest

A mobile-first, editorial web application crafted for the **DEV.to Hacktoberfest Week 1 2026 “Touch Grass” challenge**.

ParaQuest — The City Is Your Playground

A mobile-first, editorial web application crafted for the DEV.to Hacktoberfest Week 1 2026 “Touch Grass” challenge.

ParaQuest helps people reconnect with physical reality through bite-sized, mind-opening urban exploration quests with a bold, tactile Neo-Brutalist aesthetic.

---

🌿 The Core Loop

$$\text{Choose Your Time} \longrightarrow \text{Get 3 Quests} \longrightarrow \text{Pocket Phone} \longrightarrow \text{Explore} \longrightarrow \text{Record Discovery}$$

• Zero Addictive Mechanics: No streaks, no social leaderboards, no push notifications.
• Strict Client-Side Privacy: Journal entries, photos, and saved quests persist in the browser's IndexedDB.
• Deterministic Safety: Application code enforces that quests require zero trespassing, zero money spent, and zero hazard.

---

🛠️ Technology Stack

• Framework: Next.js 16 (App Router with TypeScript in strict mode)
• Styling: Tailwind CSS with custom Neo-Brutalist tokens (deep ink borders, tactile drop shadows, forest green and ochre accents)
• Icons: Lucide React
• Validation: Zod runtime schemas
• Persistence…

View on GitHub

Stack & Architecture Highlights:

• Next.js 16 (App Router) & React 19 with strict TypeScript.
• Tailwind CSS with a custom Neo-Brutalist design token system.
• IndexedDB via idb with client-side canvas photo compression for zero-cloud data sovereignty.
• Vitest & JSDOM with 10 unit tests verifying deterministic safety rules, Zod schemas, and photo validation.
• Render Blueprint (render.yaml) for one-click full-stack deployment.

How I Built It

ParaQuest is architected around open-weight models and local inference via Ollama:

1. Open-Weight Model Architecture (Gemma)

The server-side generation layer calls Ollama (/api/generate) targeting lightweight open models (such as gemma:2b or gemma2:2b). Because the model requires only ~1.6 GB to 2.0 GB of VRAM, developers can run inference locally and offline even on entry-level laptop GPUs (like an NVIDIA RTX 2050 4GB). It also supports cloud open models such as gemma4:cloud.

2. Deterministic Safety Engine & Runtime Validation

AI models should never send users into dangerous real-world situations. Rather than relying solely on LLM prompt obedience, ParaQuest validates all model outputs through an application-level deterministic safety validator:

• Zero Trespassing: Rejects prompts mentioning fences, private property, abandoned buildings, or restricted zones.
• Zero Financial Cost: Rejects tasks requiring purchasing goods, drinks, or spending money.
• Zero Physical Hazard: Filters instructions to touch unknown animals, taste wild plants, or cross highways.
• Strict Duration Constraints: Runtime schemas enforced via Zod (AiQuestsResponseSchema).

3. Graceful Curated Demo Fallback

If Ollama is offline or the user is exploring without a local AI daemon, the app seamlessly provides a hand-crafted catalog of verified urban quests. The UI transparently identifies demo quests and never hallucinates or disguises fallback output as AI-generated.

Why Does Open Innovation Matter?

Open innovation and open-weight AI matter deeply for applications that bridge the digital and physical worlds:

1. Complete Privacy for Personal Living Spaces: Urban exploration starts from where you live—your campus dorm, apartment block, or neighborhood street. Closed commercial AI APIs require piping your daily geographic context, daily schedule, and personal field observations to proprietary servers. With local open models, your prompts and daily routines never leave your hardware.
2. Offline-First Resilience: Nature parks, hiking paths, and remote alleys frequently have spotty cellular reception. Closed API apps break the moment connectivity drops; open-weight models running on local devices remain 100% operational in airplane mode.
3. Predictable Cost & Community Sovereignty: Real-world exploration should be accessible to anyone regardless of API subscription tiers or token rate limits. Open models empower builders to deliver free, sustainable community utilities without metered API billing anxiety.

My Agent Session

This project was pair-programmed with Google DeepMind's Antigravity agentic coding harness, using the DevRelay gateway and official Agent Skills to inspect guidelines, build the Neo-Brutalist design system, and manage deployment configurations.

Prize Categories

• Overall Open-Source AI Challenge
• Best Use of Render:: Deployed on Render using a native Blueprint (render.yaml) as a Node.js web service running the Next.js App Router and dynamic server-side AI routes.
• Best Use of Gemma:
• Best Use of GitHub Copilot:

Team Submissions: Built by @ezabhishek1.