A distributed system made legible on one screen.
Agent-per-railway + orchestrator
Five railway agents — Union Pacific, BNSF, CSX, Norfolk Southern, Kansas City Southern — each managing its own network and load, coordinated by an orchestration layer that negotiates reroutes and holds a shared world-model state. The structure mirrors the fragmented reality: autonomy at the edges, coordination in the middle. That's what lets a genuinely distributed system read as one thing.
Spatial map & real-time exceptions
A mapbox-gl backdrop carries a hand-coded SVG rail-route overlay, and the map is the always-on surface where exceptions appear geographically, in real time. The demo scenario: a blizzard hits a Chicago segment, BNSF reroutes via an alternate corridor, intake is reduced, load shifts to the other railways, the map flashes the affected zone, and the system stabilizes. One click runs the whole agentic loop.
The workbench — draggable panels
Every panel is a Framer-Motion draggable, spring-settling widget — the closest a weekend build can get to a spatial "Lego" build-a-train interaction. The bet behind it: agentic UI is going to be deeply, per-operator customizable, and the operator should get to arrange their own cockpit rather than accept the one I picked for them.
Stack & the vision beyond the demo
Vite + React 19, Tailwind, Framer Motion, mapbox-gl, deployed on Netlify. All data is simulated — this is a concept prototype. The prototype is one step back from the real target: a dispatcher packing a live 3D model of the train, seeing exactly how containers fit cart by cart and catching the mismatches that currently force last-minute rework in the yard. RailX is the workbench that points at that future — built alongside engineering rather than waiting for it to catch up.