**This is an old revision of the document!**

How to make a platform game : player animations

This tutorial will explain you how to add different animations and how to use events to change the animations when the state of the player is changing.

Click here to read the previous part if you have not done it already.

Add animations

At the moment, the player is always displaying the same standing animation but we're going to change that using events.

But First we need to add the appropriate animations to the Player object.

Jumping animation

Open the editor of the Player object, make sure you're on the Properties tab, then click on the + button on the bottom of the window to add an animation. Finally, click on the thumbnail with the + sign of the new animation and choose p1_jump as the image to add:

Animations can be given name, it's an easy way to differentiate between them and use them in the events. It's as simple as clicking on “Optional animation name” and typing the name you want.

Enter “Idle” and “Jumping” as names for our two animations:

Running animation

We also need to add the walking animation to display when the character is walking on a platform. Add another animation like we did before, and, when adding images, select the 5 images p1walk03.png, p1walk04.png, … and p1_walk07.png. You can select all the images at once or one by one as you prefer. Finally set the name of the animation to Running:

These images will be displayed so as to create the animation. We need to tweak a bit some options: first click on Don't loop to switch this option to Loop. It is because we want to loop this animation to be played constantly. Otherwise it would be played only once every time it called and in case of walking it is not what we want. The timer is displaying the time in seconds between each image, in other words the speed of the animation. Enter 0.05 instead of 1 so that the animation is played faster:

Our object is now ready, click Apply in the bottom right corner.

Use events to change animations

The first event: animate when jumping

Now, we need to change the animation displayed by the object according to what the player do. We're going to use the events, which are used to describe the rules of the game and how objects are animated, moved and respond to player inputs. It's a kind of visual programming that can be learn very quickly and is accessible to all.

Open the events editor of the scene by clicking on the tab called New Scene (events).

For now, the events editor is empty:

Add the first event by clicking on the add event button in the top toolbar.

An event is composed of a list of conditions (that can be used to check if a collision is happening, if a key is pressed, if the player life is low etc…) and a list of actions that are executed when conditions are met.

For now the event is empty:

In this first event, we're going to check if the player is jumping and change its animation accordingly. First Click on Add condition.

In the window opened, you can see all conditions available to make your game. We want to check if the Player object, which has the Platformer character behavior, is jumping. Open the category called Platform behavior and then choose Is jumping.

The right part of the window displays the parameter that are needed to configure the condition. Here, we want to check if the Player object is jumping, so choose Player for the first parameter (the second is automatically filled):

The condition is ready! Click on Ok in the bottom right corner to close the window and see the condition added in the event:

Let's now add the action to change the Player animation when the character is jumping. Click on Add action.

The window opened is similar, but now displaying all actions available:

We're going to change the animation of the Player, which is a Sprite object. Open the Sprite category, then Animations and finally choose Change the animation (by name).

Select the Player object for the first parameter, and write "Jumping" in the second field. Beware, you have to write the double quotes as any text in GDevelop actions or conditions can also be generated using a formula, so it's necessary to use double quotes to tell GDevelop that this is a text:

When it's done, click on Ok in the bottom right corner. The first event is ready!

Let's take a look at the result

Click on the Play button in the toolbar to launch a preview. When you jump, see the player animation changes!

But when the Player is back on the floor, you can see that the animation is not set back to the Idle animation. This is simply because we never told GDevelop to do so! Let's add another event to fix this.

Idle and running animation

Let add a new blank event. Click on 'Add condition' and this time select the condition 'Is on floor' inside the Platformer behaviour category. Note that you can use the search box on the top to quickly find a condition when you know its name!

Fill the first parameter by choosing the Player object:

Click on Ok to validate the condition:

In fact, it's a good opportunity to make our character displaying not only the idle and jumping but also the running animation too:

We could do two events with two conditions and an action in each

 * When the player is on the ground *and* not running, the Idle animation must be shown.
 * When the player is on the ground *and* running, the Running animation must be shown.

but we can use sub-events to only have the condition checking if the player on the ground one time.

So, let do that. We can now add two other events, which will be sub-events of this event. This mean that they only will be launched when their parent (the event we just created) has its conditions met.

Select the event we created by clicking on an empty area near Add condition or Add action:

Then, click twice on the button to add a sub-event:

Two “child” events are added under the event which is considered the parent event now. There is some added margin on the left and a line between them to visually confirm that they are connected:

You can now add conditions inside these events! For the first, add a condition to check if the player is running:

For the second one, add the same condition, but check the Invert condition toggle. This way we technically invert the condition make it so that the actions of the event will be launched when the Player object is NOT moving:

Our events should look something like this so far:

We're almost done, let's finish it by adding the required action to each event. Use the first event to set the animation of the character to "Running" and the second event to set the animation of the character to "Idle". You can add these actions the same way as we did before with jumping, don't forget the quotes “ ” when you enter the animation name.

Time to preview (and save)

Let preview the game and see that the player animation is changing while running and jumping!

A little bug you might notice if you try to jump off a platform that the player is playing the walking animation even when falling. This is maybe not something we want and prefer to play a falling animation instead when the player is falling. To fix it, we can set the animation to Jumping also when the player is falling just like we did before with the other animations. It should be not a problem by now. Just add a blank event, add the condition 'Is falling' and add the action to change the animation by name to 'Jumping'.

Next step: have the camera follow the player

For now it's hard to build a large level to explore because the player can quickly walk outside of the screen! The next part of the tutorial will show how to make the camera follow the player. It's really simple, a single event will be enough!

➡️ Read the next part of the tutorial here!