How To Create Professional 2D Games

This is an interactive guide to creating 2D games. Use the arrow keys to go forwards and backwards between slides.

Notes and Credits:
Music is made by @fredmaster45 and @BlazinDevilify
Guide by TM

How to create a flying 2D game character

Before we explain how to create your flying 2D game character, lets try it out. Press the green flag to start, use the arrow keys to control the player.

To create the illusion of your 2D game character flying you will need to fist create the character costumes. In this example, the character has been given a jet-pack so to create the illusion of a working jet-pack which is powering his flight a series of costumes, each with increasing power from the jet-pack were created to suggest a burst of fuel/power into the jet-pack. See below.







In this example, I will be using the 2D game engine Scratch (free to use) to programme the character but don't worry is you use a different game engine as the principles are  basically the same.

Firstly you will need to create to create 2 variables, 1 for the  characters speed on the x-axis and 1 for the characters speed on the y-axis. You can call them anything you want but ideally use something obvious such as "x speed" and "y speed". These variables can then be used in the programming code to create a realistic sense of gravity.

All the snippets of code below are explained in their captions and how they relate to the overall flying process.

This code toggles through the costumes when the up arrow is pressed


This code uses the x speed variable to speed/slow the character when the left or right arrows are pressed

And finally the gravity creating code...

This code creates the illusion of gravity at the outset and then relates to it
 as the up arrow is pressed, representing the jet-pack being powered

Why not try it yourself, you can remix and edit the project here.

Sample Character For 2D Game

Click the green flag to start. Use arrows keys to make the character walk and jump.



This character was made and programmed using Scratch, but the principles are the same for most other 2D Game engines. See the code below to understand how the character movements are programmed.




This code controls the right arrow key, the process is the same only opposite for the left arrow

This is the code for the up arrow

The costumes referenced in the above code examples are these character costumes...




Between the programming code and the character costumes a basic sense of a moving character can be created.




How To Create A Character Walk Cycle

In 2 Dimensional games and animations the illusion of motion is created by carefully sequencing slightly different still images at a speed quick enough, where the human eye will fill in the gaps between. This is usually 24 fps (frames per second).

Here's an example, the 5 images below are all still images, but when they are programmed to change quickly the character appears to walk, especially when a forward motion is added.


 


This is a basic sample (below) showing how character costumes can be created and arranged to simulate movement in a 2D game. Press the green flag to start.






The motion is created by this block of logical programming along with the character costumes shown above.

programming code for the sample animation above