Inspiration
Mosses and lichens are living air-quality sensors, yet almost no one uses them. In Oregon and the Pacific Northwest they quietly reveal moisture stress, pollution, and canopy health. I wanted a tool that turns an everyday phone into a citizen-science instrument—fast, beautiful, and useful on a trail or in a classroom.
What it does
MossMap lets users photograph a moss or lichen. In seconds it returns: Species ID (common + scientific name) with confidence Nature Health score (0–100) plus moisture, pollution, and canopy breakdown Short ecological context and Oregon-relevant insights One-tap anonymous contribution to a live hyper-local Nature Health map Target users: hikers, students, educators, and park rangers. Benefits: rapid local biodiversity & air-quality awareness, open citizen-science data, and simple micro-actions anyone can take.
How we built it
Frontend: Next.js 15 (App Router), TypeScript, Tailwind CSS, Framer Motion, mobile-first UI Vision AI: Google Gemini 1.5 Flash with a carefully engineered PNW bryophyte/lichen system prompt; structured JSON output; realistic mock fallback when no API key is present Maps: React-Leaflet + dark Carto basemap, color-coded observation pins, time filters (24h / 7d / 30d) Data: Optional Supabase (storage + observations table + RLS); in-memory seeded Oregon observations for zero-config demos Deploy: Vercel
Challenges we ran into
Leaflet accessing window during Next.js prerender (fixed by isolating map code behind dynamic(..., { ssr: false }) and splitting non-map UI) Balancing real AI analysis with a reliable offline/mock path so demos never fail Designing a stress score that feels trustworthy yet remains an educational estimate, not a lab measurement Keeping the entire MVP polished and demoable in under 5 minutes
Accomplishments that we're proud of
Fully working end-to-end flow: capture → AI analysis → results → contribute → live map Production-quality mobile UI with accessibility and loading states Seeded Oregon data so the map looks alive on first open Clean architecture that runs with zero external keys for judging demos
What we learned
How powerful (and sensitive) mosses and lichens are as bioindicators Practical patterns for client-only libraries (Leaflet) inside the Next.js App Router The value of a strong system prompt and structured JSON for reliable vision outputs That the “wow” moment is the combination of instant insight + contribution, not just identification
What's next for mossmap
Real image upload to Supabase Storage True heatmap layer of aggregated health scores iNaturalist / GBIF cross-check and educator classroom mode Offline queue + PWA install Rare-species alerts and CSV export for researchers and land managers MossMap makes local ecosystem health visible—one photo at a time.
Log in or sign up for Devpost to join the conversation.