Back to all posts

2026-07-26

2D Character Animation in Godot from a Sprite Sheet — Import to Playback

Godot is a strong 2D engine, but you can't get far without a character to move. This guide covers the whole path: take a sprite sheet made from one character image, drop it into a Godot 4 project, slice it into frames, register animations, and play them from code.

Preparing the sheet and its metadata

Upload your character to the GenioPlus animation tool, pick a motion preset (idle, walk, slash, jump, cast, hit), and it generates a short clip you can extract frames from and assemble into a sprite sheet. The download includes a metadata JSON next to the PNG, listing frame size, columns×rows, and padding — exactly the numbers the next step needs. Drop the sheet PNG anywhere under res:// and Godot imports it automatically.

Slicing frames with AnimatedSprite2D

Add an AnimatedSprite2D node to your scene and create a "New SpriteFrames" in its Sprite Frames property — the SpriteFrames panel opens at the bottom of the editor. Click "Add frames from a Sprite Sheet", choose the sheet PNG, and a configuration window appears. Enter the Horizontal and Vertical counts to match the columns×rows from the metadata JSON; if the sheet has padding, set Separation and Offset to match as well and the frame boundaries land exactly. Select the frames you want in the preview and hit "Add N Frames".

Naming animations and setting speed

A new animation is called "default" — double-click to rename it to walk, idle, or attack, and use the "+" in the panel's list to keep several animations in a single SpriteFrames resource. Playback speed is the Speed (FPS) value; 8–12 FPS usually reads well for a walk loop. Turn Loop on for cycles, and off for one-shot motions like an attack.

Playing it from code

Call play() on the node — $AnimatedSprite2D.play("walk"), for example. For left/right movement, flip with the flip_h property instead of generating a second sheet (set sprite.flip_h from the sign of velocity.x). Fall back to play("idle") when there's no movement input, and for one-shot motions listen for the animation_finished signal to return to idle — that keeps state transitions tidy.

When to use Sprite2D + AnimationPlayer instead

If you want frame changes tied into the same timeline as position, rotation, collision toggles, or sound effects, Sprite2D with an AnimationPlayer is the better fit. Put the sheet in the Sprite2D's Texture, set Hframes/Vframes in the Animation section to your columns and rows, and the Frame property selects individual frames. Create a new animation in AnimationPlayer, set its length (say 0.6s) and Loop, then key the Frame property at even intervals. If frames look smeared between values, switch that track's update mode to Discrete so they snap.

For pixel art, set the filter to Nearest

Since Godot 4, 2D texture filtering is a CanvasItem property on the node (with a project setting as the default). If your pixel sheet looks blurry, set CanvasItem > Texture > Filter to Nearest on the AnimatedSprite2D or Sprite2D. To apply it project-wide, set the default texture filter under Rendering > Textures in Project Settings. Also keep pixel-art textures on Lossless compression, and leave mipmaps off unless your camera zooms out far enough to benefit.

Getting started

With a single character image you can pull one sheet from the walk preset and run it through the steps above. Background removal and the cutout editor cost no credits, so you can check how cleanly your character cuts out before spending anything.

Try it with one character image

Try the tool
2D Character Animation in Godot from a Sprite Sheet — Import to Playback