Gaming Your Way

May contain nuts.

Google Chrome (v42+) and the Unity Web Player

As much as I like the Chrome browser, google sometimes annoys the crap out of me for playing the web police.

If you're greeted with this:

when doing a quick test built for friends (using the unity web player), try this in your url bar:
Activate it and don't forget to click "restart now".

Not a pretty fix, but hey ...

-- Olli

Rot: PixiJS Depth sorting and performance

I thought I'd do a techy post for a change, it's been a while hasn't it ?

If you've played the demo or even just seen screenshots you'll know Rot is an isometric game.

God damn that tilt shift filter is good

Because the game was always destined for mobile performance is a key issue.

Depth sorting is always painful to do, to do it correctly you're looking at doing a topological sort ( See this excellent blog post for more details: ) which is fine if you're not running too many sprites, but less than great if you're looking at a silly number of particles, and Rot is all about a silly number of particles.

Let's backtrack a little. The display is made up of various play fields ( Layers ), the background is burned into one large sprite, on top of that we have the sprites play field ( i.e. all the zombies, particles, pretty much everything moving ) and then a fore ground play field ( There are more, but let's not make this any more complicated than it needs to be ).

Because of having the background / foreground laid out like that we don't have to depth sort them at all, we only have to worry about the sprites themselves.

I added an extra property to each sprite, isoZ. This is just a simple old school depth sorting formula I'm sure you're familiar with, based on the sprites x/y position ( For more details see the link above, or pretty much any tutorial about iso ) and gives us something to sort by.

Along with that property we also added a new method to the DisplayObjectContainer class, zSort(). This method loops through all the children in our sprite play field and tests if they're visible or not, if they are they get shoved into a new visibleChildren array. This is because we only want to sort sprites we actually care about, visible ones.
We learned a lot about performance working on DN8 for iPad, and one thing was to not add / remove children when they were needed, there's a large overhead for that, so when we start a level we add nearly all the sprites at once so they're there ready and waiting for when we need them ( Things like explosions are added as needed because in the overall scheme of things they're pretty rare, but zombies and blood are always in use ).

So we have over a 1000 sprites just sitting there waiting to do their thing, but by setting the visible property to false our zSort ignores them ( This is why we check for visible rather than just looping through all the children of the sprite play field ).

This improved performance a lot, the max number of sprites we sort is 512 but in testing even with multiple explosions going off it never hits over 350, well within out limits.

The actual sort code is simple as it's possible to be,

    this.visibleChildren.sort(function(a,b) {
        if (a.isoZ > b.isoZ){
            return -1;
       return 1;

That's it, we don't even really care if two sprites have the same z depth, we're using large numbers for the isoZ value so it's a little unlikely and even if it does happen, it'll be for a 60th of a second. I can live with that.

Now if you've played with doing iso games before you'll know this way can lead to clipping, where the depth sort is a fairly cheap and therefore not as good as doing a topological sort.
The objective was to make the depth sorting good enough, not perfect. We lose a little accuracy, which hopefully you don't notice when playing ( You will now though ) in return for performance.

So cool, we've pulled out all the visible sprites and sorted them, job done...
( This is my Colombo moment )
... but there's one more thing.

When you look at any sort of display graph, the containers ( Be it a DisplayObjectContainer in pixiJS or the Stage in Flash ) are pretty much just a list of the children. To display them the plotter simply loops through the list plotting one at a time, much like a painter would ( Ah, that's why it's called the painters algorithm, it finally makes sense ).
But we've got a sorted list of only visible sprites, with a little re-writing we can remove some of the checks in pixiJS's plotter loop, we already know all these sprites should be plotted. Further more we can also check to see if the sprite has any children itself, the way the game is set up they usually don't, and if not avoid some extra looping too.

To recap, by doing a simple visibility test before sorting and then using that data we can really improve performance. The zSort method was around the 3rd most expensive function call when profiling the game, that's dropped right down now.


Go left. NO! Not that left, the other left!

Let's start with a screenshot of the recent game prototype:

The testbed for the goon's AI.

Even though it's only 2D, there's a lot going on to let the goons walk around the map on their own. Handling their normal way is easy enough, it is just looking ahead 2m and then decide what to do next (mostly broken up into multiple random chances).

If the goon sees a door, it is set as next target and he start walking into that direction (although there's a check every now and then to see if the player can be shot). After he reaches the door there aresome things to decide:

  • Have we reached the max number of steps (90% chance of using the door to exit the stage)
  • if not, there's 10% chance of an early exit
  • ... and a 5% chance of turnung around
  • otherwise pick the next target
Doors are easy.

Elevators on the other hand trigger a lot more possible actions (heavily simplified):

  • Is the elevator on the same floor? (and is it empty?)
    • Enter, pass or turn around
  • otherwise:
    • is the elevator coming towards our floor (90% waiting for it)
When the goon is finally in the elevator there are still a lot of things to check:

  • are we heading towards the player's floor? (keep going until we reach him)
  • no? (chance of riding another floor or exiting the elevator)
  • are we at the top or the bottom (90% chance of getting off, but which way?)
  • ...

Here's an image of an early draft for the goon AI:

And the first playmaker based version (I since moved that over to code)

The code version is in a way easier to maintain than the playmaker version, but also less easy to track when you want to know what's going on.

And with this, I need to get back to the goons ...

I want it painted black

Firstly, thanks to everyone who played the demo over the weekend, the feedback has been excellent.

To celebrate the game finally going out into the wild I had a couple of lazy couple of days, just adding love here and there.

I think the title of this post gives away where I spent that time.

The fire effect was in the demo, but I wasn't quite happy with it, so I've exported all the frames with -60% brightness and now as the fire burns on we slowly reveal the darker frame ( Just by increasing it's alpha ).
It's a little change but it makes a big difference, it's good to show direct feedback to a players actions.

Now because re-exporting a ton of frames is just boring donkey work I treated myself to adding some ember particles rising up off the burning zombie.
Zombies are only going to catch fire when caught up in an explosion, which already triggers a ton of particles ( Maybe too many at the moment, I think I may be showing off a little with those and could perhaps cut them back ) so there's actually a delay before we trigger them embers to try and keep the performance high.
Also I think the embers will be dropped entirely if the game is running on mobile, on my iPhone 5 I'm getting a fairly good 30fps, my iPad3 is less and more variable, so eye candy like this can be optional depending on the platform.


That's rotten

So it's been like a 100 years hasn't it ( Well, nearly a year ).

Time to pimp our new game then,

I've been working on this for just over 3 months now, my first big HTML5 game, and we're finally able to show off the demo:

We're about half way through content wise, there's a more weapons and outfits to go in there, mainly this build is to see if people find it fun or not.

Hopefully over the next few weeks I'll actually flesh out what goes into making a monster of a game like this.


PS. It's good to be back.

Welcome back.

Well, time flies. 

A few days ago (actually weeks now) we sat together and talked about the neglected blog and what a shame it is that the (dated) visuals prevented us from adding new posts (lame but this is how things work).

Anyway, the blog also needed to be moved to new server and the software needed an update as well, so we decided that this would be the time to do it. Or maybe tomorrow. Or next Monday. Or next weekend ... oh that was last year? Fuck!

here we are, on a new server, the newest version of the blog software and a new design (which is, I must admit, the default design slightly modified).

A lot has happened since the last post (a new year for instance, which is already 1/3 over), Squize is working on a really impressive html5 game (I'll nudge him to do some posts about it) and I've been busy writing non game software and just prototyping and doing a good deal of 3d character work in my spare time.

We'll try to get up to speed again with the blog, so hopefully there will be a shitload of new articles ...

-- Olli

It's Friday, again ? So soon ?

As a quick follow up to the last post where I was trying to fix the tiny slow down in the game I had a bit of a break through. Reducing the size of my pooled objects made a really large difference ( I was just pre-pooling too many items, mainly as a safety net ).

With those pools reduced it's a lot smoother now, which I'm pleased about.

Set up a twitter account for the game ( @DN8Pulse ) , as I think it's going to be an easy way to get quick feedback from players.

And to hopefully finish off the twitter / social stuff I've added a "Tweet your score" option to the game over screen. I thought rather than just a bland text tweet a custom image may be cool, and that's what you can see above there.
( It's all done using Movieclips and Sprites in Flash, so didn't take a fraction of the time to have done it in Starling, and it's just so nice being able to layer and position things in an IDE ).

I've just finished the Orbs power-ups, these are two droids that spin around your ship blocking baddie bullets. If a bullet hits one rather than just being destroyed, it's rebounded back at the baddies, which should hopefully be slightly more than a nice touch.

A bit of a slow week really, more focused on the fluff rather than getting levels and baddies in there. There's still more to do than I'd hoped for, it should be coming to a close now.


(no subject)

On the weekend if I'm working I like to count it as "Treat days", where I get to dick around with things I don't really have time for.

This weekend I updated the skybox to a much nicer collection of 1024x1024 textures and to celebrate I added some parallax stars.

The stars had to be away3D sprites as they needed to go behind the planets ( That took ages, 3D positioning isn't my strong suit ).

It looks lovely with a 100 stars, really nice and subtle, but as ever the iPad isn't going to cope with that. When I was testing though I did notice a one frame hold up when a baddie was killed ( The new stars actually really helped with the testing of this, I could see them jitter, which is something which I was missing with just the planets / skybox in there ).
Today has been spent trying to optimise things to avoid that judder. It was a case of removing every element of the explosion until I found the bottle neck, which it turned out are the particles.

So I've removed one of the explosions ( Down to 3 from 4 ), capped their max size as they grow in size depending on the beat of the music, reduced the number of particles which are belched out and done some loop unrolling in Starling itself.

A couple of things I noticed, with the particles I could pre-calc pretty much everything, their speed / rotation / speed and store all those values in Vectors in the constructor so their actual movement / scaling is just a case of getting values from a Vector, which helped. The code per particle is really cut down now.

Also with my alteration in Starling to keep the visible / invisible display objects in their own Vectors ( More here ) I found that there could be really large loops due to the number of children in the game, so I've unrolled some loops there. I think I need to do some more work though, as triggering 34 particles at once means a lot of looping to move the sprite from the hidden to visible Vector. There's got to be a smarter way to do that.

All these amends still haven't got rid of the tiny judder, I don't think it's going to be possible and I'm not that gutted about it, I'm developing on the slowest on the market iPad ( 3 ), and I added an additional check that if there are more than 20 particles running at once then I hide these new sexy parallax stars. It may sound nasty, but they're really tiny and it gives the impression that they're blinking ( Also if there are explosions kicking off on screen you're not going to notice anyway ).

Have I go time to mention retro mode ? No, ok, let's save that for now then.


Sociable, for a change.

At present with the game I'm trying to do as many of the boring things as possible, they're going to need doing so let's kill them off in one painful hit.

So yesterday was the pause mode. Now user acquisition is a thing I need to think about as this is a mobile game, rather than a Flash one that will get traffic almost in spite of itself, and the cheapest way to do that is to leverage social networks ( Shit, I'm starting to sound like all the blogs I've been reading recently. Just don't get me started on Customer Lifetime Value calculations ).

Rather than shoehorn a "More games" link or banner ad to the pause mode, I've added the ability to tweet a screenshot.

My never used personal account, a victim of my own spam.

I'm quite pleased with it, it has a nice taking a photo effect along with a picture frame, it looks pretty good. Ideally I'd like to be able to let the player mess around with the image like the screen grab feature in AAA games, but I don't know if only one person in the whole world will use this, so it's best to focus on what will be used rather than what could be.

And that's the Game Over and pause mode done. Hopefully next week will see more levels ( I've got to drop the bosses in yet, which I'm looking forward to ) and the final player power-ups.