This is a game with a magic theme to fit the theme of the hackathon. In this game the character has to follow game hints that lead to the player answering the phone to a friend who sends information about the location of a portal to a magical world. The way 3d graphics engines work greatly interests me so for fun, instead of using a program like unity that does the 3d for you, for this project I aimed to create a 3d game using just JavaScript, jQuery, HTML, paint images and screenshots I would take of 3d objects. I created 3D objects using SkectchUp then screenshotted these scenery models from lots of different angles and used JavaScript and jQuery to control when these images were displayed to create a 3d game experience for the user. I also used Photoshop to make the images backgrounds transparent where appropriate. The game includes some third person scenes in which the players width and height is multiplied by scalar values based on its y-coordinate to create perspective and show when the player is close or far away. This scene also includes some quick first person moments which occur when an object of great importance to the games story appears and the user is able to view this item in first person. This was done to make sure the user sees this object up close and notices it. As the player opens the portal the world distorts a bit to empathise the magical powers of the portal. Magic dust also appears above the flashing portal. Once the portal is opened the magical world is all in first person. The player is transported to a magical castle which they can freely walk up and down one corridor of. The corridor appears clear at first but as soon as the player starts to walk an enchanted floating hat appears. When making the game I came across many challenges. One of these was that the number of screenshots needed to make a smooth running 3D game was too large. I had to compromise and limit the number of images used to a reasonable number. I also struggled with problems caused by code written for different stages of the game affecting thing in a part of the game they were not intended for. The solution to this was to give each stage of the game a boolean variable that tracks if it should have started running yet or not. This helped me keep track of which stage of the game the user was in and what code should and shouldn’t run for this stage of the game. The main thing I leant was how to make the 3d for the first person scene in the game (in the castle scene). In the future, to expand on the game I could make the game longer so that you can explore more of the castle.

Share this project: