YouCanReallyDance

Inspiration

The inspiration for this project came from my passion for dance, and the desire to blend it with technology. Dance is closely intertwined with music, which is fundamentally driven by beats. By breaking down these beats into mathematical representations, they could be translated into code. I wanted to recreate the joy and challenge of dancing to the beat through a digital environment.

What it does

YouCanReallyDance is a rhythm-based game that challenges players to memorize and perform dance sequences in sync with the music. The game generates a dance combo and demonstrates it for the player. After watching the demo, players have a set time to replicate the moves in rhythm with the beat. The game tracks performance in real-time, awarding points for accurate and well-timed moves. Each round consists of three demos, and at the end, the final score is displayed with an option to play again.

How we built it

The game is developed using ReactJS, structured around the typical React app framework. We use the useContext hook for global state management and core logic is handled within GameLogic.js. The useState and useEffect hooks are heavily utilized to manage game behavior. All animations of the dance moves were sourced from an open-source SVG repository: https://github.com/madeindjs/stickman.

Challenges we ran into

One of the most significant challenges was developing an algorithm that delivers real-time feedback. The game needs to detect whether a player performs the correct dance move at the right time, and provide instant feedback if the move is wrong or off-beat. This required precise input detection and processing.

Another challenge was handling and editing the music. To ensure the best experience, we needed tracks with consistent beats per minute (BPM) across multiple genres. Additionally, editing audio files to start and end on perfect beats, with millisecond accuracy, proved to be tricky.

Accomplishments that we're proud of

I'm glad that using SVG files for animation worked out!

What we learned

I gained experience in game design and front-end development, as well as practiced writing clean and effective codes.

What's next for YouCanReallyDance

I hope to include an advanced difficulty level where there are more dance moves and a more complex count system. I also hope to improve the overall design of different components of the game, such as upgrading the dancing avatar to have more intricate designs and accurate animations.

Built With

• react