Drawn to Chaos

Inspiration

We had several sources of inspiration for creating Drawn to Chaos! After creating a UC themed GeoGuessr game titled UniGuesser, we realized how important games are in bringing people together.

Ultimately, we wanted to recreate a similar experience, this time in a multiplayer setting that allows players to draw, guess, compete, and connect in real time from anywhere in the world.

We chose to implement computer vision due to our interest in related coursework and to put a fun new spin on an old game.

What it does

Drawn to Chaos is a fast-paced, competitive, free-for-all digital Pictionary-style game. Players use their computer webcams to follow their finger, allowing them to draw various prompts, all by using computer vision (Neat, right!?).

Each player receives a random prompt and must draw it within the allotted time. Once the timer ends, each player gets to guess on each other drawings. Act fast! You score more points for quickly and correctly guessing the drawings, with that drawings artist scoring some points as well each time other players guess their drawing correctly

But wait! There's more! In the future we intend to add Chaos Cards, powerups that players compete for during the drawing phase to get an edge on their competition.

Focus Stroke: Provides a letter hint during the guess phase
Creative Burst: Gives a 1.25x multiplier when guessing on a competitors piece
Artist's Pride: Gives a 2x multiplier when competitors guess your sketch correctly

How we built it

So hows does Drawn to Chaos bring together multiplayer capabilities, computer vision, and live sketching into a single fast-paced gaming experience? We're glad you asked!

Frontend: Built using React and TailwindCSS, our beauiful website delivers a unique and unforgetable experience
Backend: Powered by FastAPI, we seemlessly manage game states, points, and Chaos Cards while keeping all players in sync at the same time
Computer Vision: Utilizing Google's MediaPipe libraries, we track hand movements to render beautiful works of art accurately and responsively

Challenges we ran into

Our project was not without struggles. We've had to learn how to synchronize player interactions so drawing guesses,points, and Chaos Cards are all properly updated. Additionally, we had to learn how to properly utilize MediaPipe's hand track library to ensure brush strokes are smooth and lag-free. Most importantly, we've had to learn how to balance game mechanics, keeping the game fun and entertaining

Accomplishments that we're proud of

We're very proud that we've managed to create a prototype of our game within a 24-hour period. In just a short timeframe, we've managed to create a multiplayer experience that allows people to connect, laugh, and engage in a friendly competition.

Ultimately we're proud that we've developed a platform for people to make friends across the globe!

What we learned

During our hackathon, we learned a lot about integrating real-time multiplayer functionality, computer vision, and gameplay design into a single package.

Ultimately, this hackathon pushed us to iterate quickly, solve unexpected problems, and work together to bring our project to fruition