Introduction to Godot’s AnimationPlayer

Learn how to create animations in Godot using the AnimationPlayer node. Animate sprites, orchestrate movements, and add sound effects for exciting gameplay. Dive into the Animation panel, understand keyframes, and master various track types. From simple motions to complex cutout animations, explore the possibilities and enhance your game development skills. By Eric Van de Kerckhove.

Leave a rating/review
Download materials
Save for later
You are currently viewing page 3 of 4 of this article. Click here to view the first page.

Animation Tracks

You can find the tracks on the left side of the Animation panel. These tracks are grouped per affected node by default.

Animation tracks

The Add Track button allows you to create a new track and add it to the animation. Clicking this button opens a big list of different track types.

Track types

Here’s an overview of the different track types:

  • Property Track: This is the most common track type and it’s the one you’ve been using up until now. It allows you to change a node’s properties over time.
  • Position 3D / Rotation 3D / Scale 3D Track: These tracks allow you to change the position, rotation and scale of a 3D node over time. These are used to import animations from external 3D models.
  • Blend Shape Track: Like the previous track type, the main purpose of this one with externally imported 3D models. It allows you to change the blend shapes of a MeshInstance3D node over time.
  • Call Method Track: This allows you to call functions on a node. It’s useful to sync method calls in animations, like enabling/disabling colliders during a weapon swing.
  • Bezier Curve Track: This works like a Property Track, but it uses Bezier curves to control the shape of the curve.
  • Audio Playback Track: This allows you to play audio files over time and visually shows the audio levels to make it easier to sync the audio to actions.
  • Animation Playback Track: This allows you to control animations of other AnimationPlayer nodes. It’s useful for orchestrating in-game cut-scenes for example.


The timeline is a representation of an animation over time.

Animation timeline

At the top of the timeline is the timeline header which shows the current position of the animation in seconds. Below that are the keyframes.

Timeline Controls

Below the timeline are the timeline controls.

Timeline controls

From left to right:

  • Bezier Curve toggle: Toggles between the Bezier curve view and the regular track view when any Bezier Curve Tracks are present.
  • Node filter button: Enabling this will only show the tracks for selected nodes.
  • Snap toggle: Toggles whether keyframes are snapped in increments or not.
  • Snap interval: The amount of time in seconds between keyframe snaps.
  • Seconds / FPS dropdown: Toggles between viewing an animation in seconds and frames per second.
  • Zoom slider: Zooms in and out of the timeline.

Now you’re up to speed with the Animation panel, it’s time to create another common type of animation using more of the track types.

Creating a Cutout Animation

For the last animation, you’ll be creating a cutout animation. This means pieces of an object or character laid on top of each other and moved around to create an animation. This technique has been around since the start of animation in general. In physical media, people draw character pieces on a piece of paper or cardboard, cut them out and attach the pieces with pins or wires.

In this section, you’ll be animating a robot arm with a drill attached at the end. This robot arm consists of separate sprites that come together to create the object.

Robot arm pieces

By rotating the pieces over time, it will give the illusion of a drill animation.

Drill loop

Inspecting the Robot Arm

The robot arm itself is already a part of the scene, but it’s hidden. Click the eye icon next to the Robot Arm node in the Scene tree to reveal it.

Robot arm eye icon

You’ll now see the arm appear in the viewport.

Robot arm in viewport

Now take a look at the scene tree and fully expand the robot arm’s child nodes.

Robot arm nodes

At the root is a Node2D that’s used to easily move the whole construction around. Below that is a chain of sprites that make up the arm.
The most important nodes here are Part1, Part2 and End. Each of these will have their rotation animated, so careful consideration was put into their pivot points. Select Part1 for example and take a closer look.

Pivot point

The pivot point is marked with a little red cross. The sprite will rotate around it. If you rotate Part1 in the editor, you’ll see that it pivots around the base of the arm.

Rotate around pivot

Remember to undo the rotation when you’re done. When creating these chains of sprites yourself, you’ll need to edit the pivot points, as they’re at the center of the sprite by default. To do this, you can hold down the V key while moving your cursor in Select Mode (Q). In the case of the robot arm, this has already been set up, but feel free to give it a try!

Pivot change

The Drill Block

There’s another hidden node below the Robot Arm, a Block. Click the eye icon next to it like you did for the Robot Arm to see it.
This is an AnimatedSprite2D node with three frames to make it seem like it’s being drilled into.

Drill block node

Drill block animation

You’ll be using this block alongside the robot arm to give the illusion of drilling away material.

Animating the Robot Arm

To get started with the robot arm animation, create a new AnimationPlayer node in the root of the scene and name it RobotArmAnimationPlayer. Now select this new node and you should see an empty Animation panel. Next, create a new animation using the button in the Animation panel. Name this animation move_arm.

New animation

Next, move the time slider start of the timeline and rotate the Part1, Part2 and End nodes until the arm looks the image below.

Arm rotated

The exact rotations are:

  • Part1: 15 degrees
  • Part2: 75 degrees
  • End: 90 degrees

When you’re done, add an initial Rotation keyframe for each of the nodes by clicking the key button in the Inspector. You should now have three animation tracks, one for each node.

Part tracks

Making The Animation Loop

Now change the animation length to 2.5 seconds and enable looping by clicking Animation Looping button in the Animation panel. Also enable the Autoplay on Load button while you’re editing the settings. This gives some headroom to the animation and loops it.

Animation settings

To make sure the arm parts move back to their initial position, you’ll need to duplicate the existing keyframes to the end of the animation. To do this, select the three keyframes at the start of the animation by dragging a bounding box around them. Now move the time slider to the 2.5 second mark and press CTRL/CMD-D to duplicate the keyframes.

Duplicate keyframes

Doing this ensures that the animation will be a smooth loop where the arm moves back to its original position.


Eric Van de Kerckhove

Author and Team Lead

Adriana Kutenko


Over 300 content creators. Join our team.