Flipbox (2016-2018)

First written: 2020.04.02

I've always loved puzzle games, so at the end of 2016 I created my own.

One does not simply make a game without an idea though. Earlier in 2016 I rewatched Inception (Christopher Nolan, 2010) and wondered if the mirror scene with Ariadne (Elliot Page) could be used as a mechanic for a game. At the time I sketched out some ideas as to how this could work, but the mechanic seemed too restrictive, at least for 3D level design. Somehow this idea then morphed into the main idea of the game involving blocks which change the environment. At the time I created some GIFs to illustrate possible boxes and levels, and planned to return to the project once I was done with honours.

Picking up the project at the end of the year, I started looking around for some tools with which to create the game. Ideally I wanted a tool which wouldn't require me to first spend hundreds of hours learning it. After a day of scouring the web I realized this was an unrealistic expectation, but also that I had experience with Python, and that someone had probably made a game in Python which I could adapt.

Turns out there was something even better (pygame), an entire library dedicated to games in Python, and there were loads of tutorials about it! (I used this one). I didn't think it would have been possible for me to create from scratch my first puzzle game within a week, but thus is the beauty of pygame (and being able to program in Python). Pygame loved pushing the CPU of my laptop a bit too much though and draining its battery (these were in the dark days before I had built my own PC), and the game was not very portable.

A couple of months later I realized that javascript could do all of the logic and rendering I needed to run the game, but much more efficiently. Better yet, by writing the game using javascript, everyone with an internet browser would be able to play the game, instead of just people with the pygame library installed. I found an excellent series of tutorials by a NYU professor about the javascript library p5.js, and by following them was quickly able to rewrite the game in HTML5 using p5.js.

Towards the end of 2017 I then realized the HTML5 Canvas element and native HTML5 javascript libraries could do all the things from p5.js I used, so then I rewrote the game in pure HTML5. This time there weren't as many excellent tutorials, instead lots of documentation reading. The rewriting wasn't that bad though,... at the end of the day p5.js is still javascript!

In the years that followed I'd sometimes get another idea for a level and add it, but have otherwise have left the game alone. Trying to create a puzzle game where every level has a different idea was time-consuming, but I also found it rewarding. In the very least it means that when I now play outstanding puzzle games such as Stephen's Sausage Roll (Stephen Lavelle, 2016) or Baba Is You (Arvi Teikari, 2019) — which are easily among the top 10 puzzle games ever created — I have a good idea of the huge amount of creativity and constant tinkering that went into their creation. As a result I probably end up enjoying them more than if I hadn't created my own puzzle game.

I hope you enjoy it! ~~When~~ if you get stuck, if you want to ~~spoil the solution~~ give yourself a hint, I recorded a recorded a walkthrough of most of the levels.