Developer Blog - September 3rd news - Small Galaxy: Greedy Station

Welcome again to my (hopefully) weekly Developer Blog, where I share with you my process and ideas that have gone into (and continue to go into) creating a video game. This week, I am going to share with you some more technical details about the Animation Engine that I am using, explaining the concepts that I have learned through the process (or in this case, learning from someone else) of introducing its functionality into my game.

As I mentioned earlier, this is going to be a more technical blog, but I have attached a few videos for those of you who are going to just glaze over the math and C# code that I am going to share with you here... so off we go then.

Small Galaxy - Animation Engine.

It should be said up front that the majority of the animation engine I am now using is the product of work done by one Brandon Furtwangler that was shared on his Blog and through his Developer Talk for the XNA Creators Club. So please, if you are interested in digging into these concepts further, head over to the links provided to get more details.

When I first approached developing Greedy Station, I had very little understanding of what all goes into creating a real time strategy game, the technical challenge of updating all the different elements that move, change, and have effect on the world were nothing I had ever dealt with. Combine that with the complexities of creating a game for a console, I was charting a lot of new territory for myself with this project. It turns out, updating over 1000 variables 30 times a second isn't a simple task.

for(int index = 0; index < list.Count; index++)
{
    list[i].Update(elapsedTime);
}

This was my first instinct.... but updating thousands of things every cycle (especially when the majority don't need to be updated that frequently) simply isn't efficient use of the CPU.

One of the ways to limit the number of things you are updating every CPU cycle is to switch to using an Event Driven Declarative Animation Engine. Now, if this makes sense to you, and you know exactly what I am talking about, you too can just scroll down to the video examples, but if you are anything like I was, and maybe don't have a sweet clue about what that means... then stick with me, and I will happily explain it to you.

Imperative and Declarative

To put it into simple terms, there are two ways of handling animation. Declaratively, or Imperatively.
A simple explanation of the differences is that one is defining the animation moment to moment (Imperative) and the other is defining the animation ahead of time (Declarative).

An example of where Imperative animation is necessary is easily seen in your mouse cursor. The movement between where it is one moment to the next is dependent on information that is only available the moment it is needed. You can't let the cursor know ahead of time that it is going to move from point (0, 0) to point (100, 10) until the moment it needs to move.

Declarative Animation is most useful in that you can transition from point (0, 0) to point (100, 10) in some predetermined way by only making the changes to its position when they are visible (saving on CPU cycle time).

How it works

The full source code for the Animation Engine is available, as I said earlier, on Brandon Furtwangler Blog, but I will give you some examples of how it works in my game.

The most simple and obvious case for Declarative Animations are in menu items. Menu animations are almost always predefined and triggered by events (Gaining or Loosing focus, is Added or Removed). Conveniently, the same is true for simple sprite animations, and command driven action animations found in Real Time Strategy Games.

item.positionAnimation = new Vector2FromToAnimation(ClockManager)
{
    From = position,
    To = destination,
    Duration = distance/speed,
    Apply = (v) => { item.position = v; },
};
item.positionAnimation.Start();

Moving a unit FROM one position TO a given target destination boils down to a simple Declarative Animation.

While Declarative Animations account for 90% of the animations in Greedy Station, there is one other 'animation' that is entirely Imperative. (I put animation in quotes because, while it is technically an animation, the effect it produces isn't what you might think of as an animation).

You may have to watch the video a few times to catch it, but it was one of my proudest moments in the whole process of working on this game. The Parallax effect of the Galaxy. Stars, Planets, and Space Debris, gives a sense of 3D to the clearly 2D world, and makes the board game aesthetic something special.

paralaxOffset = Vector2.Distance(position, cameraPosition) * (position - cameraPosition == Vector2.Zero ? Vector2.Zero : Vector2.Normalize(position - cameraPosition)) * depthFactor;

This one line of code creates that effect.

Well, that about sums up this weeks Developer Blog. Hopefully you enjoyed the video, and maybe even learned a thing or two. Let me know in the comments if you like this kind of technical detail (though I have to admit, I tried hard to keep it simple), and if you would like more.

Thanks for your support.
-fidgetwidget