Animash Development

Frickin Cute.

It’s great to announce that Ajay from the Devil’s Garage has got involved with the game! He will be creating all of the graphics and style for the game including environments, levels and character designs - awesome.

I can’t wait to start posting some videos or screenshots of the game in action, but in the meantime the imagery above should give an idea of the graphical quality and direction the project is heading in…

Zap! - Html5 Audio Manager

As mentioned previously one of the most interesting and frustrating parts of building a browser-based games in html5 is the audio management. Handling the different browser idiosyncrasies and providing a common interface is an essential part of game development.

Zap! is an audio management library that provides an interface to the common functions required in games and interactive applications. Including:

- Loading, buffering and managing sounds
- Seamlessly looping samples
- Multiple audio channels

Zap! is being used as the audio engine in Animash and will grow and involve with the project to support more functionality. 

Download and multiple examples on Github

Node.js & Socket.io

Some big architectural decisions have been made over the last couple of days on the server side structure of animash. Originally we were thinking of creating the server in Ruby using EventMachine with Redis as the persistent store.

However, after researching node.js it seems to make sense to use a language that we know inside out (javascript) with a super active community and incredible performance. It will also give us the opportunity to share code between the client and server as well as leverage shared libraries like socket.io.

On the storage front the plan is still to use redis for storing user accounts and scores in simple, high performance sets.

Boom! Crash! Zap!

So, the original plan was to tackle the character animation first but this seemed like a waste before a designer gets onboard, instead I decided to stray into the minefield that is HTML5 audio.

The original thoughts were to use an existing library such as SoundManager2 or jPlayer to manage the in-game sounds and music. Although this would have meant introducing a flash fallback I’m not that fanatical over completely avoiding flash if it could provide a better experience.

However, after integrating SoundManager2 it was quickly obvious that the latency introduced was unacceptable and unpredictable - In all honesty I was also uncomfortable giving over such an important piece of the puzzle to 3rd party code. Unfortunately the problems with using html5 audio for games are numerous:

- The loop property is glitchy and introduces a gap at the end of each loop, rendering it useless for many in-game uses.

- The audio tag does not support multiple channels so cannot be started whilst it is already playing.

- Latency is variable as the tag doesn’t seem to be designed for real-time use, however the most recent versions of browsers seem acceptable n this department.

The next post will cover how to tackle the multi-channel issue, this I think is the most important element apart from latency which is largely out of the developers control.

Powerup Time

This evening has mostly been focussed on improving how powerups are created, initalised and managed within the game. The powerup management is a pretty standard affair contained within the main game class, it keeps track of whether there is a powerup on screen and spawns new powerups at appropriate times in random positions

The powerups them selves are extended from a base ‘Powerup’ class (which is itself a child of the EaselJS Bitmap class). See code in public gist here. This class is kept very simple, each powerup simply overrides the init method with it’s custom logic.

Currently powerups are spawned after a set amount of time in a random position, they stay in this position until collected - This will change so that they move if not collected, this should add some drama as it has to be reached before it moves and protect against the really rare occurance where a powerup could spawn in an uncollectable location.

Next up: character animation!