Rattle
From our UCI WebJam 2022 project description:
"One player will draw a series of lines and curves via mouse and space click, representing the lit bars in a fire rap battle! The "beatmap" will be replayed back to both players' screens, who will try to match the drawing via mouse tracking. The drawing player will now switch, and the game loop repeats, indicating a round change. After a series of rap battle rounds, the score will be calculated based on accuracy. So, the player that most accurately follows the rhythm is the winner!"
Rattle is a multiplayer rhythm-based game developed in React.js. The backend was built using Express.js and Socket.io, and the frontend was built with React, PixiJS/ReactPixi, and features pixel art created by the incredibly talented Casey Tran!
I personally developed the backend architecture and honed the gameplay state flow. I also jumped in on the frontend to implement the core drawing aspect of the game.
Honestly, the game didn't really work at all. But hey, we got 3rd place at UCI WebJam 2022!
I learned how ugly state synchronization issues are and I have a newfound respect for multiplayer games. It's a challenge I eventually want to tackle again someday.
Here's the backend repo:
I also want to feature Casey's amazing art!