Phaser, HTML5 and this.isMadness

This year I decided to work on my portfolio, as I nearly had none, so I made a list of games I’d like to develop and, well, started developing them.

The basic idea is that I can’t develop all of those ideas and have a finished product, as I don’t have neither the powerhouse nor the time to develop a full-fledged product. So, the smart thing was to work on smaller projects and focus only in the core elements.

I started working on the first idea for a month now, using Unity, but more on that in the future. I developed part of the core; unfortunately, the other part is boring, so I started to advance slower and slower.

Coupled with that, a co-worker recently bought a Google Chromecast and we started to discuss the possibility to work with HTML5.

I liked the idea, as I’ve been wanting to work with tools other than Unity, so this was like heaven-dropped. The decisive trigger was the release of Phaser 2.0, an open-source framework to develop HTML5 games.

The only time I tried to make a game for the web was for a business opportunity (that unfortunately never prospered). The game was going to use Fruit Ninja’s mechanics, so @pctroll and I worked together on a prototype called Web Ninja (which can be played here). We used a framework called Enchant.js, and this was actually my first time developing using JavaScript. Almost 8 months later, I was working again with JavaScript.

Besides the portfolio, I also wanted to learn something else than Unity to be able to choose correct tools for future projects. There’s this quote by a former professor of mine, he says that even worse than a bad programmer is a programmer that only knows one language, and it’s certainly true. While Unity has been wonderful (Unity 5 was announced :D *Handel’s Messiah starts playing*), the switch of going from a using such a powerful engine with support for IDEs, that simplified my life, to working with basically a notepad (I’m trying Sublime) has been a great shock. I feel disorganized and unfocused.

One of the most important things anyone must learn is that there’s a tool for everything. Your duty is to choose the one best suited for the work. Unity is a great engine, but for some games it’s just overkill.

Having decided to work with Phaser, I started checking out its tutorials. It is wonderful: it has support for a great deal of features, it’s well documented, there’s plenty of examples and it seems to have an overall good performance. At its side, Enchant.js (at least the version I tried 8 months ago) seems like a pre-alpha version of Phaser; it lacked good documentation, mainly in the Physics area, and its performance was deplorable.

So yes, you could say it was love at first sight.

However, I stumbled upon with some walls while starting to work with it. See, even with all its features, Phaser is still somewhat unstable, and that’s kind of a break-dealer. The official examples work great, but I try to replicate some of them and I get stuck. For example, I was trying to check this one on Tilemaps, but my version of keep throwing an undefined variable error (I think it was missing a this. in Phaser) even though we both used the same version of Phaser (2.0.1).

But, hopefully, the framework is under constant revisions, which means it’s active.

Regarding JavaScript, it certainly feels familiar but it certainly isn’t my favorite language, by far. I mean, it’s great all the flexibility you get with a dynamic language such as JavaScript, but I think I still like better C# (then again, JavaScript’s features make it great to work in web, so it’s basically a matter of taste). But seriously, I hate to use “this.” for everything. This.isMadness.

Phaser does have the ability to support TypeScript, a programming language by Microsoft (that works as a superset of JavaScript) that’s meant to bring some order to address some of its flaws. I’d like to try TypeScript, but first I want to learn pure JavaScript.

To get used to the framework, I decided to make a simple game. Some months ago, I gave Game Maker a try and saw this example for a shoot ’em up featuring WorldWar-ish aircrafts. It reminded me of Porco Rosso, so I wanted to do something similar in honour of that great Studio Ghibli movie.

I started yesterday, so there’s nothing much I could show. And again, it’s just a simple game to try out the Phaser. Maybe if everything goes fine and I feel comfortable with it, I could start developing more interesting games. More on my adventures with HTML5 and Phaser in future posts.

1 thought on “Phaser, HTML5 and this.isMadness”

Leave a Reply