Inspiration
We're FIU students, and FIU is a commuter school. Most of us drive in every day: the Palmetto at 5 pm, I-95, the Dolphin, US-1. In the fall, king tides flood NE 151st Street by the Biscayne Bay campus, and streets in Brickell and Miami Beach. There's a new closure or construction zone every week, and an afternoon storm can flood a street in twenty minutes.
Google Maps knows traffic. It doesn't know that your street floods at high tide, that the City just closed a lane for a utility permit, or that a crash on the local news is on your way home. We wanted one place that knows all of that, and that tells you before you leave, not when you're already stuck.
What it does
MAPAY is an iPhone app (with a web version) for people who make the same trips every day.
- One colour-coded map of what's wrong with Miami's streets. Nine hazard types, each with its own colour, icon and line style: flooded streets, heavy rain, construction, closures, congestion, missing sidewalks, potholes, incidents from the news, and events. Tap anything to see what it is, where the information came from, when it was last checked, and how confident we are.
- Hazard-aware routes. Pick a destination and leave now or at a set time. MAPAY gets alternative routes from Google, scores each one against the hazards on it at that time and your preferences (avoid / prefer to avoid / don't care per hazard type, plus neighbourhoods you'd rather skip), and explains why it recommends one.
- A heads-up before every trip. Save your routine once (FIU MMC → BBC at 9:30, back between 5 and 7 pm). Thirty minutes before each trip, a Duolingo-style Live Activity appears on your Lock Screen and in the Dynamic Island: a countdown, the route and the biggest hazard on it, coloured by hazard type. Plus a notification and a Home Screen widget. Start opens Google Maps; Customize changes the route.
- Change the route in plain English. "Stop at a Starbucks and stay off the Palmetto." Gemini turns the sentence into constraints; our router builds the new route and explains the difference.
- Google Maps drives, MAPAY steers. When Google's route would cross a flood or closure Google doesn't know about, MAPAY adds a visible steering stop so the route bends around it, and you keep Google's live traffic, voice, lane guidance and CarPlay.
- Demo and Live modes: real Miami data, or a complete offline scenario across Miami-Dade.
How we built it
- iPhone app: React + TypeScript + Ionic (iOS mode) in Capacitor 8, plus native Swift: a WidgetKit widget and an ActivityKit Live Activity, bridged to the app by a small native plugin. Installed on a real iPhone with AltStore and a free Apple ID.
- Map: Google Maps JavaScript API with a light/dark cloud-styled Map ID, Places API (New) for search, and our own renderer for the nine hazard layers.
- Backend: FastAPI on Google Cloud Run, MongoDB Atlas, Shapely for geometry, Cloud Scheduler for ingestion, GitHub Actions for CI/CD (including building the iPhone app on GitHub's macOS runners).
- Routing: Google Routes API alternatives plus our own deterministic scoring. For each route we add up a penalty over the hazards within ~30 m of it:
$$\text{cost} = \text{predicted minutes} + \sum_{h \in \text{route}} w_{\text{pref}(h)} \cdot \text{severity}_h \cdot p_h \cdot 3\ \text{min}$$
For severe hazards we add "via" waypoints and ask Google again. AI never picks the road.
- How sure we are: every hazard is a Bayesian belief in log-odds. A source registers it with a prior (a FEMA flood zone during a king tide, a City permit, a HERE incident); news, user reports and other sources add or remove evidence over time. The router only avoids hazards above ~73% probability; the map shows the rest faded or "unconfirmed".
- Data: NOAA tide predictions + FEMA flood zones + curated hotspots (flood prediction), National Weather Service alerts, HERE Traffic (incidents, closures, flow), City of Miami Public Works permits, Miami-Dade 311, OpenStreetMap (sidewalks), Google Routes predictions (typical congestion), Copernicus Sentinel-1 flood maps when a pass covers Miami, and local news (NBC6, WLRN, Local10, Miami Herald, CBS News Miami, GDELT).
- AI: Gemini on Vertex AI reads news into structured events, turns prompts into route constraints and writes the route explanations. Laya, an open-source decision model we fine-tuned on Miami news, is a fast first pass that sets aside stories that aren't about the streets.
Challenges we ran into
- Google's terms shaped the product. We wanted an in-app turn-by-turn "route player", but live turn-by-turn on the Routes API isn't allowed (it needs Google's Navigation SDK). We built an animated in-app preview instead; on the iPhone it broke the Route button just before judging, so we cut it and hand off to Google Maps for the drive.
- Street View and imagery. We wanted to show and analyse Street View inside the app to confirm floods and construction. Google's terms don't allow analysing its imagery, so image analysis moved to Copernicus Sentinel satellites, which pass every few days, miss water between buildings and can't see through clouds. Satellite evidence confirms hazards; it doesn't find all of them.
- Other map apps. Only Google Maps keeps multiple waypoints from a link; Apple Maps and Waze only take start and end. Waze has no public data API, and Google's terms don't allow Google routes on a non-Google map.
- Rate limits and free tiers everywhere. Our Gemini key ran out of credit (we moved to Vertex AI). MongoDB's free tier throttled us to 7-second queries after our map re-read 30,000 hazards on every ingestion job (we rewrote it to check a tiny change marker). Cloud Run killed the server at 512 MiB. Vercel hit its deploy limit (we moved to GitHub Pages). The public OpenStreetMap server was so slow our demo data took an hour to generate.
- Messy data. No public API for Florida's FL511, so closures come from HERE. City permits included 14,000+ planned projects that would have painted every street orange. OpenStreetMap rarely tags sidewalks, and missing isn't "no sidewalk". The 311 data is historic. News has to be placed on the map from text like "near the Palmetto at Bird Road".
- A free Apple ID. No push notifications (the phone schedules its own heads-ups), no App Groups (the widget can't read the app's settings), one app extension for both the widget and the Live Activity, and one dismissed iOS prompt silently turned Live Activities off.
The result is relatively accurate rather than perfect, and the app says so: every hazard shows its source, when it was checked, and how confident we are.
Accomplishments that we're proud of
- A real iPhone experience, not a mock-up. MAPAY runs on an actual iPhone with a Lock Screen Live Activity and Dynamic Island countdown, a Home Screen widget, and notifications with Start / Customize actions, all tinted by the hazard that matters most on your route. We got there with a free Apple ID and AltStore, working around no push notifications, no App Groups and a single app extension.
- ~30,000 real hazards from more than ten public sources. NOAA tides, FEMA flood zones, National Weather Service alerts, HERE traffic, City of Miami permits, Miami-Dade 311, OpenStreetMap, Copernicus satellite flood maps and local news all feed one model. Instead of a pile of pins, every hazard is a Bayesian belief with a confidence that rises with evidence and fades with time, and the router only avoids what it's reasonably sure about.
- Plain English in, an explainable route out. "Stop at a Starbucks and stay off the Palmetto" becomes structured constraints through Gemini, but a deterministic router picks the road and explains why, so the same request always gives the same answer.
- Routes that know what time you're leaving. Leave now or at a set time: traffic predictions, tide-driven flood risk and even the best departure inside a time window are calculated for that moment.
- Making it fast. We took route requests from minutes to seconds, shrank the map data from 17.7 MB to under 1 MB, and cut map loads from ~6 s to under a second with an in-memory snapshot and a local cache on the phone.
- It works for judges anywhere. A web version with a desktop layout, a complete offline Demo mode across Miami-Dade, a first-run intro that explains the app, and an automatic iPhone build on every merge.
- Two people, one weekend. We planned the whole product up front, split it into dozens of small tasks with clear API contracts, and shipped a native iPhone app, a web app and a data backend in parallel.
What we learned
- Terms of service are product requirements. Google's terms decided our map provider (no mixing Google routes with other maps), our navigation hand-off (live turn-by-turn needs the Navigation SDK) and our imagery source (no analysing Street View, so we used Copernicus satellites).
- Free tiers fail in surprising ways. A database that throttles to 7-second queries, a server killed at 512 MiB, a deploy limit on the web host, a slow public map server. Cache aggressively, read only what changed, and measure in production, not just locally.
- Honesty builds trust. Labelling hazards "predicted", "unconfirmed" and "last checked 10 min ago", with the source one tap away, makes the map more believable, not less. The data is relatively accurate, not perfect, and saying so is part of the product.
- Let AI interpret; keep decisions deterministic. Gemini is great at turning messy news and casual requests into structured data. Choosing a safe route has to be predictable and explainable.
- Real devices find real bugs. Several of our worst bugs (a doubled safe-area inset, a silently blocked Live Activity, a broken Route button) only showed up on the iPhone, never in the browser or the simulator.
- Messy public data needs a model, not a filter. 14,000 planned City projects would have painted every street orange; a confidence model plus sensible zoom rules made the same data useful.
What's next for Mapay
- Smarter models. Put our fine-tuned Laya model into the live news pipeline, keep training it on more labelled Miami stories, and tune the confidence model with real outcomes: which predicted floods actually happened, which closures were really there. Every confirmed or cleared report makes the next prediction better.
- Deeper data, neighbourhood by neighbourhood. Gather as much as we can for every Miami-Dade neighbourhood: more city and county open data, drainage and elevation data, historic flood and crash records, school zones, and more local news sources, so each area has its own picture of what usually goes wrong and when.
- Website and phone, connected. Sign in once (or scan a QR code from the phone) and manage your routines, places and preferences from the website, with every change synced to your iPhone's heads-ups and widget.
- Walkable routes. Show which streets are safe and comfortable to walk (sidewalks, flooding, crossings, shade) and plan walking routes that avoid missing sidewalks and flooded blocks, for the walk from the parking garage to class or from the bus stop home.
- Your class schedule as your routine. Import your FIU schedule or calendar and let MAPAY build the routines for you, including which campus you're going to each day.
- Parking and transit. Campus garage availability at FIU, and Metrorail, Metromover, bus and Brightline options when driving is the worse choice.
- Hurricane and storm mode. Evacuation routes, flooded-road warnings and shelter locations when a storm is coming, when Miami needs it most.
- Learning from the community. Crowd reports that confirm or clear hazards in real time, carpool sharing of your heads-up with the people you ride with, and a daily "chronic spots" memory of the streets that keep flooding or jamming.
- In-app turn-by-turn navigation with Google's Navigation SDK, plus CarPlay and an Apple Watch countdown.
- A paid Apple Developer account: push notifications so heads-ups stay fresh without opening the app, push-started Live Activities, App Groups so the widget follows your settings, and TestFlight for real users.
- "Arrive by" routines: tell MAPAY when you need to be at class, and it works out when to leave.
- Beyond Miami. First the rest of South Florida (Broward, Palm Beach, the Keys), then other flood- and traffic-prone cities across Florida and the US: Tampa, Houston, New Orleans, Charleston, New York. The same pipeline plugs into each city's open data, local news and weather.
- Data for the city. An anonymised dashboard of chronic flooding, closures and missing sidewalks that Miami-Dade and the City of Miami could use to plan repairs.
Built With
- activitykit
- capacitor
- copernicus
- fastapi
- gemini
- google-cloud-run
- google-cloud-scheduler
- google-maps
- google-places
- google-routes-api
- here
- ionic
- laya
- mongodb
- national-weather-service
- noaa
- openstreetmap
- python
- react
- swift
- swiftui
- typescript
- vertex-ai
- widgetkit
Log in or sign up for Devpost to join the conversation.