Dodge Dat Door! was a personal project I created in 2021 to practice what I had learnt about HTML, CSS and JavaScript at that time. My goal was to create something from scratch- this included the coding, the imagery and the logo- that was functioning, responsive and available online. Although I believe I achieved that goal, I will admit that the responsivity has to be rechecked and improved.
- React
- JavaScript
- CSS
- HTML
The game itself is simple (but coding the logic definitely gave me a headache at that stage in my coding journey 😅). The player clicks on a door which could lead to an empty hallway, a new room, or a monster! The doors are randomised every time, so don't go looking for any patterns! If the player finds an empty hallway, they are able to open a second door. If the player finds a room, they move to the next level of the game and their score goes up by 1. If the player finds a monster... I'm sure you can guess... Game over! There are 5 levels in total, and reaching level 5 does not necessarily mean reaching the end of your game. The player can restart the game after level 5 without losing their winning streak. When the player finds a monster at any point of the game, their score is saved in High Score if it is the highest they have achieved, and the Current Score resets to 0. My highest score so far is 7, what's yours!? 👾
As I was formally trained as an Information Designer, I took advantage of those skills to design or adapt the visual elements used in this project (logo, background, images colour scheme). The below screenshot shows parts of different working files in Adobe Illustrator when developing the website layout, logo, favicon and creating the images necessary for each door state (52 doors to be exact! 🚪).
Looking back at this project years later, I chuckle when I think of the amount of work I gave myself. I am also proud though to look back and be able to think of how I would do things differenlty now, in half the amount of time, and better!
