Ingorgo! 🚌

A "bus jam" puzzle game for mobile browsers. Play it here.

Tap a bus and it leaves the parking lot following its arrow, if the road ahead is clear. Drag a bus and it slides one cell into a free space, like the tiles in a 15 puzzle: that's how you clear the way for the bus you need. Passengers wait in line and only get on the bus of their color. Buses that nobody can board wait in the stalls, and if the stalls fill up before the person at the front of the line finds a ride, you lose.

Ingorgo is Italian for traffic jam. I like this kind of game, but the free ones on the app stores are more ads than game: thirty seconds of puzzle, thirty seconds of video. So I made my own to play & chill, with no ads, ever. The part I cared about most was the levels: they should keep getting harder without ever becoming impossible.

---

Features

• Endless levels, generated on the fly and always solvable
• Same level everywhere: the level number is the random seed, so level 342 is identical on every phone, with nothing to download or save
• Six themed worlds (city, snow, beach, night, desert, autumn) that change every 10 levels
• Two moves: tap to leave, drag to slide one cell (or several, in one drag), in a crowded lot with fixed planters in the way
• Mechanics that show up as you go: parking lots with weird shapes, rotated 45°, garages that release the next hidden bus as soon as the space in front of them is free
• Helpers: undo, hint (highlights the next bus, with an arrow if it should slide), crane (lifts any bus, once per level), +1 stall, restart
• Runs in the browser and can be added to the home screen

---

How the levels are generated

This is the part I find most interesting. Every level is built backwards, the way you shuffle a 15 puzzle: start from an empty lot and apply reverse moves.

1. Reverse moves. A new bus appears where it would have a clear way out (forward: that bus leaves). A bus already on the lot slides one cell (forward: it slides back). The bus in front of a garage drives back in, and another move immediately fills those cells (forward: that move frees them and the garage releases the bus). Reverse the whole sequence and you get a winning solution.
2. A queue built from that solution. The passengers are generated by simulating the solution's exit order with only a few stalls in use, so the level is solvable by construction. Every level is replayed through the game engine as a safety check.
3. Making sliding matter. Fixed planters block exits, the final shuffle prefers the slides that leave the most buses stuck, and early levels are rejected if they can be won without sliding at all.
4. Calibrated difficulty. Offline, a best-first search that doesn't know the solution plays ten variants of each level; the number of positions it has to explore before winning is the difficulty measure. The variant closest to the target for that level is stored in a tiny table (one character per level), so the phone only generates that one variant, in a few milliseconds.

The difficulty curve rises quickly at first, with a sawtooth pattern on blocks of 10 levels: climb, a breather level, then a boss on the tenth. Past level 100 it goes into overdrive: more colors, fuller lots, and eventually only 3 stalls.

npm run check-levels generates a range of levels and replays each solution. scripts/calibrate.ts recalibrates the difficulty table and has to be run again whenever the generator changes.

---

Tech

• TypeScript + Vite, no framework
• Three.js for the 3D view, loaded from a CDN through an import map, so the game itself is about 25 kB gzipped
• Game logic (src/game/) is completely separate from rendering (src/render/): the engine is instant and pure, and the renderer turns each event into an animation timeline

src/game/
  types.ts        cells, buses, exit paths
  engine.ts       game rules: tap, slide, garages, boarding, win/lose, crane, extra stall
  generator.ts    level generator and difficulty curve
  calibration.ts  chosen variant for each calibrated level
  solver.ts       searches used for hints, level checks and calibration
  rng.ts          seeded random generator
src/render/
  view3d.ts       Three.js scene
  timeline.ts     turns game events into animations
  themes.ts       the six worlds
src/main.ts       UI, input, overlays
scripts/check-levels.ts   replays the solution of a range of levels
scripts/calibrate.ts      difficulty calibration (plus write-calibration.ts)

---

Run it locally

npm install
npm run dev               # dev server, reachable from your phone on the same Wi-Fi
npm run build             # production build in dist/
npm run check-levels -- 200   # generate and verify levels 1 to 200

URL parameters:

• ?level=42 opens a specific level (tapping the level number at the top does the same)
• ?debug=1 shows the level stats: difficulty, how full the lot is, how many buses start blocked

Every push to main is deployed to Vercel automatically.

---

Ideas for later

• Better pacing: a level should feel tense, not just long
• Sounds
• Offline play with a service worker