Check out the demo! --> https://youtu.be/yYnXnv-TRx4
Draw First is inspired by having fun with friends with art! Gartic phone is a similar game we took inspiration from as well.
Draw First is a pictionary game where users can create/join a lobby of maximum of 8 people. Hosts of the game can choose a category for the game like animals, food, places, and objects. Users will be able to input a lobby code and user to join a game, if the user/code is already taken then it'll warn the user. When joining a game users will be able to see other users.
We built this project using node.js, react, html, css, websocket.
Some of the challenges we ran into were how web sockets are used and how to save user data using a database. We had difficultly finding documentation for websocket integration into our project that worked, but eventually were able to troubleshoot the issues and make websocket connections
Got the web sockets to work! Created a responsive canvas in React, and overall learned more about React including states.
Fredy: I learned node.js, react, and how API's work in js. Will: I gained a better understanding of React, about how websocket works, and how to integrate the protocol into a React project for a sustained connection between server and client(s).
The next steps for Draw First would be:
- Communication between users
- Upload wordlist of categories
- Scoring system
- Combine backend to frontend in order to create multiple lobbies