You are Offline — A JS13K Game
Introduction
I only heard about JS13K games (https://js13kgames.com) for the first time about 6 weeks ago. I decided to make up for lost time by creating 2 games! The second of which being an entry to the WebXR category.
The game can be played here: https://js13kgames.com/entries/you-are-offline
JS13K is an annual competition where you have a month to create a game. The overall game size must be no larger than 13KB, no external libraries/code/assets (except for the WebXR section where you can choose between using Aframe or Babylon.js).
Theme
The theme this year was “Offline”. I liked the thought of creating an escape room, and the idea of having to go online to call for help felt like a good way to link in to the theme.
A-Frame vs Babylon.js
Though Babylon.js is new to me, I really like the look of this and I have worked through a few of the demos. It appears to be specifically designed for creating games and is definitely something I will be looking into further in the future. Due to time constraints, however, I chose to use A-Frame on this occasion. I have used A-Frame before and it makes getting into WebVR really easy. I really enjoyed using it for this project.
Limitations
I made the decision to only use 3D primitives. Though I am familiar with Blender I didn’t feel there was enough space to export from Blender along with the texture information that would have been required. Given more time I may have found a way. Though it made things simpler just using primitives, this was a definite limitation.
Time was also a large factor as this was the second game I was creating for the competition. I would have loved to have added more challenges along the way, perhaps a second area to move into, but I feel there is enough in the existing game to hopefully make it an engaging experience.
Performance
I struggled with performance quite early on due to lights and shadows so I decided to create a toggle-switch to allow users to select the level of detail based on their device. In medium quality there are only 2 lights and shadows are turned off. In high quality this increases to 5 lights with shadows. This seems to make a huge difference to frame-rate on less powerful devices.
HTML Canvas
I used canvases in a couple of places. Given more time I would have liked to have used these more to create various textures. This is an area I will explore in more detail in future.
Audio
I used SoundBox ( http://sb.bitsnbites.eu/ ) for the audio. I was impressed with the range of sounds you could get and how these could be layered using the sequencer. I ran out of time to fully explore this so there is not as much audio as I would have liked. If you manage to complete the game you are rewarded with a longer audio track at the end!
Conclusion
This is the first time I have entered a Javascript / game development competition and I have definitely enjoyed the experience. I think next time I will aim to (rather than making two games) concentrate on making one game the best it can be. It’s great to see what other people have come up with and how they have interpreted the theme. I’m already looking forward to JS13K 2019!