Dveře se zavírají - Smart City Game - AimtecHackathon 2026
🏆 First Place and Audience Award - AimtecHackathon 2026
Try the game
The game is live - play it right in your browser
Date
March 2026
Team Size
6 members
Technologies
Project Videos
Gallery
Overview
A browser-based smart city arcade powered by real-time public transit and live webcam data from Pilsen. Trams in the game follow the real Pilsen public transit schedule and cars on the screen mirror actual traffic captured from a public webcam.
The Problem
Our motivation was twofold: to promote Pilsen as a city open to creative use of its public data, and to show that data visualization doesn't have to live in serious-looking dashboards - it can be playful, original, and something citizens actually want to experience. Public-transit positions, traffic cameras and sensor feeds usually end up in tools that almost nobody opens. We wanted to flip that on its head and prove that the same data can be a memorable, fun smart-city moment instead of yet another dashboard.
Our Solution
We built a top-down browser arcade where the player controls a robot whose job is to herd waiting passengers into arriving trams - without leaving anyone on the tracks (an arriving tram will run them over) and without letting the platform overflow. Trams follow the real Pilsen public transit schedule from a live data feed, and cars on the road are triggered by a client-side tripwire detector running on a live HLS stream from a public webcam. The game is fully static, ships from a Docker/nginx container, and runs on mobile and desktop alike.
Key Features
- Real-time tram data: Live tram positions from a public-transit data feed - in-game tram arrivals match the actual Pilsen schedule
- Live webcam computer vision: A client-side tripwire detector samples the HLS webcam stream and triggers in-game cars when real cars cross the road
- Phaser 3 + Arcade Physics: Pixel-art top-down arcade with physics for the player, passengers, trams and cars
- Zone feed & ETA prediction: Vehicles are filtered by a polygon around the stop, then sorted by direction along the track; EMA-smoothed speed and azimuth feed an extrapolated arrival ETA
- Playback delay buffer: Raw SSE packets are held in a FIFO buffer for ~9 s so in-game events stay in sync with the live camera image
- Mobile-first: Virtual joystick, touch buttons, landscape orientation lock, fullscreen, iOS audio context resume
- Wave system & VFX: Escalating difficulty, day/night tint, dust/impact/comic-burst particle effects
- Stack: Phaser 3, JavaScript ES modules, Vite, TailwindCSS, hls.js, Leaflet (debug map), Docker + nginx for static deploy
The game is live at dveresezaviraji.cz.
During the same weekend the team also built a second game, Czech City Wars - a livestream where Czech cities compete based on what's currently visible on their public webcams. Ultralytics YOLO + SAHI counts people, dogs and bikes from 9 city webcams in real time, and two AI commentators (Gemini) narrate the match. Backend on FastAPI + WebSocket broadcast; static frontend.
My Role
I led the team, drove its technical direction and kept the whole project coordinated. On the build side I set up the Phaser foundation — the project skeleton, scene handling and the rendering layer that the rest of the game grew on top of. Plus the usual hackathon backdrop: six people, 40 hours, a lot of coffee, and a deadline arriving faster than expected.