Javascript Tree and HTML5 Flies

This is a progress update to my Learning HTML5 post. I completed the first two courses through SkillSoft about HTML5 and CSS3. I learned a bit about the new tags and attributes and what’s been deprecated and abandoned from older versions. However, what I was learning was not proving to be that helpful to my ability to develop an HTML5 game except the very short section on the canvas element. I decided to start fooling around with drawing on the canvas using JavaScript to learn more.

JavaScript Tree Thing

I had this image of a bunch of threads growing up and sprouting leaves and branches and sort of weaving together into a tree. The little tree thing growing there was a sad effort toward that end, but I wasn’t ready to try to build tree growing procedure at the time. Maybe when I get to exploring procedural generation I’ll revisit the visual I have for that in my head. Anyone know if it already exists out there?

One of the other things I said I would do using the List of HTML5 Game Engines was to pick an engine to dig into and learn. I found a few other resources in making my decision that might be useful to others:


The game engine I decided to use is Phaser! Here’s a few places I’ve bookmarked as good resources so far:

The forum I found to help make my decision is also a great resource for Phaser development. As a curiosity I decided that it might be cool to port my flies over from the FleaGame. I used the starter project form LessMilk as the shell for my flies, but it turned into a very shoddy hack and hardly uses the Phaser framework at all… Anyway, here is a demo of the fly behavior minus the brief pause when they land that they have in the C++ Allegro version (because there isn’t anything for them to land on in this version).

Fly Movement Demo using Phaser

I did a little brain storming and generated a list of ideas for quick games to help me get into Phaser so expect some HTML5 games here in the near future! Along the way I’ll explore a few concepts that have been bouncing around in my head.

Leave a Reply

Your email address will not be published. Required fields are marked *