DEV Community

Cover image for GrassQuest
Anant Singh
Anant Singh

Posted on

GrassQuest

What I Built
GrassQuest turns a short walk into a small discovery quest. It uses your browser’s location to generate a nearby waypoint, then invites you to head there, notice something outdoors, and write a quick reflection. An open-weight Gemma model classifies that reflection as Monsoon Water, Earthy Terra, Urban Flora, or Solar Heat. Your completed quest adds a colored “fog” area to your map, saved in your browser.

It’s for anyone who wants a lightweight nudge to explore their surroundings instead of spending more time scrolling.

Demo
Running live on Render - added rate limiting to limit the number of calls to the service, to protect against misuse of the service.

Fog clouds over quests completed in past
Hover over fog cloud to see reflection
Elemental card generated from reflection

Code
GitHub link

How I Built It
The frontend is HTML, CSS, and vanilla JavaScript, with Leaflet and OpenStreetMap for the map. A FastAPI backend sends the reflection to a Gradio endpoint in a Hugging Face Space, where Google Gemma 3 4B Instruct runs on GPU and returns one of the four element labels.

The model is part of the core interaction: its classification shapes the quest result and the color of the completed area on the map.

Why Does Open Innovation Matter?
Using an open-weight model makes the classifier’s behavior something I can inspect and change—not a black-box API I have to accept as-is. The labels and instructions can be adapted for a different kind of outdoor activity, and the model can be swapped or self-hosted on suitable hardware.

GrassQuest isn't just open-source in code-it is designed to be completely free to build, deploy, and host for yourself:

  1. Free Single-Service Cloud Hosting: Uses Render’s free tier to serve both the FastAPI backend and static frontend assets out of a single service.
  2. Zero Database Infrastructure: Eliminates paid cloud storage or managed database costs by storing user exploration state natively in browser localStorage.
  3. Zero-Cost Open AI Inference: Leverages open-weight Gemma 3 models hosted on Hugging Face Spaces, avoiding expensive commercial API subscriptions.
  4. Fork & Customize: Anyone can clone the repository, tweak the prompt to fit custom elemental themes (or eco-tours), and launch their own community instance in minutes.

Prize Categories

  • Best Use of Render

Top comments (0)