Table of Contents
Open Table of Contents
Introduction
During my recent trip to Japan, I needed something to keep me entertained during long travel days. I stumbled upon Archero 2, which had released just a few months earlier, and it instantly brought back memories of the original Archero—my go-to dopamine hit during high school.
That nostalgic rush sparked an idea: why not build my own version? For the past six months, I’ve been experimenting with Cursor AI whenever I had free time, and this seemed like the perfect project to dive deeper into AI-assisted development.
The Development Process
I’ve been exploring minimal JavaScript frameworks lately, so I decided to challenge Cursor to build a vanilla JS project using Three.js that could replicate Archero’s combat system. My initial prompt was simple: keep the graphics minimal and focus on the core mechanics.
Here’s how the first iteration looked:
The early version was functional but rough around the edges. After refining the movement system, we achieved much smoother character controls:
Through iterative prompting and refinement, the game now features polished animations and responsive gameplay. It’s worth noting that since this was entirely AI-generated, it lacks some of the artistic flair you’d get from hand-crafted assets—but that’s part of the experiment’s charm.
Tech Stack
- Frontend: TypeScript + Three.js + Vite
- 3D Graphics: Three.js with WebGL rendering
- Physics: Custom collision detection + Cannon.js integration
- Audio: Web Audio API for sound effects
- Development: Cursor AI for code generation + Vite dev server
- Deployment: Static hosting (Vercel/Netlify)
What’s Next
This project has been a fascinating exploration of AI-assisted game development. While the current version captures the core Archero experience, I’m excited about the next phase of development.
I’m planning to recreate the entire project using Claude Code to see how different AI coding assistants approach the same problem. This will be an interesting comparison between Cursor’s approach and Claude’s methodology for game development.
Beyond the technical rewrite, I want to add competitive elements by implementing a Redis-powered leaderboard system to track the fastest completion times. This will transform the single-player experience into something more engaging, where players can compete globally for speedrun records.
The real takeaway? Modern AI tools like Cursor can rapidly prototype complex interactive experiences, making game development more accessible than ever before. Now it’s time to see how far we can push these capabilities with even more sophisticated features.
How to play
If you’re interested in playing, please visit the following link for the deployment: https://js-hero.vercel.app/
For any feedback please send some via my email in the footer or the contact me section!