PicFlix

Inspiration

We knew we would not be able to build a game via game engine (Unity) due to time constraints and the steep learning curve. We still wanted to create something interested, so we decided to try and implement a multiplayer game that involved establishing and maintaining connections among multiple users. Having established this core capability, we decided to make some sort of guessing game in which a user displays something that relates to the word(s) that the participants must guess. For the specifics regarding the goal of the guessing, we decided to make the goal as guessing a tv show or movie based on a limited number of allowed images (ex. image of a "game" + image of a "throne" = "Game of Thrones")

What it does

• create/join a room to play a game
• chat with participants in the lobby
• display images/messages asynchronously to all participants in a room
• conditionally render the searchbar + results components if the user is the host (because the participants seeing what is being searched for defeats the purpose of the game)

How I built it

• Frontend: React + Bootstrap Styling
• Image API: Unsplash
• Backend: Node + Express
• SocketIO/SocketIO Client for establishing and managing socket connections

Challenges I ran into

• understanding socket
• due to unforseen circumstances, one of our teammates was unable to be a part of this most recent sprint, so that affected how much of the project goal we were able to accomplish.

Accomplishments that I'm proud of

• setting up the API
• getting the chat feature to work
• adding/removing images in realtime for all users

What I learned

• setting up connections between users
• simulating multiple users
• conditionally rendering components

What's next for PicFlix

• add the ability to make other users the host (currently the host role is fixed to the person who created the room)
• add ability to flag correct guesses and award points accordingly

Built With

• bootstrap
• express.js
• node.js
• react
• socket
• unsplash