Hi everyone,

Today’s post talks will be about how to design the most basic parts of a platform game engine. On our last post, I finished a simple Map Editor, now it’s time to put Ninja Stick Figure into action!

Defining the Ninja Action States

Most of you are probably thinking about defining the most basic and generic objects (EG: the main character, enemies, bullets, items, etc.), but since this game is supposed to be simple, we’ll jump right into the main character, Ryuuhi, since I’m more interested in developing the platform engine. For a more complex and bigger project, this definitely wouldn’t be the best approach.

Anyway, the first thing I have to think about are the different states that our Ninja has:

Every state is self-explanatory so there’s not much to explain. Defining how states work is easy, IDLE happens when you don’t press any button, WALK when you press Left/Right, JUMP when you press the “Jump” button, and so on. For now, I won’t be using the ATTACK state since I’m only interested in how Little Ninja interacts with the terrain, not with other objects. Anyway, it’s important to associate an animation with each state, as well as a transition between states: for example, the character may go from IDLE to WALK, but can’t go directly from JUMP to WALK. Anyway, this can be done with a simple Enum:

enum NinjaAction
{
    NJA_Idle = 0,
    NJA_Walk = 1,
    NJA_Turn = 2,
    NJA_JumpStart = 3,
    NJA_JumpHang = 4,
    NJA_JumpEnd = 5,
}

Enums are very simple but work well on cases like this. This way, if I need to define another state or need to change its number for any reason, the rest of the code stays clean. For example, the IDLE animation would be ninjaAnimation[NJA_Idle], which is easier to understand compared to ninjaAnimation[0]. As for  Jumping, three different states were defined: the part where Ryuuhi ascends (Start), the part where Ryuuhi doesn’t move and descends (Hang), and the part where he falls (End). In good theory, all states should have a generic outcome when you enter and exit a state, but as I said before, I’m more focused on game mechanics right now.

Note that Ryuuhi is facing to his LEFT on all the images. This means that, besides states, it is important to define the state’s direction too.

Action #1: Walking

Walking is fairly easy on flat terrains, since it only changes the sprite’s X coordinate while you hold Left or Right. Just as a note, when you press the opposite direction, the Ninja goes from Walking -> Turn -> Walking (opposite direction). It’s important now to define how he collides against walls, so we need to understand what a collision box is:

The Sprite Frame is the actual image that I am drawing on screen, while the Collision Box defines how the ninja interacts with the terrain. In this case, it’s important to understand how the two different boxes differ. It would look really bad if I used the sprite frame as a collision box since Little Ninja would “bump” against walls from a faraway distance, which is not what we want:

Now that’s more like it, right? Basically what we need to do is find out what tile is next to the Ninja, depending on the direction he’s facing. If said tile is a Solid wall, then it means that he cannot walk. If not, then he can walk through (if you want me to explain a little further let me know).

Anytime you press the Left or Right directions, he changes his state from IDLE to TURN/WALK. We then ask if he is able to walk in said direction, and if so, his X-coordinate changes.

Action #2: Jumping

Jumping is a trickier than walking, since jumping (in reality) is not a linear function because of physics (read: gravity). The jump starts fast, and slow downs towards it peak until is starts to fall:

Applying a real physics formula is possible, but most platform games just use a small number of linear formulas (and so does Little Ninja) since the result is more predictable and it actually looks better. Games usually have an extended hang-time, the “floating” feeling and, as you can guess, this the case of Little Ninja too.

Anyway, I recorded a GIF of the actual game running:

(For those using Internet Explorer, the GIF probably runs a little slow, please use Firefox if possible!)

Anyway, the animation above pretty much wraps up everything I explained and more: I didn’t get to explain collisions against the floor and falling.

Little Ninja is finally moving and that’s it for today, next time we’ll probably see him hanging on the wall and walking on slopes. Hope you enjoy the article!

This entry was posted on Sunday, November 30th, 2008 at 8:09 pm and is filed under Game Design, Little Ninja. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.