Designing a game - Movement

Welcome to the second part of our Designing a game series. Last time (Part 1 here) we saw what it takes before you can attempt a game, this time we shall see one very important feature of gaming - Movement.

On the Game Console or on a computer, movement is generally obtained by pressing the appropriate keys, for the sake of this article, we shall assign the arrow keys on a computer and the joystick controller/d-pad on a game console. On mobile devices one cannot use a keyboard for gaming but there can be an on-screen D-pad for movement.

For the sake of understanding, let us look at how movement is managed, if every device had a keyboard. Also while we are making the assumptions, we also assume that the screen starts at 0,0 on the top left corner and we are dealing with a 2D game.

Displaying a Character

First, in a game we need to store the location of the character, one to hold the player image. Before we can render or display the character on the screen. So our variables should atleast be

local playerX, playerY
 local playerImage

and to display the character, let's say we have a renderAt function that takes the x, y as co-ordinates and the object, so we display the object on screen as

renderAt(playerX, playerY, playerImage)

The renderAt function can be used to display other objects as well, always remember that it helps to have generic functions that can work for a variety of scenarios, isn't this easier and better than having a renderPlayer, renderMissile, renderShip, renderAlien, renderMetroid, etc... all of that can be managed with that one function.
Task: Try to write what the renderAt function should look like currently we are setting it to take three parameters, an X and Y co-ordinate and the object to render.

Movement

Now that we have our player rendered on the screen, we can move the same by altering the playerX and playerY and then calling the renderAt function. so we could have a handleKeyPress event that would manage the movement as such

local function handleKeyPress(keyType)
  if keyType == KEY_UP then
   playerY = playerY - 1
  elseif keyType == KEY_DN then
   playerY = playerY + 1
  elseif keyType == KEY_RT then
   playerX = playerX + 1
  elseif keyType == KEY_LT then
   playerX = playerX - 1
  end
 end

so when the function handleKeyPress is invoked, it manipulates the playerX and the playerY co-ordinates.

8 way movement

What we just saw was a 4 way movement which makes the character move in either of the 4 direction, Up, Down, Left, Right. There are cases when the character movement has to be more than just the 4-way movement, that is when we require the 8-way movement. If we were to handle key presses, then it is a combination of two keys, one in the X and one in the Y direction. With a d-pad, it is easier to handle the same as the d-pads are designed for this 8-way movement.

So how do we manage this? For this section, we shall assume that we are getting events from a d-pad and the keystrokes are one of the following

UP_LT	UP	UP_RT
LT		RT
DN_LT	UP	DN_RT

local function handleKeyPress(keyType)
  if keyType == KEY_UP then
   playerY = playerY - 1
  elseif keyType == KEY_DN then
   playerY = playerY + 1
  elseif keyType == KEY_RT then
   playerX = playerX + 1
  elseif keyType == KEY_LT then
   playerX = playerX - 1
  elseif keyType == KEY_UP_LT then
   playerX = playerX - 1
   playerY = playerY - 1
  elseif keyType == KEY_DN_LT then
   playerX = playerX - 1
   playerY = playerY + 1
  elseif keyType == KEY_UP_RT then
   playerX = playerX + 1
   playerY = playerY - 1
  elseif keyType == KEY_DN_RT then
   playerX = playerX + 1
   playerY = playerY + 1
  end
 end

Illusion of movement (Advanced)

In some games the main character is always in the center of the screen and just rotates in the direction required while the background keeps scrolling thereby providing the illusion of continuous movement. The same can be applied to different layers of the backdrop and scroll them at different speeds to provide parallax scrolling.

NOTE

If you are starting out with development and have no idea or some idea about gaming, understand this concept well as this will be true for most of the games that you will ever make.

Also remember that Math is not one of the most interesting subjects while at school, but when developing a game, it is the most helpful tool you can have. If you are in school, just pay a little extra attention to Maths, as it will help you a lot while making your own games. (both Algebra and Geometry are useful)

Do you remember the axises? Think of them as two lines, one horizontally and one vertically, the point where they intersect (overlap each other) is the Zero, Zero (origin point) as you go upwards from the zero, the numbers decrease , so they are (0,-1,-2,-3,-4,-5, etc) as we move down on the axis, the numbers increase, so they are (0,1,2,3,4,5,6) The same goes for the Horizontal axis, as we move towards the left side the numbers decrease, like you would see on a scale, the numbers start to reduce, and then they go into negative numbers, where as to the right, the numbers increase.

Do you see a pattern here? Try to co-relate that with the key handler that we wrote earlier, when we press KEY_UP, we reduce the players Y position and when we press down, we increase the players Y position. Same with the Left and Right.

Closing Note

Hope you did understand something from this chapter, The code is pseudo code written in Lua, if it is typed and run, it will *not* run unless other bits and pieces are added to make that work. Somewhere down the track we shall try to leverage all of our knowledge and make a few games.

What do I need to do?

For that you need to comment and let us know that this has been helpful to you.

References

Part 1 - (here)