Thunderjack! (HTML5 Version) and Phaser Editor

Hey there.

In addition to the Android version of Thunderjack! that I’m working on, I’ve also started a browser version, using HTML5. Flash is reaching its end-of-life, but browser games are still a thing. So, HTML5 is the next step for me, and I’ve been improving my skills to produce web-based games that do not use a plugin.

I found Phaser, an HTML5 game development library, and started learning it. This library is incredible! I’ve used it to create my first HTML5 game, Brickout.

Sure, I’m not the biggest fan of JavaScript (I took this course to get some quick JavaScript training), but that’s a relatively small hurdle to overcome – especially if you were like me – ego and attitude was keeping you from learning JavaScript.

I also wanted some sort of WYSIWYG IDE for designing the visual aspects of HTML5 games, similar to Adobe Flash/Animate. Eventually, I found the Phaser Editor.

Giving this software a try, I’m really liking most of what I’m finding with this editor. When you add visual objects the canvas scene, Phaser Editor generates the JavaScript code that creates those Phaser objects. No more having to hard-code things like the x/y positions of objects and line up your objects using trial and error.

You can even create custom, re-useable objects (known as prefabs in Phaser Editor), which can really facilitate the building process.

While the learning curve isn’t too steep, though I would have liked to see a tutorial that creates a game using the editor from scratch, rather than a pre-made game.

This editor also comes with its own JavaScript coding editor, with many of the standard features you’d expect from an editor, such as auto-completions, listing of JavaScript and Phaser API methods, code refactoring, and more.

Phaser Editor comes in two flavors: free and paid. The free version has some limitations, but not enough to stop you unless you’re building a massive game.

Overall, this is a very handy tool, and I’m excited about integrating it into my workflow as I add HTML5 game coding to my list of services.

More updates on Thunderjack! will be in the coming weeks. Stay tuned.

Talk to you soon.
– C. out.

Tools I Use

Hey.

I want to fill you in on the tools and resources I use when I’m coding games. This is not an exhaustive list.

Coding Editors/IDEs

  • FlashDevelop
    My current go-to IDE for all things ActionScript 3. I also like how it can download and configure updates of the Adobe AIR and Flex SDKs.
  • Adobe Flash CS/Animate
    I don’t use this for coding, but for managing assets. While I’m not an artist, graphic designer, game designer, I find its visual editor very easy to use and mostly intuitive.
  • Brackets
    Been using this free editor for a little while. I use it for JavaScript when coding HTML5 games using Phaser.

Programming Languages/Engines/SDKs/Runtimes

  • Adobe AIR
    Despite Flash being retired soon, Adobe AIR is still at large. AIR is not the same thing as Flash – they both happen to use ActionScript 3 and many of the same APIs (with AIR having access to many more of them, partly due to it being able to target desktops). Plus, Adobe AIR can be used to target mobile (Android and IOs) from the same code with minor changes.
  • Adobe Flash
    Yes, I know Flash will no longer be updated or distributed by end of 2020, but until then, hey, it’s still being used.
  • Phaser
    I only care enough about HTML5 and JavaScript because of Phaser and it’s capabilities for game making. I don’t give a damn about web development.
  • Unity
    While I haven’t used Unity to make any games yet, I found a good course on Udemy for it.

Graphics

  • Paint.NET
    I use this for editing of bitmap files. Another simple and intuitive tool to use.

Project Management

  • Trello
    A free online tool for keeping track of my progress, especially when working on larger projects. I use it in a Kanban style, and I’ll have three major categories for tasks: Backlog; Work In Progress; and Ready for Testing. Once the client has tested the latest updates and all’s well, I will archive all the tasks in the Ready for Testing category, and start anew.

Source Control

  • GitHub
    Using Git as the version control system.
    You can find me here, hint, hint.
  • Bitbucket
    I also use Git here, but have tried Mercurial.

Audio

  • Wavosaur
    Simple tool for editing audio files.
  • Audacity
    Not as easy to use as Wavosaur, but it has more functions, particularly in terms of effects you can apple to sounds.

Music

 

So, that’s pretty much the jist of what I use. If you have any questions about anything here, let me know in the comments!

– C. out.