Quick summary
Operation Blackout is a first-person night-ops shooter built in Three.js and art-directed like a film frame — one rain-soaked city street, sodium streetlights against neon, a full cinematic post stack, and waves of enemies pushing a checkpoint. Sprint, slide, aim down the optic, hold the line.
Who this template is for
Operation Blackout is a lighting exercise wearing a shooter. It is for people who want proof that a browser scene can be art-directed like a film frame, not just rendered.
- Studios and agencies who need a cinematic real-time moment in the portfolio — something that reads as a still from a AAA night mission
- Developers studying a full Three.js post stack — ambient occlusion, bloom, film grade and grain — wired into a playable loop rather than a tech demo
- Brands who want a moody, rain-soaked interactive scene that runs from a static folder with nothing to install
What problem this template solves
Most “browser game” offerings are either heavy engine exports or toy demos that fall apart the moment you look under the hood. This build is neither.
- Engine exports ship megabytes of runtime before the first frame ever draws
- Toy demos skip the hard parts — real collision, game states, difficulty curves and persistence
- Builders who want to learn from a finished game almost never get to see the instructions that produced it
What you get with this template
You get a complete night-ops firefight on one rain-soaked city street — a wave shooter wrapped in a cinematic grade, built module by module with no engine and no build step.
- A first-person loop with sprint, slide, aim-down-sights and reload — the full modern-shooter control model on WASD and mouse
- A city street lit like a film set: sodium streetlights against darkness, cyan and magenta neon, wet asphalt that carries every light as a streak
- Fifteen ES modules with strict ownership and one shared context, so every system — weapons, AI, rain, grade — is inspectable on its own
Page sections overview
| Section | Purpose |
|---|---|
| Cinematic Post Stack | Grade every frame with occlusion, bloom and a film-style colour pass |
| Rain-Soaked Street Set | Light one city block like a film set, with weather that sells the mood |
| Layered Weapon Viewmodel | Build the rifle the player stares at for the whole session out of real parts |
| Squad Wave Combat | Send readable enemy squads at a held checkpoint |
| Deterministic QA Harness | Make every visual claim reproducible with seeded scenes and parked cameras |
Design & branding system
The art direction is a night city held to film rules: darkness is allowed to be dark, and every light source earns its place in the frame.
- A warm–cool split carries the palette — sodium amber against blue night, with cyan and magenta neon as accents rather than the base
- The procedural sky stays overcast and low, so the street’s own lights do all the storytelling
- The interface holds to a thin tactical register — compass strip, ammo block, objective line — and leaves the centre of the screen to the fight
Mobile & speed optimization
The game targets desktop first — keyboard and mouse are the primary controls — while staying light enough to load instantly anywhere.
- No engine runtime and no asset downloads, so the whole game arrives in a handful of requests
- A capped frame delta keeps the simulation stable even when the browser tab stutters or loses focus
- The page stays lean: no frameworks, no trackers, nothing between the visitor and the game loop
How this template helps you convert
A playable game holds attention longer than any showreel. The page around it is structured to turn that attention into a next step.
- Visitors play immediately — no signup, download or install stands between them and the first round
- The finished build is fully inspectable, which turns curious players into builders who want the prompt behind it
- The one-time prompt unlock offers a concrete, low-friction next step while the session is still hot
Other information about this template
Operation Blackout is a rendering statement first and a game second. A few notes before you build on it.
- Keyboard and mouse are required — pointer lock drives the aim, so the build targets desktop rather than touch
- Everything ships as static files — ES modules and a CDN import map, no bundler, no server, no install
- The street, the grade and the weapon are separate modules, so any of the three can be swapped without touching the others
- Texture and HDRI assets are the heaviest part of the payload; swap them for lighter sets if first paint matters more than fidelity
How it works
Runs entirely in the browser from static files — fifteen ES modules on a CDN import map, no bundler, no install. The street, the lighting, the weapon and the grade are separate systems, and every screenshot on this page is reproducible from the build's own QA harness.
Screenshots
Captured from the live build — the title screen and real play, level by level.
