HOME / PROJECTS / PIXEL GAME
▸ PROJECT 02

PIXEL
SHOOTER

A browser-based retro space shooter built with pure JavaScript and Canvas API. Features pixel-art sprites drawn entirely in code, multiple enemy types, collectibles, sound effects, and 3 escalating levels — no libraries, no dependencies.

STATUSPLAYABLE NOW
TYPEBrowser Game
YEAR2025
ENGINEVanilla Canvas
JavaScript Canvas API Web Audio API Game Dev Pixel Art No Libraries
🚀
READY TO PLAY?
3 levels of increasing difficulty. Destroy enemies, collect stars, survive.
Works in any modern browser, no install needed. Full mobile & tablet support with on-screen touch controls.
▸ PLAY NOW HOW TO PLAY
▸ OVERVIEW

ABOUT THE GAME

Pixel Shooter is a fully playable space shooter game built from scratch using pure JavaScript and the HTML5 Canvas API. There are zero external libraries or game engines involved every sprite, animation, particle effect, and sound is generated programmatically in code.

The game features 3 enemy types with increasing health, particle explosions, a procedural sound engine built on the Web Audio API, collectible stars for bonus points, and 3 escalating levels that ramp up enemy speed and aggression as you progress.

It was built to demonstrate the capabilities of the browser as a game platform no Unity, no Phaser, no canvas libraries. Just a game loop, a 2D context, and JavaScript.

▸ HOW TO PLAY

CONTROLS

← → / A DMove your ship left and right AUTOShip fires automatically, no button needed ★ STARSCollect for +50 bonus points 📱 TOUCHOn-screen buttons for mobile & tablet

Destroy all enemies on screen to advance to the next level. Don't let enemies reach the bottom of the screen or it's game over. Watch out for enemy fire — you have 3 lives. Heavier enemies take multiple hits and are worth more points.

▸ FEATURES

WHAT'S IN THE GAME

👾
3 ENEMY TYPES
UFOs, fighters, and heavy cruisers each with unique pixel-art sprites, health pools, and point values drawn entirely with Canvas API calls.
💥
PARTICLE EFFECTS
Every explosion spawns a burst of coloured particles with physics velocity, gravity, and fade. The ship also fires automatically, no button needed.
🌟
COLLECTIBLE STARS
Stars drop from destroyed enemies and spawn randomly. Collect them for bonus points they rotate and glow as they fall.
🔊
PROCEDURAL AUDIO
All sound effects shooting, explosions, collecting, level-up are synthesised in real-time using the Web Audio API oscillators. No audio files.
📈
3 LEVELS
Each level increases enemy count, speed, and fire rate. Level 3 introduces all three enemy types and maximum aggression.
🏆
SCORE SYSTEM
Score and hi-score tracked across playthroughs. Enemy type determines points heavier enemies are worth more. Stars give bonus points.
▸ TECHNOLOGY

HOW IT'S BUILT

🟨
VANILLA JAVASCRIPT
The entire game — entity management, collision detection, game loop, state machine, input handling written in pure JS with no frameworks.
CORE
🎨
HTML5 CANVAS API
All rendering done via the 2D canvas context. Sprites are drawn programmatically each frame using fillRect, paths, and transforms no image files.
RENDERING
🔊
WEB AUDIO API
Oscillator-based sound synthesis for all in-game audio. Each sound type uses different waveforms, frequency sweeps, and gain envelopes.
AUDIO
⚙️
REQUESTANIMATIONFRAME
Smooth 60fps game loop using the browser's native animation timing. Delta-time aware for consistent physics across different frame rates.
ENGINE
▸ LINKS

PLAY & EXPLORE

The game is playable directly in your browser. GitHub repository coming soon.

▸ PLAY THE GAME ⌀ GITHUB — COMING SOON
BACK TO
ALL PROJECTS
▸