DEV Community

CodeCrafter
CodeCrafter

Posted on

🌿 WalkAround β€” Touch Grass, One Discovery at a Time

Gemma 4 Challenge: Build With Gemma 4 Submission

This is my submission for the Hacktoberfest Open-Source AI Challenge β€” Week 1: Touch Grass.

🌿 WalkAround β€” Touch Grass, One Discovery at a Time

What if AI didn't give you another reason to stare at a screen, but helped you look up and explore the world around you?

That's the idea behind WalkAround, a nature journaling application built to encourage mindful outdoor exploration with the help of open-weight AI.

Instead of scrolling endlessly, imagine walking outside, noticing a curious-looking fern or a mushroom on a tree, capturing it when you need to, and keeping a little field journal of what you discovered.

AI becomes a companion to curiosityβ€”not the destination.

🌐 Try WalkAround Live

πŸ’» Explore the open-source code on GitHub

🌱 What I Built

WalkAround turns an ordinary walk into an opportunity to discover and document nature.

Here's what you can explore:

  • πŸ“Έ Capture or upload: Bring a photo of a plant, fungus, or animal into your field journal.
  • 🧠 Local vision AI: Run Google's open-weight Gemma model through Ollama to explore image-based nature observations on your own machine.
  • ⚑ Instant public demo: Explore curated specimen observations without waiting for local model inference.
  • πŸ“– Field journal: Save observations and revisit your discoveries.
  • πŸ—ΊοΈ Discovery map: Explore observation markers.
  • πŸ₯Ύ Walk summary: Review your discoveries and create a printable field journal.

The interface uses a warm, paper-cut-inspired visual style to feel more like a nature journal than another analytics dashboard.

🌼 Try It Yourself

Open the live WalkAround demo β†’

The hosted version is designed to be quick to explore. It includes curated sample observations such as:

  • 🌿 Wood Fern β€” Dryopteris carthusiana
  • πŸ„ Turkey Tail β€” Trametes versicolor
  • 🐝 Honey Bee on Clover β€” Apis mellifera
  • 🌳 Oak Lichen β€” a curated lichen observation

You can explore the observation and journaling experience without installing a model.

A transparency note: The hosted application uses Demo Mode. These are curated sample observations, not AI-generated identifications of the particular image a visitor uploads. For actual image-based inference, run WalkAround locally with Ollama and the configured Gemma model.

I wanted the demo to be accessible to judges and visitors without requiring them to download a model or wait several minutes for inference.

🧠 How I Used Gemma

For the local AI workflow, WalkAround uses Google's open-weight Gemma vision model through Ollama.

The basic flow is:

  1. The user supplies a specimen image.
  2. The backend prepares the image for inference using resizing and JPEG compression.
  3. Ollama runs the configured gemma4:e2b model locally.
  4. The application uses the model's response in its nature-observation workflow.

This approach lets people experiment with image-based AI without making a paid, hosted AI API a requirement for local inference.

Running a vision model locally also introduced a practical engineering challenge: inference speed depends heavily on the hardware available.

On CPU-only hardware, inference can take a long time. Rather than pretend that every machine can provide an instant AI experience, I separated the local AI workflow from the fast public demo.

That trade-off became an important part of the project: keep the AI experimentation possible locally while making the deployed application easy for everyone to try.

πŸ—οΈ How It Works

WalkAround is built with a lightweight web stack:

  • Frontend: React, JavaScript, and Vite
  • Backend: Python and FastAPI
  • AI: Google's open-weight Gemma vision model through Ollama
  • Image processing: Pillow
  • Deployment: Render static site and Python web service

The application has two execution modes:

Local AI mode

Image β†’ FastAPI β†’ Ollama + Gemma β†’ Nature observation

Hosted demo mode

Visitor β†’ React frontend β†’ FastAPI β†’ Curated sample observation

The second flow is intentionally different. It makes the public demo responsive without claiming that a sample observation came from the visitor's image.

☁️ Why I Chose Render

I wanted the project to be something people could actually open and exploreβ€”not just a repository that requires a complicated setup before anyone can see it.

I deployed the React frontend and FastAPI backend separately on Render and configured them through a render.yaml Blueprint.

This gave WalkAround a public URL while keeping the local model workflow separate from the hosted demo.

The deployment also involved real integration work: configuring the Blueprint, resolving service configuration issues, and fixing an npm dependency conflict before the frontend could deploy successfully.

The result: a live, accessible application alongside an open repository that others can inspect and run locally.

🌐 WalkAround on Render

πŸ’‘ Why Does Open Innovation Matter?

A closed AI API can be convenient, but it can also make experimentation dependent on a provider, account, network connection, and usage limits.

Open-weight models create another possibility: developers can experiment with AI on their own hardware, inspect the surrounding implementation, and build applications without making a hosted inference API mandatory for every local workflow.

WalkAround explores that possibility in a small, practical setting.

It also demonstrates an important lesson: using an open model is only one part of building a useful AI application. Accessibility, latency, honest communication about model limitations, and a working user experience matter too.

I don't want WalkAround to imply that AI can identify every species perfectly. Its purpose is to support curiosity and exploration, not replace expert identification or scientific verification.

πŸ§ͺ What I Learned

Building WalkAround taught me that a promising AI feature is not enough on its own.

  • Model performance matters: A vision model that runs locally may be impractical on limited hardware without careful expectations and optimization.
  • Fallbacks matter: A fast demo makes a project easier to evaluate without misrepresenting what the AI actually did.
  • Deployment is part of the product: The frontend, backend, environment variables, and service configuration all need to work together.
  • Transparency builds trust: Sample data should be clearly distinguished from live model inference.
  • Good technology should encourage real-world experiences: In this case, the application should help people spend more time observing nature, not less.

πŸ”­ What's Next?

There is room to improve WalkAround further: more reliable species-identification workflows, better communication of uncertainty, richer journal organization, and more offline-friendly exploration.

For now, the project is a working prototype exploring how open-weight vision AI can complement a mindful outdoor experience.

πŸ† Challenge Categories

I'm submitting WalkAround for:

  • Best Use of Gemma β€” for the local Gemma vision-model workflow.
  • Best Use of Render β€” for deploying the application as a public frontend and backend, configured through a Render Blueprint.

🌿 One Last Thought

We don't always need another app competing for our attention.

Sometimes, the best use of technology is to help us notice something we would otherwise have walked past.

Take a walk. Notice something small. Let curiosity lead the way.

Thanks for checking out WalkAround!

devchallenge #hf26challenge

Top comments (0)