Inspiration

Classic 16-bit RPGs like Pokémon and Zelda inspired Crystal Shards. We wanted to capture that nostalgic feeling of exploration, NPC dialogue, and dungeon combat — but entirely in the browser with no downloads or installs required.

What it does

Crystal Shards is a short, self-contained browser RPG. You play as Lia, a hero on a mission to recover three broken shards of the Crystal of Maki. You explore an overworld, enter a village, talk to NPCs who give you shards and lore, collect a shard from the ground, then fight your way through a dungeon full of shadow enemies. Defeat all four shadows and return the shards to the altar to win.

How we built it

The entire game is built with vanilla HTML5 Canvas and JavaScript — no frameworks, no game engines. We used the Canvas 2D API for all rendering, including pixel-art style characters, tilemaps, particle effects, and animated sprites. The Press Start 2P Google Font gives it an authentic retro feel. We added full touch D-pad controls for mobile responsiveness alongside keyboard support.

Challenges we ran into

Keeping the game loop smooth while managing multiple scenes, particle systems, enemy AI, collision detection, and dialogue state simultaneously was tricky in a single vanilla JS file. Designing intuitive player guidance — making sure a new player always knows what to do next — required careful iteration on the step bar and dialogue system.

Accomplishments that we're proud of

A complete game loop with a beginning, middle, and end in pure vanilla JS Smooth particle burst effects on shard collection and enemy hits Fully responsive layout that scales to any screen size with a functional touch D-pad for mobile A dialogue system with callbacks that chains story beats naturally

What we learned

We deepened our understanding of the HTML5 Canvas API, particularly around game loop architecture with requestAnimationFrame, stateful scene management, and writing performant pixel-rendering code without any external libraries.

What's next for Crystal Shards — A Browser RPG Adventure

More zones and a larger overworld to explore Additional enemy types with unique attack patterns An inventory and equipment system Save/load progress via localStorage Sound effects and chiptune background music A boss fight before the final altar sequence

Share this project:

Updates