SpotAI

SpotAI shows you every free street spot, paid lot, and EV charger near where you're going. The AI picks the best one, and tells you if that street turns into a no-parking zone at 4pm.

Comment

The Inspiration

Google Maps tells you how to get somewhere. It does not tell you where to park when you arrive. You circle blocks, check signage, wonder if that side street has a time limit, and watch gas burn while you hunt for a spot. Studies show drivers spend an average of 17 hours per year searching for parking. In dense urban areas, this accounts for up to 30% of city traffic.

What It Does

SpotAI searches for parking near your destination - every free street spot, paid lot, and EV charger - then uses Gemini AI to recommend the single best option for your situation.

You type in an address (demo: Cafe Medina, Vancouver), and SpotAI queries multiple free APIs in parallel:

  • Overpass API — OpenStreetMap data for street parking
  • Vancouver Open Data — city parking meters and zones
  • Open Charge Map — EV charging stations
  • OSRM — walking distance and time to destination
  • Nominatim — geocoding to get coordinates

The results appear on an interactive Leaflet map with color-coded markers (sage for free, amber for paid). Each spot shows walk time, distance, pricing, and time limits.

Then Gemini Flash steps in. It receives the top results with context — current time, day of week, spot details — and recommends the best match. It also predicts availability ("likely available at this hour") and gives a short reason. Not a chatbot. Just a smart ranking that actually helps you decide.

How I Built It

Stack: Next.js 15, TypeScript, Tailwind, Shadcn UI, Framer Motion, Leaflet, Gemini Flash, Vercel.

I had roughly 8 hours. This meant cutting scope aggressively. No backend, everything runs client-side. No auth. No user accounts. Just search, see results, pick a spot.

The map uses Stadia dark tiles because they look clean and require no API key. Leaflet needed a dynamic import with ssr: false to work in Next.js — a small gotcha that ate an hour.

Gemini integration was the trickiest part. The prompt had to be precise: role, context, data format, output schema.

What I'd Do Different

The availability prediction is a guess based on time of day. Real-time occupancy data exists in some cities but not Vancouver. I used a simple heuristic: business hours = likely busy, evenings = likely available. It's not perfect, but it demonstrates the concept.

I had trouble fetching data for EV charging stations. If I had time, I would try to add visibility of the EV stations, availability, and DC vs AC.

I also wanted a mobile-friendly bottom sheet for results. Ran out of time. Works fine on desktop, acceptable on mobile.

Built With

Share this project:

Updates