Inspiration

Our inspiration to make this web app / game came from the simple dominance of battle royale games. The most popular games played today are of the battle royale genre and we wanted to expand the genre to cover a wider spectrum, such as educational games, to make them more appealing for kids who should not have to be bored or reluctant to learn because of some dull educational tool.

The Gist

In a nut shell, this application is a multiplayer game that one is able to play with as many people as they wish. The player(s) enter in their desired in game name and are taken to the main game page where their computer screen is filled with a variety of different features and aspects of the game. The game begins when one of the players decides to press the start button of course. The gameplay is parallel across every player in the sense that each player receives random and different sets of questions that are not codependent. The only shared state between the players of the same match / lobby is whether each player is 'alive' or not. The players must answer one of three questions of each question set that include easy, medium, and hard questions. If one gets a question right, they gain points and will see their point / progress bar increase. In addition, as common to all royale games, there is an ever enclosing 'circle' that is represented by another progress bar which increases over time and increases in speed over time as well. The goal of course is to keep one's points above the enclosing zone for as long as possible, or at least for a longer amount of time than the other players so that one is the only player 'alive'. When one's points / progress is lower than the current zone, the player will lose health points until they are 'dead' or until they are once again ahead of the zone. As mentioned before, the game continues until there is one player left. Some extra features include randomized power-ups and question streak bonuses.

Stack

This game was built using a stack consisting of Javascript, Node.js, Express.js wrapper, and Socket.IO. It is hosted on Heroku. We started with the basic idea of creating the game for a single player scenario where the user should be able to answer the questions infinitely or until they 'die'. This was on a local level as well. We then expanded to adding a seemingly infinite amount of players that can play against each other, however, that was also on a local level. Finally, we expanded to hosting the app on Heroku so players on different devices can play with each other.

Challenges

As with any web socket or Node application, the most prominent issue we ran into was the infamous async issue. We faced a variety of async issues in peculiar locations of our codebase and it was quite difficult to be able to identify these issues accordingly. We first tackled such issues by setting timeouts to block execution of code until some certain segments finished running, however we soon realized that this solution was not scalable and would vary in success on different devices and with different amount of requests. We then decided to utilize more bidirectional socket emit events such that the code segments we want to run after a certain code segment runs would only do so in that manner, emulating a callback function or rather a promise even. Other issues we ran into were mainly syntax issues and what not.

Accomplishments

We are very proud of our ability to expand our application throughout many stages. We came in thinking we would make a singleplayer game that only ran locally, and overtime as we crossed of checkmarks, we ended up with a full fledged multiplayer game that is hosted online. We are very proud of our overall team cooperation and divvying up of tasks. We were very organized and utilized our time efficiently in terms of code sprints and discussions, etc.

What We Learned

We learned a lot about handling asynchronous issues without using promises and async await functions. We also had team members who were new to coding in general and they learned a lot about front end web development, design, and even an extensive amount of git commands. We also learned a lot more about version control and how rebasing works and also the importance of different branches especially in larger group projects such as these. We also learned about hosting and a lot of similar online services and how they interact with our application.

Future Plans

We believe Math Jam has a lot of potential and the next steps would be fine tuning the game in terms of design and functionality and then of course adding more and more features as we see fit. We could even add more dynamic game modes and what not for a more enjoyable experience.

+ 8 more
Share this project:

Updates