DEV Community

Cover image for Building Pune Pulse: a real-time 3D digital twin with an IDM/MOBIL traffic engine
BuildKaro
BuildKaro

Posted on

Building Pune Pulse: a real-time 3D digital twin with an IDM/MOBIL traffic engine

I wanted to see my city — Pune, India — alive in 3D. Not a game with a fictional
map, and not a navigation app tracking where I am. Just the real city, rendered
accurately, with traffic that actually behaves like traffic. So I built it,
solo, and shipped it free on Android as Pune Pulse.

Here's the architecture, and the parts I think are actually interesting.

Engines, not features

The codebase is split into independent modules with typed APIs — lighting,
weather, traffic, analytics, prediction, camera, and streaming are each their
own engine rather than tangled feature code. That separation is what let the
traffic simulation, the day/night cycle, and the what-if scenario tool all
get built and tested independently.

The traffic engine: IDM + MOBIL, in a Web Worker

The traffic isn't scripted paths or waypoint-following. Vehicles run on the
Intelligent Driver Model (IDM) for car-following and MOBIL for lane
changes — the same car-following math used in real traffic engineering
research, not something I invented for the demo. It's a pure-TypeScript
engine that runs in a Web Worker, so the simulation step never blocks the
render thread.

The payoff is the what-if tool: close any road in the city and watch traffic
actually reroute, because the underlying model is a real road graph with real
flow dynamics, not a fixed animation.

The city: OpenStreetMap, but only at build time

Pune Pulse renders 95,666 real buildings and the actual road geometry for
Pune, sourced from OpenStreetMap plus elevation data. Critically, OSM is a
load-time data source only — a build-time pipeline (city-pipeline)
converts OSM + elevation into a chunked, city-agnostic dataset ahead of time.
The running app never talks to OSM; it just renders native three.js meshes
from the pre-built dataset. That keeps it fast and means it works fully
offline once the data is loaded.

Rendering: React Three Fiber, shipped to Android via Capacitor

The renderer is React 19 + React Three Fiber on top of three.js, with
postprocessing for the visual layer — the day/night cycle, weather (rain,
haze, dynamic sun), a cinematic drone-style camera, and named real landmarks
(Shaniwar Wada, Dagdusheth Halwai Ganpati, Aga Khan Palace, University
Chowk). Pune Metro runs on its own movement independent of road traffic.

It's a web app at its core — Capacitor is what wraps it and ships it as a
native Android app, rather than maintaining a separate native codebase.

Zero API keys by design

The whole thing is simulation-first: it's fully functional with zero API
keys. Live data providers (TomTom for real traffic, OpenWeather for real
conditions) plug in behind provider interfaces via a thin Express proxy —
but they're optional. Nothing about the core experience depends on a live
key existing.

It also doesn't use GPS or track your location at all. This is a
visualization/simulation tool, not a navigation app.

What's next

I'd love feedback, especially from anyone who's worked on traffic
simulation, OSM-to-3D pipelines, or shipping React Three Fiber apps as
mobile apps via Capacitor. It's free on Google Play:
https://play.google.com/store/apps/details?id=com.punepulse.app

Top comments (0)