NEON SURGE — Twin-Stick Arena Shooter
Client: Ghostern · Industry: Game Development · Focus: Fast-Paced Action, 3D Visuals & Surge Mechanics
Week Build
Custom Code
Twist Mechanics
Immersive Visuals
A Fast-Paced, Browser-Based Twin-Stick Arena Shooter
NEON SURGE is a fast, brutal, single-player twin-stick arena shooter built entirely in HTML5, CSS3, and JavaScript. The game puts players in control of a neon vessel fighting endless waves of geometric enemies — triangles, squares, hexagons, and circles — each with unique behaviors and health pools.
Built in just 2 weeks, NEON SURGE features an auto-firing weapon system, dash mechanics with invincibility frames, a tiered Surge ultimate ability, dynamic twist mechanics, and a full boss encounter with phase-based difficulty scaling. The game was designed to be fully playable on both desktop and mobile, with custom virtual controls and touch support.
Project Snapshot
- 📅 Timeline: 2 weeks
- 🎯 Genre: Twin-stick arena shooter
- ⚡ Tech Stack: HTML5, CSS3, JavaScript, Three.js
- 📱 Platforms: Desktop, Tablet, Mobile
- ⭐ Key Feature: Surge ultimate ability with 5 tiers
- 🔗 Live Demo: Play NEON SURGE →
NEON SURGE in Action
Desktop and mobile views of the fast-paced twin-stick arena shooter.
💻 Desktop View — Full immersive experience
📱 Mobile View — Fully responsive on all devices
A Brutal, Easy-to-Pick-Up Arena Shooter
You aim — your ship fires on its own. It’s all about movement, timing, and building your surge meter.
Auto-Fire & Aim
Your ship fires automatically. You focus on movement and aim direction — making the game accessible yet deep. On mobile, auto-fire activates when using the joystick.
Dash with i-Frames
Press Space (or tap the Dash button on mobile) to dash through bullets with brief invincibility frames. A 1.2-second cooldown keeps it balanced.
Surge Ultimate Ability
Build your Surge meter by defeating enemies. Activate Surge (Q / right-click / Surge button) to unleash an electric storm that damages everything in a radius — up to 5 tiers of power.
Dynamic Twist Mechanics
Every 16-20 seconds, a random twist activates — INVERSION (WASD reversed), TIME WARP (enemies slowed), SWARM (3x spawn rate), CHAOS (erratic movement), BLACKOUT (vision reduced), or RECOIL (shots push you back).
4 Enemy Types & Boss
Defeat triangles, squares, hexagons, and circles — each with different health, speed, and point values. Survive until 5000 points to face THE CONDUCTOR, a 3-phase boss.
Mobile-First Design
Custom virtual joystick, dash button, and surge button make the game fully playable on phones. Touch aim on the left side, move with the right-side joystick — designed for thumb-friendly gaming.
Building a Browser-Based Shooter That Feels Like a Console Game
The goal was to build a browser-based twin-stick shooter that would feel as responsive and polished as a console game — with no downloads, no installations, and full mobile support. The challenge was to create:
- ◆ Lag-Free Performance: Smooth 60fps gameplay in a browser environment — even on mobile devices.
- ◆ Twin-Stick Controls: Intuitive mouse/keyboard controls on desktop and touch-friendly joystick controls on mobile.
- ◆ Dynamic Difficulty: Enemy waves that scale with time, a combo system that rewards skilled play, and a boss encounter that tests everything players have learned.
- ◆ Visual Polish: Neon aesthetics, particle effects, lightning strikes, and screen shake that make the game feel alive and responsive.
- ◆ Replayability: Random twist mechanics, power-ups, and a high-score system that keeps players coming back for more.
A Fully Custom, 100% Code Game Engine Built in 2 Weeks
Custom Game Engine
Every system — player movement, enemy AI, collision detection, particle effects, and lighting — was coded from scratch in vanilla JavaScript. No game engines, no frameworks, no shortcuts.
Twin-Stick Controls
Desktop players use WASD to move and the mouse to aim. Mobile players use a custom virtual joystick for movement and tap the left side of the screen to aim. Both feel intuitive and responsive.
Surge Tier System
The Surge ultimate ability builds over time and scales up to 5 tiers — each tier increasing the radius and damage of the electric storm. This gives players a powerful “panic button” and a reward for skilled play.
Dynamic Twist System
Every 16-20 seconds, a random game-changing twist activates — keeping players on their toes and ensuring no two runs feel the same. Each twist has a unique visual and audio cue.
3D Visual Effects
Built with Three.js for immersive 3D background scenes, particle systems for explosions and trails, and dynamic lightning strikes that add visual intensity to every encounter.
Procedural Audio System
A custom Web Audio API sound engine generates all game audio procedurally — no audio files needed. Every action — shooting, dashing, surging, twisting, and boss warnings — has a unique synthesized sound.
6 Game-Changing Twists That Keep You on Your Toes
Every run is different. Here’s what can happen when the twist activates.
INVERSION
WASD controls reversed
TIME WARP
Enemies slowed by 60%
SWARM
3x enemy spawn rate
CHAOS
Enemies move erratically
BLACKOUT
Vision radius reduced
RECOIL
Shots push you back
A Fully Functional, Polished Game Built in Just 2 Weeks
Complete Game Loop
From the menu screen to the game-over stats, every part of the player journey is polished and complete. The game feels like a finished product, not a prototype.
High Replayability
Random twists, tiered surge mechanics, and a persistent high-score system keep players coming back. Each run feels unique and challenging.
Cross-Platform Excellence
The game runs smoothly on desktop, tablet, and mobile — with custom controls for each platform. No compromises, no “mobile mode” cop-outs.
Built With Modern Web Technologies
100% custom code — no game engines, no frameworks, no shortcuts.
HTML5
Canvas & structure
CSS3
Neon UI & styling
JavaScript
Game engine & logic
Three.js
3D background & visuals
What We Learned Building a Browser-Based Game in 2 Weeks
Key insights from building a polished twin-stick shooter from scratch.
1. Vanilla JavaScript Is Powerful Enough for Complex Games
NEON SURGE proves that you don’t need Unity, Unreal, or even Phaser to build a polished game. With clean architecture, requestAnimationFrame, and the Canvas API, you can build responsive, performant games that run anywhere.
2. Mobile Support Must Be Built In — Not Bolted On
The custom virtual joystick, dash button, and surge button were designed from day one — not added as an afterthought. This resulted in a mobile experience that feels natural and responsive, not clunky or compromised.
3. Procedural Audio Adds Immersion Without Bloat
Using the Web Audio API to generate sound procedurally meant zero audio files, zero loading times, and a fully immersive experience. Every action has a unique, context-appropriate sound that makes the game feel alive.
See More Projects
How we help businesses build their digital presence.
Ready to Build a High-Performance Game or Web App?
Whether you need a browser-based game, a custom web application, or a full platform — we’re here to help. Get a free, no-obligation quote today.