DEV Community

SUNNY TIWARI
SUNNY TIWARI

Posted on

Touch Grass Bingo: an AI that runs in your browser and sends you outside

Hacktoberfest Open-Source AI Challenge Week 1: Touch Grass Submission 🌿

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

What I Built

Touch Grass Bingo is a small web app. You type your city or area, pick how much time you have (15 minutes to 2 hours) and a vibe (chill walk, photo hunt, street food and people, nature and wildlife). An open-weight AI model then writes a 5x5 bingo card for you: "Spot a street dog", "Hear a temple bell", "Find a flower".

Then you put the phone in your pocket and go tick the squares off. The middle square is free. Get a line and you get a BINGO.

The idea is simple: the app should be the shortest part of your day. You open it for 30 seconds, then you leave.

Demo

Live app: https://sanny1921.github.io/touch-grass-bingo/

Start screen of Touch Grass Bingo

A real card generated on my Android phone

The second screenshot is a real card, generated on my own Android phone in Chrome. It is not a mock.

Code

https://github.com/Sanny1921/touch-grass-bingo

How I Built It

  • Model: Llama 3.2 1B Instruct, an open-weight model.
  • Runtime: WebLLM, which runs the model inside the browser on WebGPU.
  • App: one plain HTML file with no framework, no backend and no API key. It is hosted free on GitHub Pages.

The first time you press "Generate my card", your browser downloads the model (about 700MB). After that it is cached on your device. Everything after that happens on your phone.

The struggle (v1 to v3)

I built this overnight, and the first version did not work on my phone.

v1: I asked the model to return a JSON array of 24 strings. On my phone the model loaded fine, but it kept returning broken JSON. After 3 retries the app gave up and showed a built-in starter card instead. So I had an "AI app" that was not using the AI.

v2: I figured a 1B model is just bad at strict JSON. I changed the contract to a plain numbered list ("1. Spot a street dog") and wrote a forgiving parser. It ignores numbering styles, bullets, markdown and duplicates, and drops junk lines. I also tried a bigger model, Qwen2.5 1.5B. But that was a 1GB download and it kept failing on my wifi with a cache error. Lesson: on a phone, model size is part of the product.

v3: I went back to Llama 3.2 1B, which my phone had already downloaded, and kept the numbered list. I also added a salvage step: the app keeps the best of 3 attempts, and if the model gives at least 14 good squares, it fills the rest from a starter list instead of throwing everything away. I also added retries for the model download and a visible progress percentage.

That worked. The card in the screenshot above came from the model on my phone.

Honest limits: a 1B model writes simple squares, and they can be generic ("Find a flower"). It is not a travel guide. A bigger model would write sharper, more local cards, and that is the first thing I would change with more time.

Why Does Open Innovation Matter?

  • Your location stays with you. You type where you are. That text goes to a model running on your own phone, not to someone else's server.
  • It costs nothing to run. There is no API bill, so I can leave it up for anyone. Hosting is a single static file.
  • I could swap the model. While building this I changed models and prompts several times by editing one line. With a closed API I would have been stuck with whatever it gave me.

What I Would Do Next

  • Let people pick a bigger model if their phone and wifi can handle it.
  • Save a card and share it with friends so you can race on the same one.
  • Use the time and weather to tune the card.

Prize Categories

This project does not use any partner tool. It is an open-weight model (Llama 3.2) running in the browser with WebLLM, so I'm entering for the overall prize.

Thanks for reading. Now go touch some grass.

Top comments (0)