About the Project SideQuests

Inspiration

SideQuests was inspired by a simple observation: most of our best memories come from small, unplanned moments, yet there’s no system that encourages them. We noticed that many location-based and social apps either focus purely on productivity or purely on entertainment, but very few bridge the gap between going outside, doing things with friends, and remembering those moments.

Games like Pokémon Go showed how powerful it can be to overlay game mechanics onto the real world, but we wanted to push that idea further, not just catching virtual objects, but creating real memories. SideQuests reframes everyday activities (getting food, going outdoors, attending events) as quests, turning real life into something you can progress through, level up in, and look back on.


What it does

SideQuests is a location-based social app that turns real-world activities into game-like quests.

Key features include:

  • Map-based quests generated from real locations
  • Daily and badge-based challenges (food, outdoors, creative, social, etc.)
  • Photo submissions tied to location to verify and capture each experience
  • Badges, XP, and ranks that reward exploration and consistency
  • Circles (friend groups) to complete quests together
  • Monthly Recaps that generate a collage of all completed activities and photos, acting as a shared photo diary

The goal is simple: go out, do things, and level up real life.


How we built it

Frontend

  • Vanilla JavaScript for application logic
  • Leaflet.js for interactive maps and custom map pins
  • HTML/CSS for UI, modals, drawers, and animations
  • Custom image-based map pins to visually represent different activity categories

Backend & Data

  • Supabase for:
    • Authentication (email/password)
    • PostgreSQL database (users, circles, quests, completions)
    • File storage for photo submissions
  • Row Level Security (RLS) policies to ensure:
    • Only circle members can see circle recaps
    • Users can only modify their own data
  • OpenStreetMap / Overpass API to dynamically discover real-world places and generate quests

Data Flow (Simplified)

Each quest completion follows a clean pipeline:

[ \text{User Action} \rightarrow \text{Location Match} \rightarrow \text{Photo Upload} \rightarrow \text{XP + Badge Award} \rightarrow \text{Stored for Monthly Recap} ]

Photo paths are stored in the database, while the actual images live in Supabase Storage and are resolved dynamically when generating recaps.


Challenges we ran into

  • Slow map loading due to multiple sequential Overpass API requests
    Solution: parallelized data fetching and progressive rendering.
  • Supabase auth edge cases (e.g., no session when email confirmation is enabled)
    Solution: guarded logic and profile upserts on first login.
  • RLS policy conflicts preventing circle creation and shared recaps
    Solution: redesigned policies around circle membership instead of ownership.
  • UI layering issues where the map overlapped modals and drawers
    Solution: z-index restructuring and clearer UI hierarchy.

Each issue forced us to think deeper about architecture rather than applying surface-level fixes.


Accomplishments that we're proud of

  • Turned real life into a playable system
    We successfully translated game mechanics, quests, XP, badges, and progression into real-world activities without losing authenticity. The result feels playful without being artificial.

  • Dynamic, location-aware quests
    Instead of hardcoding activities, SideQuest pulls real-world locations from OpenStreetMap to generate relevant quests dynamically. This makes the experience adaptable to any city.

  • Photo-based verification that doubles as memory capture
    Requiring photo submissions at the location both validates quest completion and creates a lasting visual record. This design choice turned SideQuest into a shared photo diary rather than just a checklist app.

  • Circle-based social gameplay
    We built friend groups (“Circles”) that unlock shared experiences, collective recaps, and group motivation shifting the app from solo play to social exploration.

  • Monthly Recaps as a core feature, not an afterthought
    The monthly collage recap reframes activity data into something emotional and meaningful. It gives users a reason to come back and reflect, not just progress.

  • Production-grade backend with real security
    Implementing proper authentication, storage handling, and Row Level Security policies taught us how to build features that actually scale beyond a demo.


What we learned

  • System design matters: sequencing UI initialization vs. data loading was critical (especially with maps and async APIs).
  • Row Level Security is powerful but unforgiving: incorrect RLS policies can silently break entire features.
  • UX consistency is everything: having two competing info surfaces (map popup + drawer) felt confusing and required architectural rethinking.
  • Performance tradeoffs: making too many sequential map data requests caused noticeable latency, which pushed us toward parallel fetching and smarter rendering.

We also learned how small details like animation timing, popup positioning, or image loading strategies dramatically impact how “alive” an app feels.


What's next for SideQuest

  • Richer progression systems

    • Badge tiers (Bronze → Silver → Gold)
    • Streaks for consistency
    • Bonus XP for longer or harder-to-reach quests
  • Time-based and live events
    Limited-time quests for festivals, pop-ups, or weekends that reward group participation and exploration bursts.

  • Group & Circle evolution

    • Circle-level XP and ranks
    • Shared goals (e.g., “Complete 10 food quests this month”)
    • Circle-specific recaps and milestones
  • Smarter quest generation
    Using context like distance traveled, past preferences, and activity diversity to suggest better, more personalized side quests.

  • Expanded recap experiences

    • Multi-month timelines
    • Highlight reels
    • “Year in SideQuest” summaries
  • Polish toward production

    • Performance optimizations
    • Improved offline handling
    • UX refinements for onboarding and discovery

Our next goal is to push SideQuest from a strong prototype into a product people want to keep installed, not because they have to, but because it reminds them to actually live.

Built With

Share this project:

Updates