Omnilots

Login page
Before signing in
After signing in, with premium
Heatmap visualization
Profile
Leaderboard
Parking flow

Inspiration

Parking at John Abbott can decide how your entire morning starts. We built Omnilots because instead of being in class in time, we were wasting time circling lots, arriving stressed, and relying on luck instead of real data.

What it does

Omnilots helps John Abbott commuters make parking decisions with live, student-powered data before they lose time circling lots.

Key product behavior:

Shows a live parking map with a privacy-aware heat layer built from fresh community reports.
Lets users submit quick updates as parked, leaving, or observing, with a fullness score from 1 to 5.
Restricts report submissions to users near campus to protect data quality.
Enforces report integrity rules so users cannot spam contradictory states.
Sends push notifications when new parking updates are posted.
Supports points and leaderboard ranking to reward useful participation.
Installs as a mobile PWA for one-tap home-screen access without an app store.

How we built it

Omnilots is a mobile-first web app built with Next.js + React + TypeScript.

Core implementation details:

Google sign-in via Supabase Auth.
Live parking reports stored in Supabase Postgres.
Geofenced reporting using device location and Haversine distance checks to ensure users are near campus before posting.
Action-based updates (parked, leaving, observing) with enforced report rules and cooldown logic.
Fullness scoring (1 to 5) mapped to parking availability signals.
Real-time map experience with Mapbox GL and a privacy-aware heatmap model.
PWA support (manifest + service worker) so students can install to mobile home screens.
Push notification subscriptions and server-side fan-out for report updates.
Points + leaderboard mechanics backed by SQL triggers and profile tables.

Challenges we ran into

Data trust vs speed: We needed reports to be fast to submit but also hard to fake, so we added proximity checks, DB-side validation, and action-state rules.
Privacy vs usefulness: We wanted live hotspot visibility without exposing exact user-reported points, so we used gridding/aggregation techniques for heatmap rendering.
Mobile UX: Reporting flow had to be quick and safe on phones, so we iterated on bottom-sheet interactions, swipe gestures, and one-hand-friendly controls.
Reliability: Network hiccups caused occasional failed submissions, so we added retry/backoff logic for transient errors.

Accomplishments that we're proud of

Shipped a full end-to-end commuter product during a hackathon, from auth to database to geospatial map UX.
Built trust safeguards at multiple layers, including proximity checks, API validation, and SQL-level submission rules.
Implemented a privacy-focused heatmap approach so users get actionable hotspots without exposing exact report locations.
Added resilient report submission behavior with retry/backoff handling for transient failures.
Delivered real mobile usability features such as swipe interactions, quick-report flows, and installable PWA behavior.
Implemented push subscription storage and server-side notification fan-out.
Added gamification with profile points and a leaderboard to encourage consistent community reporting.

What we learned

Building trustworthy crowdsourced systems requires both client checks and database-level guardrails.
Geospatial math and time-decay modeling are key to useful live maps.
PWAs are a strong fit for student tools: instant install, app-like UX, and no app-store friction.
Small UX details on mobile (gesture thresholds, loading states, clear feedback) have outsized impact on adoption.