DYSTOPIA
Loading DYSTOPIA...
Connecting to dystopia-noir.netlify.app
About DYSTOPIA
A rain-soaked noir cyber-city, fully procedural and 4 km across: drive and fly the SABLE spinner, launch the KITE drone to scan the street life, and walk into lit interiors.
You patrol in SABLE, a flying spinner with a full first- or third-person cockpit: drive it, fly it, park it at the curb. Then launch KITE, your drone, for close-ups and exploration. The drone scanner identifies nearly everything - sky cars (plate, pilot, passengers), robots (operator, task, firmware), buildings (floors, tenants), shops, traffic signals, trains, trees.
Eight districts with their own street life: Downtown, The Spires, Kabuki Neon Market, The Stacks, the Interchange, Southern Freight, Canal Ward and Black Harbour. Fly KITE up to a lit window and the painted interior becomes a live 3D room with a floor plan that fits the building; you can fly straight in through the door of Kowalski's bar or The Carlyle hotel lobby.
The city simulates around you: sky traffic flies in lanes, buses pull into SKY-STOP platforms, taxis drop at lit entrances, MPD cruisers pull cars over; on the ground, androids and a robotic road fleet obey signals, refuse trucks lift kerbside bins, heavy crawlers move with escort drones, freight trains run working level crossings, and a port with working cranes.
Two looks: a cinematic grade, and a graphic-novel noir mode (paper whites, rare color). The creator calls it a work in progress: the plan is to finish explorable interiors and then finalize the game side.
How DYSTOPIA was made with AI
The launch post credits Claude (Opus 5.5) and lists the stack: three.js r186 with the WebGPURenderer and TSL node shaders, Rapier physics, Vite and TypeScript. The 4 km city is fully procedural - every block is a pure function of (i, j, seed), built in Web Workers and streamed in tiers (massing, detail, physics, wet). The creator says ~630 render pipelines are compiled up front, so nothing hitches after boot.
Made by cryptomanavan (@cryptomanavan).
How to play
Best on desktop Chrome or Edge with a dedicated GPU - WebGPU is required. Everything preloads up front so nothing hitches in game, so give it a minute to boot.
| SABLE | Drive it, fly it, park it at the curb (per the launch post) |
|---|---|
| KITE drone | Launch for close-ups; the scanner identifies vehicles, robots and buildings |
Quick facts
- three.js r186 WebGPURenderer + TSL node shaders, Rapier physics
- 4 km procedural city, 8 named districts
- ~630 render pipelines compiled before boot
- Graphic-novel noir mode alongside the cinematic grade
- Drone scanner names plates, pilots, tenants and firmware
- Self-declared WIP
Questions about DYSTOPIA
What is DYSTOPIA?
A rain-soaked noir cyber-city you can drive, fly and explore in the browser on WebGPU: fully procedural, 4 km across, eight districts, built with Claude Opus 5.5 on three.js r186, Rapier physics, Vite and TypeScript.
What vehicles are there?
SABLE, a flying spinner with a full first- or third-person cockpit - drive it, fly it, park it. Plus KITE, a drone you launch for close-ups; its scanner identifies sky cars (plate, pilot, passengers), robots (operator, task, firmware) and buildings (floors, tenants).
What are the requirements?
Best on desktop Chrome or Edge with a dedicated GPU - WebGPU is required. Everything preloads up front, so give it a minute to boot.
Is it finished?
The creator calls it a work in progress: the plan is to finish explorable interiors and then finalize the game side.
Tips for DYSTOPIA
- Fly KITE up to a lit window: the painted interior becomes a live 3D room with a floor plan that fits the building.
- Try the graphic-novel noir mode (paper whites, rare color) if the cinematic grade feels too dark.
Sources: x.com, dystopia-noir.netlify.app. Last checked .
