Inspiration
Traditional strategy games rely on static maps and predictable mechanics. We wanted to see what would happen if the environment itself had a mind of its own. Inspired by the chaotic, unpredictable "AI Directors" in games like Left 4 Dead, combined with a nostalgic retro-futuristic Cyberpunk/Synthwave aesthetic, we created a game where AI actively analyzes the match and injects chaos to keep players on their toes.
What it does
Neon Nexus is a real-time, browser-based multiplayer strategy game. Players spawn Strikers, Tanks, and Rangers across three lanes to destroy the opponent's base.
However, the game features a "Chaos Director" powered by the Gemini AI model. Every 20 seconds, the AI Director consumes the live game state (player health, unit count, energy reserves) and makes a decision to intervene—whether that means giving energy buffs to a losing player, slowing the entire battlefield down, triggering a high-damage frenzy, or directly nuking the bases to break a stalemate. It accompanies these actions with dramatic, generative cyberpunk announcements to the players.
How we built it
The core architecture was built using AI coding tools.
- Backend: A Node.js server using Express and Socket.io to handle real-time physics, collisions, and unit synchronization.
- Frontend: Vanilla HTML5 Canvas for rendering the 30fps game loop and pure CSS for the interactive glassmorphism UI overlay.
- AI Integration: The AI Director is powered by the
@google/genaiSDK. It accepts anonymized string summaries of the battlefield and returns strict, structured JSON commands to execute modifiers directly on the server.
Challenges we ran into
One of the biggest challenges was ensuring that the real-time gameplay remained fast and responsive while waiting for the LLM to make decisions. We decoupled the game loop (which runs at a strict 30fps) from the AI Director loop, ensuring that network calls to the Gemini API were completely asynchronous and non-blocking. Additionally, ensuring the mobile touch controls properly registered clicks through the glowing UI screens onto the underlying Canvas required meticulous CSS pointer-events management.
Accomplishments that we're proud of
We successfully created a highly responsive, mobile-friendly multiplayer game using only vanilla web technologies. Integrating the AI not just as a conversational wrapper, but as a core game loop mechanic that actually understands the math of the battlefield and alters game physics on the fly feels like a major victory.
What we learned
We learned how to build robust real-time game loops over WebSockets and how to optimize HTML Canvas rendering. More importantly, we learned how to properly prompt a generative AI model to return strict, deterministic JSON data that safely acts as a "function call" to alter live backend server state.
What's next for Neon Nexus
We plan to add more unit types, customizable loadouts, and eventually allow the AI Director to actually spawn unique "Boss" units directly into the lanes when it detects a player is winning too easily!
Built With
- css
- express.js
- google-gemini
- html5
- javascript
- node.js
- socket.io
- vercel
Log in or sign up for Devpost to join the conversation.