Designing a mobile maps app is one of the most multidisciplinary mobile interview questions. You touch graphics rendering, routing algorithms, location services, large-scale tile storage, and the brutal data costs of streaming map data over cellular.
Functional requirements
- Display a map at any zoom level, pan smoothly — the bar is 60fps panning even while tiles stream in over cellular, so interviewers probe how you avoid blank frames: pre-cache a ring of neighbor tiles and draw a low-zoom fallback until the sharp tile arrives.
- Search for places (geocoding) — clarify whether search runs server-side against a place index or has to work offline, and be ready to say how you rank results by distance, popularity, and query prefix for autocomplete.
- Compute routes from A to B (driving, walking, transit) — each mode needs its own cost function, and transit is the hard one because it adds schedules, transfers, and time-of-day, which is where interviewers push for detail.
- Provide turn-by-turn navigation — this is the real-time loop that ties everything together: snap location to the route, count down to the next maneuver, and re-route when the driver deviates.
- Work offline for downloaded regions — state up front what degrades without a network (no live traffic, lower-quality routing) so the scope stays realistic instead of promising full parity offline.
- Show traffic, places of interest, and user location — keep these as separate overlays on top of the base map rather than baking them into tiles, so each can refresh at its own rate.
Architecture
Three core layers: tile rendering, routing, navigation.
Vector vs raster tiles
Modern maps use vector tiles. Reasons:
- Smaller (10x compared to PNG raster)
- Stylable client-side — same tile renders differently for day/night/satellite mode
- Smoother zoom — vector data scales without re-fetching
- Selectable features — tap a road to identify it
Tile format: Mapbox Vector Tile (MVT) is the de facto standard. Tiles are organized in a tile pyramid (zoom levels 0–22) with each zoom doubling resolution.
Tile streaming and caching
Client requests visible tiles + a small ring of pre-cached neighbors. Tiles are cached on disk (~500MB) with LRU eviction. Frequently visited home/work tiles are kept indefinitely.
Routing
Server-side. Pre-computed contraction hierarchies or customizable contraction hierarchies (CCH) for fast queries. Mobile sends “from A to B” and gets back a polyline + turn instructions in 100–500ms.
For offline routing, simplified pre-computed graphs are bundled with downloaded regions. Quality is lower, but it works without network.
Turn-by-turn navigation
- Periodically (every 1s) match GPS location to the nearest road segment (map matching) — the naive nearest-segment snap breaks at parallel roads and overpasses, so strong answers reach for a hidden Markov model that weighs recent history, not just the closest line.
- Compute distance to next instruction — measure along the route polyline, not straight-line, or the countdown will be wrong on curves and highway ramps.
- Speak the instruction at predetermined distances (e.g., 500m, 100m, 0m) — scale the trigger distances to speed, since a highway maneuver needs an earlier warning than a city turn.
- Re-route automatically if user goes off-route (detected when GPS strays 50m+ from polyline) — debounce the trigger so a single bad GPS fix in an urban canyon doesn’t cause a spurious recalculation.
Offline regions
User selects a region. Client downloads all tiles for that region across multiple zoom levels (typically 4–22) plus the routing graph subset. Sizes range from 50MB (small city) to 10GB+ (entire country at high zoom).
Traffic
Server-side aggregation of GPS pings from millions of devices. Speeds are computed per road segment in 5-minute windows. Rendered on the map as colored overlays.
Battery
- Reduce GPS sample rate when not navigating — a static map only needs occasional coarse fixes; full 1Hz sampling is worth the drain only during active turn-by-turn.
- Throttle tile rendering to 30fps when idle — a map that isn’t moving doesn’t need 60fps, and you can pause redraws entirely until the user pans or zooms.
- Disable traffic refresh in background — polling traffic for a map nobody is looking at burns battery and data, so suspend it and resume on foreground.
Frequently Asked Questions
Why does the map sometimes show a lag before tiles render?
Tiles are fetched on demand. If the user pans into uncached area on slow network, the lag is visible. Mitigation: prefetch ring + low-zoom fallback tile rendered immediately while higher-zoom is fetched.
How accurate is GPS in cities?
Urban canyons cause multipath errors of 10–30 meters. Map matching corrects most of this by snapping to the most plausible road segment.
What is the difference between Google Maps and Apple Maps engineering-wise?
Both use vector tiles, but Apple Maps has tighter integration with iOS frameworks (CoreLocation, MapKit) and Google Maps has broader cross-platform consistency.
Keep sharpening your system design:
