DEV Community

Cover image for OutThere: An AI That Gets You Off Your Screen and Outside
Ariba  Sayed
Ariba Sayed

Posted on Edited on AI-assisted

OutThere: An AI That Gets You Off Your Screen and 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

OutThere is a minimalist web application designed to be the "anti-app." Its primary goal is to give users a compelling, AI-powered reason to put their phones down and reconnect with the physical world.
It serves as a bridge between digital convenience and physical exploration. For anyone feeling "screen-locked," OutThere provides real-time, context-aware triggers to go outside—whether it's a personalized "OutThere Moment" based on the time of day, an AI-curated list of nearby parks and gardens tailored to the current weather, or a custom-generated "Outdoor Mission" that turns a simple walk into a small adventure.

Demo

demo.mp4 - Google Drive

favicon drive.google.com

Code

🌿 OutThere

OutThere is a minimalist web application designed to encourage people to disconnect from their screens and reconnect with the physical world. It uses real-time weather data and AI-powered recommendations to give users a reason to "touch grass."

✨ Features

  • Dynamic Home Experience: A personalized greeting and "OutThere Moment" card that changes based on the time of day (Sunrise, Morning, Afternoon, Sunset, Evening, Stargazing).
  • Real-time Weather Integration: Fetches current temperature, wind speed, and celestial events (sunrise/sunset) via the Open-Meteo API.
  • AI-Powered Explore: Uses Gemma AI to suggest the best nearby places to visit based on current weather conditions.
  • Event Discovery: Integrates with Google Search (via SerpApi) to find real-world events happening today, tomorrow, and over the weekend.
  • Outdoor Missions: A "Mission Builder" that generates a custom outdoor adventure based on the user's available time and desired mood.
  • Direct Navigation: One-click "Get Directions" buttons…

How I Built It

I built OutThere using a modern full-stack architecture focused on real-time data and open-weight AI:

  • AI Core: I used Gemma (google/gemma-4-26B-A4B-it) via the Hugging Face Inference API. Gemma powers two critical features:
    • The Recommendation Engine: It analyzes a list of nearby outdoor locations (fetched via SerpApi) alongside real-time weather data to rank the top 3 best places to visit right now.
    • The Mission Builder: It generates structured, JSON-based "Outdoor Missions" based on the user's available time, budget, and desired mood, ensuring the activities are realistic and encourage physical movement.
  • Backend: A Python/Flask server that orchestrates data between the frontend and multiple APIs.
  • Frontend: A responsive React application using Lucide-React for a clean, nature-inspired aesthetic.
  • External Data:
    • Open-Meteo API for hyper-local weather and celestial events (sunrise/sunset).
    • SerpApi (Google Maps) for discovering actual parks, gardens, and outdoor spaces in the user's vicinity.





Key User Journeys:

  1. The OutThere Moment: Instead of a static dashboard, the home screen changes based on the celestial clock. Whether it's "Golden Hour" or "Stargazing" mode, the app tells you exactly why right now is the best time to be outside.
  2. AI-Curated Exploration: Using a combination of local geospatial data and LLM reasoning, the app suggests the top 3 best places to visit based on current weather (e.g., "It's cloudy, so Ulsoor Lake is a strong sunset candidate").
  3. Outdoor Missions: To gamify the experience, I built a "Mission Generator" that creates structured, low-budget, time-bound adventures (e.g., "The Urban Explorer") to turn a boring walk into a mindful mission. Hyper-Local Discovery via SerpApi To avoid the "generic list" problem, I integrated SerpApi's Google Maps engine. Most apps just search for a city. OutThere uses the user's exact latitude and longitude with a specific 14z zoom level to query for "parks, gardens, and outdoor places." This ensures the results are not just "in the city," but within walking or short-driving distance. The Pipeline: User Location -> SerpApi (google_maps engine) -> Filtered Local Results (Titles, Ratings, Hours, Images) -> Backend Processing.

Gemma AI Reasoning
Raw data from SerpApi is just a list. To make it "smart," I piped this data into Gemma (google/gemma-4-26B-A4B-it).
I implemented a two-stage AI pipeline:

  1. The Recommendation Engine: I pass Gemma the current weather (temp, wind, precipitation) and the list of places. Gemma then acts as a local guide, ranking the places and writing a concise, persuasive reason why that place fits the current weather.

  2. The Mission Builder: A separate prompt architecture that takes user constraints (Time, Budget, Mood) and generates a valid JSON object containing a title and a step-by-step itinerary.

The core magic happens in the interaction between the explore route (fetching raw data) and the recommendations route (AI reasoning).

# Validating that Gemma didn't invent a fake place
valid_names = {place["name"] for place in simplified_places}
validated = []

for recommendation in gemma_recommendations:
    name = recommendation.get("place")
    if name not in valid_names:
        continue  # Reject hallucinated places

    validated.append({
        "place": name,
        "rank": len(validated) + 1,
        "reason": recommendation.get("reason") or "A good nearby outdoor option."
    })
Enter fullscreen mode Exit fullscreen mode

LLMs are prone to hallucinations. To ensure the app never sends a user to a non-existent park, I implemented a Strict Validation Layer. The AI provides the reasoning, but the system cross-references every suggestion against the ground-truth data fetched from SerpApi. If the AI 'invents' a place, the system silently filters it out, ensuring 100% reliability.

places_params = {
    "engine": "google_maps",
    "q": "parks gardens outdoor places",
    "ll": f"@{latitude},{longitude},14z", # Hyper-local zoom
    "type": "search",
    "api_key": SERPAPI_KEY
}
Enter fullscreen mode Exit fullscreen mode

To achieve true hyper-locality, I leveraged SerpApi's ll (latitude/longitude) parameter with a 14z zoom level. This transforms a generic search into a precise geospatial query, ensuring that the suggested 'touch grass' locations are within the user's immediate physical neighborhood, removing the friction of long-distance travel.

Why Does Open Innovation Matter?

Building this with open-weight models like Gemma was a conscious choice. Closed APIs often force you into a "one-size-fits-all" response style. By using an open model, I could:

  1. Control the Output: I implemented strict JSON formatting to ensure the AI-generated missions didn't "hallucinate" and instead integrated perfectly with the React frontend.
  2. Contextual Flexibility: I could tune the temperature and prompts to ensure the "guide" persona felt encouraging and minimalist, not corporate. Open innovation allows us to build tools that encourage us to leave technology, without being beholden to the very ecosystems that try to keep us engaged for as long as possible. Open innovation was central to the "Touch Grass" philosophy of this project. Open innovation allows developers to build specialized, lightweight agents that can be fine-tuned or swapped as better models emerge, ensuring that tools designed to "liberate" users from screens aren't themselves built on proprietary "black boxes."

Prize Categories

  • Google Gemma — Used Gemma 4 26B as the open-weight AI reasoning layer for recommendations and personalized outdoor missions.
  • SerpApi — Used SerpApi to discover real nearby outdoor places and events instead of relying on static or manually entered data.
  • ElevenLabs — Used ElevenLabs to generate the voiceover narration for the OutThere demo video.

Top comments (0)