Serpentine 3D
A fast-paced 3D cyberpunk snake experience. Slither across a glowing neon grid, consume energy orbs, avoid boundary walls, and chain milestone achievements with smooth keyboard and mobile joystick controls.
- Three difficulty modes: Easy (Wrap Mode), Medium (Walls On), Hard (No Mercy)
- Dynamic camera tracking with smooth lerp damping
- Milestone audio alerts, particle explosions, and local high score tracking
- Fixed-timestep accumulator for uniform turning speed on any monitor
Balloon Blaster
An addictive retro vertical shooter. Pop colourful balloons as they drift down the screen, trigger screen-clearing bombs, pick up laser beams and multi-shots, and build high combo multipliers before balloons breach the defense line.
- 8 power-ups, including Laser, Tri-Shot, Bomb, Freeze and Shield
- Spawn rate that adapts to how many balloons you are popping
- Retro synth Web Audio sound effects and particle bursts
- Frame-rate independent physics ensuring fair speeds on 120Hz/144Hz screens
About the arcade
Two small games, and what their code can teach you
The arcade has two games: Serpentine, a 3D snake game drawn with WebGL, and Balloon Blaster, a 2D shooter drawn on an HTML canvas. They are fun to play, but they were also built to be read. Each game's page has a guide below the game that explains the rules exactly and then walks through the code that makes it work.
What you can learn from each gameProgramming ideas you will meet again in hardware
| Idea | Where to see it | Where it comes back |
|---|---|---|
| A fixed time step: the logic runs exactly 60 times a second, whatever the screen does | Both games | Control loops run from a timer interrupt on a microcontroller |
| Circle collision using squared distances | Balloon Blaster | Any real-time code that must avoid slow maths |
| Weighted random choice | Balloon Blaster's power-ups | Test generators that favour rare cases |
| Follow-the-leader movement and swept collision | Serpentine | Simulations and robotics path planning |
| Game states: menu, playing, paused, game over | Both games | State machines in hardware and firmware |
Playing on a phone or tabletTouch controls for each game
- Balloon Blaster: hold the left or right half of the screen to move, and tap to shoot.
- Serpentine: use the on-screen joystick, or switch to swipe mode and steer with your finger. The control button in the corner changes mode.
Both games are designed to fill the screen, so turn off rotation lock and try both orientations to see which you prefer. To read a game's guide, use the How to play link in its top bar.
Your scoresSaved on your device
High scores and settings are saved in your browser's local storage, so they are kept between visits on the same device and browser. They are not shared with other devices, and clearing your browser's data for this site resets them.
Reading the sourceHow to look inside a browser game
Each game is a single HTML page with its JavaScript inside it. Open a game, then use your browser's
View page source (Ctrl + U in most desktop browsers) to read it. Search for
requestAnimationFrame to find the game loop, and follow it from there. The guides under each
game quote the key lines and explain them.