Sit Spot

SitSpot isn't AllTrails or a streak game—it’s a quiet app for returning to one neighborhood patch of nature, with real-time wildfire smoke gating so connecting with the outdoors is always safe."

Comment

Inspiration

Most outdoor and wellness apps are built around novelty—hiking checklists, summit badges, tourist waterfall destinations, and social media streaks. But I realized that people don't feel disconnected from nature because national parks are far away; they feel disconnected because they never return to one hyper-local spot.

Living in Oregon and the Pacific Northwest, there is another critical reality: wildfire smoke season. In late summer, generic wellness advice telling people to "just get outside" is often medically unsafe. I was inspired to build SitSpot—a quiet, mindful web application that encourages people to commit to one neighborhood patch of nature (a tree cluster, backyard lawn, creek, or bench), while treating environmental health and air quality as a real, protective constraint rather than an afterthought.

What it does

SitSpot turns reconnecting with nature into a calm, sustainable daily practice:

  • Hyper-Local Patch Discovery: Instead of sending users on distant drives, SitSpot searches OpenStreetMap for walkable, overlooked green patches (small parks, woodlots, streams, and quiet benches) within a 10–15 minute walk.
  • Real-Time AQI Health Gating: Integrated with live Open-Meteo Air Quality tracking. If the US AQI is < 101 (Good or Moderate), outdoor sits are open. When wildfire smoke pushes AQI into unhealthy levels (101+), SitSpot automatically adapts to a safe, guided Window Sit, protecting vulnerable lungs.
  • Mindful Sit & Notice Log: Timed 10–20 minute sits with sensory notice logging and optional environmental audio recording with waveform analysis.
  • Ghost Photo & Place Portrait: Over repeated visits, users align new photos over translucent previous captures to watch real-time seasonal, growth, and weather transitions. It combines visit history, past AQI data, and nearby species biodiversity from iNaturalist into a living portrait of that single location.
  • Zero Accounts & Total Privacy: No logins, no trackers, no leaderboards. All notes, photos, and soundscapes are stored 100% locally on the device via localStorage.

How I built it

  • Frontend & Routing: Built with Next.js App Router (React 19) and TypeScript for a fast, responsive, accessible experience.
  • Styling: Styled with Tailwind CSS, utilizing a bespoke natural color system (earthy moss greens, warm ochre, and soft parchment paper tones).
  • Interactive Mapping: Powered by MapLibre GL JS with custom vector tile styling from OpenFreeMap, complete with custom marker layers, interactive pin-dropping, and standalone Web Worker tile decoding.
  • APIs & Data Ingestion:
    • Open-Meteo Air Quality API for real-time PM2.5 and US AQI readings without requiring external API keys.
    • OpenStreetMap Overpass API for querying nearby micro-nature elements (parks, trees, waterways, and benches) scored by walkable distance.
    • iNaturalist API for pulling nearby verified flora and fauna observations.
  • Audio & Visual Processing: Web Audio API with HTML5 Canvas for real-time soundscape waveform rendering and custom image alpha blending for ghost photo overlays.

Challenges I ran into

  • MapLibre Web Worker Bundling: Modern Next.js bundlers isolate dynamic module chunks differently. In MapLibre GL JS, vector tile parsing happens inside Web Workers. I solved this by serving dedicated worker chunks directly from the public static assets directory and configuring custom worker dispatching, ensuring zero-flicker vector tile rendering.
  • Handling Smoke & Network Resilience: Network availability and third-party APIs can fluctuate outdoors. I built deterministic fallback fixtures and geo-coordinate fallbacks so that even if location permissions or remote endpoints fail, the demo and core user experience remain completely functional.
  • Non-Diagnostic Health Communication: Finding the right tone for AQI warnings without sounding alarmist or diagnosing users—aligning copy with official Oregon Health Authority guidance for air safety.

Accomplishments that I'm proud of

  • Creating an anti-gamified, peaceful design that feels like a physical field notebook rather than a dopamine-driven social app.
  • Seamlessly bridging environmental health data (wildfire AQI) with mindful nature observation in a way that actively protects users.
  • Delivering a full-stack, feature-complete web app with zero dependencies on external databases or authenticated logins.

What I learned

  • How to deeply customize and optimize MapLibre GL vector styling and manage Web Workers in Next.js.
  • How micro-nature (neighborhood trees, stormwater creeks, small verges) provides measurable restoration benefits without needing full wilderness access.
  • How to structure resilient data pipelines that gracefully degrade between live APIs and sample fixtures.

What's next for Sit Spot

  • Audio Nature Sound Identification: Local acoustic machine learning to detect common bird songs during sitting sessions.
  • Seasonal Year-in-Review Timelapses: Automatically assembling ghost photo logs into a single seasonal timelapse video.
  • Offline PWA Support: Full progressive web app capabilities with offline background sync for sits in low-connectivity areas.

Built With

Share this project:

Updates

Submission history