{"slug": "plain-sight-walk-is-a-walking-game-that-lives-in-your-pocket", "title": "Plain Sight Walk is a walking game that lives in your pocket.", "summary": "A developer built Plain Sight Walk, a browser-based walking game that turns outdoor scavenger hunts into a photo carousel, using Gemma 2B via WebLLM on WebGPU to generate riddles and CLIP ViT-B/32 via transformers.js to verify photos match clues. The app runs entirely client-side with no server or API key, caching models in a service worker so it works offline after first load, and never uploads photos or stores GPS coordinates.", "body_md": "*This is a submission for the [Hacktoberfest Open-Source AI Challenge Week 1: Touch Grass](https://dev.to/challenges/hacktoberfest-week1-2026-10-05)*\n\nPlain Sight Walk is a walking game that lives in your pocket.\n\nEvery walk has a secret word, say WANDER. You spell it one letter at a time with things you actually find outside: W is for wall, A is for acorn, N is for nest. Gemma writes you a riddle for each letter and can read it aloud, so the phone stays away. When you find the thing, you photograph it, and an open vision model checks the photo. When the word is complete, the app turns your walk into a photo carousel: each slide is one of your photos, stamped with its letter, the object, and how many kilometres into the walk you took it. The secret word picks the look of the whole set. WANDER becomes \"Roadside Almanac\", a warm sepia. SHADOW becomes \"Chiaroscuro\", black and white.\n\nThe screen is only for the start and the end. The middle of the experience is looking at things.\n\nLive app: [plain-sight-walk.vercel.app] (best in recent Chrome or Edge; it needs WebGPU for Gemma)\n\nCode (MIT):\n\nEvery walk has a secret word. You spell it one letter at a time with real things you find outside (a leaf, a rock, the sky). Built for the DEV \"Touch Grass\" challenge.\n\n**Everything runs in your browser, with no server and no API key.**\n\n| Job | Open model | How it runs | \n|---|---|---|\n| Writes the riddles, field notes and closing postcard | Gemma (2B, the Gemma build available in WebLLM) | [WebLLM](https://github.com/mlc-ai/web-llm) , WebGPU | \n| Checks your photo matches the clue | CLIP ViT-B/32 (ONNX port by Xenova) | [transformers.js](https://github.com/huggingface/transformers.js) | \n\nPhotos are never uploaded. After the first load, models are cached and the app works with no signal.\n\n```\npython3 -m http.server 8000   # WebGPU needs https or localhost\n# open http://localhost:8000 in recent Chrome or Edge, tap \"Prepare for the walk\"\n```\n\nPush this folder to GitHub, then import the repo in Vercel. Framework preset \"Other\", no build command, no output…\n\nYou cannot play this at a desk. The only way to earn a letter is to stand in front of a real wall, a real patch of moss, a real nest. The riddles are read aloud, so between finds the phone can stay in your pocket. A six-letter word takes about [X] minutes of walking when you actually look. The carousel at the end gives you a reason to look properly: you are composing a photograph, not ticking a box.You cannot play this at a desk. The only way to earn a letter is to stand in front of a real wall, a real patch of moss, a real nest. The riddles are read aloud, so between finds the phone can stay in your pocket. A six-letter word takes about [X] minutes of walking when you actually look. The carousel at the end gives you a reason to look properly: you are composing a photograph, not ticking a box.\n\nIt is a static site: no backend, no API key, no database. It is deployed on Vercel straight from GitHub.\n\nGemma, running in the browser through WebLLM on WebGPU. It writes the riddles, a one-line \"look closer\" note after each find, and the closing postcard. The app picks the Gemma build WebLLM offers; in my run that was [model id shown in the app].\n\nCLIP, running through transformers.js. This does zero-shot image classification. Your photo is scored against the twenty possible objects plus distractors like \"a person\" and \"a computer screen\". A match means the target is the top label above a confidence threshold.\n\nThe device's own GPS. The app adds up distance as you walk and keeps only the running total. Coordinates are never stored or sent anywhere.\n\nA service worker caches the app shell. WebLLM and transformers.js cache the model files themselves, so after the first load the app can run with no signal.\n\nA canvas renderer composes the carousel as 1080x1350 slides, ready to save or share.\n\nThree design decisions mattered more than any code:\n\nThe object for each letter comes from a fixed table; Gemma writes the language around it. My first instinct was to let the model choose a thing for each letter. But a small model sometimes picks something you cannot photograph, and CLIP is far more reliable on common objects. Splitting the work this way made the game dependable outdoors, where there is no retry button for a bad clue.\n\nGemma is told to give attention, not facts. Small models invent facts about nature, confidently. So the field notes only invite you to look closer. [If you tested the unconstrained version, say what it did.]\n\nThe game never calls you wrong without an exit. CLIP will sometimes be mistaken, so there is always a \"Count it anyway\" button. A walk is not an exam.\n\nIt works where signal does not. A walk is exactly where signal disappears. Both models run in the browser and are cached, so [describe what you saw when you went offline].\n\nYour photos stay on your phone. A game that asks you to photograph your neighbourhood should not upload it. With open weights running locally, there is nothing to upload them to.\n\nIt costs nothing to run. There is no per-request bill, so I can leave the demo public without worrying that a stranger's walk costs me money.\n\nI can swap the model. The app selects Gemma from WebLLM's list and CLIP is one line. When a better small model appears, the game improves with a small edit.\n\nWhere a closed approach would have been worse: [your honest comparison, or delete this line].\n\nWhat Went Wrong\n\nThe first download failed on my network. My first attempt stopped at Cache.add() encountered a network error. The DevTools Network tab showed the tokenizer.json request returning a redirect, and the file it redirected to failing. CLIP, which comes from the same site, loaded fine, so Hugging Face itself was reachable; something between me and its file host was not. [How you resolved it: a hotspot, secure DNS, another network, or not at all.] The lesson: an offline-first app needs a graceful path when the first download fails. The app now retries once and then falls back to built-in riddles instead of stopping.\n\nMy own service worker served me a stale page. I cached the app shell \"cache first\", so my fixes did not show up and I debugged old code for a while. App files are now fetched network-first.\n\nThe first load is large, roughly 2 GB [check your own number under DevTools, Application, Cache Storage], so it should be prepared on Wi-Fi before you leave home.\n\nGPS can pause when a phone screen locks. I added a \"keep screen awake\" option, at a battery cost. [Your own result.]\n\nCLIP is sometimes wrong, and GPS is only accurate to roughly a few metres under open sky, less under trees. Treat the kilometres as \"about\".\n\nBest Use of Gemma: Gemma is the voice of the whole game, and it runs entirely on the player's device.\n\n*Built for Touch Grass. Go outside; it is better than the screen.*", "url": "https://wpnews.pro/news/plain-sight-walk-is-a-walking-game-that-lives-in-your-pocket", "canonical_source": "https://dev.to/maitrivv/plain-sight-walk-is-a-walking-game-that-lives-in-your-pocket-gjo", "published_at": "2026-10-09 15:18:26+00:00", "updated_at": "2026-10-09 15:21:26.598641+00:00", "lang": "en", "topics": ["ai-tools", "generative-ai", "computer-vision", "large-language-models", "ai-products"], "entities": ["Gemma", "WebLLM", "CLIP", "transformers.js", "Vercel", "GitHub", "Hacktoberfest", "Xenova"], "also_reported_by": [], "alternates": {"html": "https://wpnews.pro/news/plain-sight-walk-is-a-walking-game-that-lives-in-your-pocket", "markdown": "https://wpnews.pro/news/plain-sight-walk-is-a-walking-game-that-lives-in-your-pocket.md", "text": "https://wpnews.pro/news/plain-sight-walk-is-a-walking-game-that-lives-in-your-pocket.txt", "jsonld": "https://wpnews.pro/news/plain-sight-walk-is-a-walking-game-that-lives-in-your-pocket.jsonld"}}