Inspiration

Escape Rooms Our team was inspired to create a video game based on popular 'escape games', but with the added feature of breaking out of the amazing Hackathon, we participated in, CatHacks.

What it does

The game begins in an escape room, namely a classroom. The player must use clues to add to their inventory and move on to the next room. Along the way, the player earns points in retro arcade games to assist in their escape.

How we built it

We collaborated using GitHub and programmed in HTML, CSS, and JavaScript. We used open source code on GitHub linked below.

Challenges we ran into

Justin-For me a huge challenge for me was understanding the syntax and shortcuts in CSS and javascript that would help me execute the exact game I wanted. I had to constantly look up references for how to properly right CSS code and how to edit the screen the way that looked best.
Blake-Scaling divs and other elements in html so that they would align properly on displays with different resolutions was a big challenge for me. I went through hours of trial and error until I found an efficient and consistent way to do it.
Margaret- I think my biggest challenge was figuring out how to merge my code with my teammates’ code. Not only did I need a thorough understanding of how my programs worked, I also spent time asking my teammates how their code functioned in order to be effective and helpful in integration. This challenge was even more difficult as I was learning the languages we used, HTML, CSS, and JavaScript at the same time.
Katrina- The biggest challenge for me was the teamwork aspect. I'm used to programming independently so I had to learn how to collaborate using github and how to divide up tasks.

Accomplishments that we're proud of

Justin-Video games are the main reason I became a Computer Science major. I am beyond ecstatic about making and designing my first ever video game. It may be a very undeveloped and low graphics game, but I am still very proud of myself and so excited I got the chance to do this.
Blake-I am proud of how we kept our project organized and up to date using github. I did not have much experience with git and github before this project, especially in group projects, but after spending a long time messing with it and seeing all of the features that it offers, I feel a lot more comfortable with it.
Margaret-I used domain.com and Google Cloud to create and host our own website. Creating a website is something I have wanted to do for years but never made the time for it. I’m so happy that I had the opportunity make that goal a reality in less than 36 hours. Additionally, I was excited to make my very first commits to GitHub and create the repository through my profile. I feel much more comfortable using GitHub now than I did walking into this Hackathon and will carry the skills I learned with me into the rest of my career.
Katrina- I'm proud that I successfully completed my first hackathon and helped to make something that I think is really cool.

What we learned

Justin- Before this weekend I have never dealt with CSS, HTML, or javascript. And now I am way more confident in my abilities to understand, write and fix code in CSS, HTML, or javascript. After tons of trial and error, I have learned how to edit text, buttons, and shapes in CSS, write a script in javascript and create an HTML file that moves.
Margaret- Learning new to code in new programming languages, HTML, CSS, and JavaScript was equally as rewarding as it was challenging. I also learned how to create a repository, upload, fork, branch, and merge files on GitHub in order to work collaboratively with my team.
Katrina- I also had very little experience in CSS, HTML, or javascript before this weekend. I feel like I now have a much better understanding of how to use CSS, HTML, and javascript together. I learned how to use buttons and modals, add music and sound effects to websites, and how to use Github.
Blake-A few years ago, I learned some HTML and CSS, but I haven't done any web projects since then so a lot of the things I did in this project were a review. Although, there were a few things that I did not have any expereience in, such as modals and animations, and learned a ton about in this project. I also got more experience with git and github.

What's next for Geek 'Git'away: A Hackathon Inspired Escape Room

Improvements and optimization: We would like to have added more features in our code such as enhancing the storyline, collecting more items into inventory, more rooms as levels in the escape, sound effects, Easter eggs, and retro mini-games. We would also like to optimize our project by making the game transfer seamlessly across internet browsers and machines.

References

Snake Game Source Code
Tetris Game Source Code
Exit Scene Source Code
Confetti Animation Source Code

Built With

Share this project:

Updates