In this tutorial, I will show you how to design, animate, and export a 2d game character animation in Blender for your project.

Character Setup

If you want to follow along, I have provided the link to the Blender file

The first thing I need to do is move the 3D cursor to the place where I want the individual graphics to rotate and move around

For the head, I hide the beard and use SHIFT + Right-click to move the 3D cursor to the bottom-center of the head

I then right-click and set the origin to the 3D cursor and unhide the beard

I then select the left arm and use SHIFT + Right-click to move the 3D cursor to the top-center of the arm

I then right-click and set the origin to the 3D cursor

I repeat this process for the right arm

For the left leg, I use SHIFT + Right-click to move the 3D cursor to the top-center of the leg

I then right-click and set the origin to the 3D cursor

I repeat this process for the right leg

Animation

I will split the viewport and open the timeline

Under the output tab, I change the FPS to 60 and the end frame to 60

On frame 1, I select the left leg and rotate it around the Y-Axis -30-degrees

Using the I-key, I insert a keyframe for rotation

On frame 30, I rotate the leg around the Y-Axis 60-degrees and insert a keyframe for rotation

I copy the keyframes from frame 1 and paste them on frame 60

On frame 1, I select the right leg and rotate it around the Y-Axis 30-degrees and insert a keyframe for rotation

On frame 30, I rotate the leg around the Y-Axis -60-degrees and insert a keyframe for rotation

I copy the keyframes from frame 1 and paste them on frame 60

On frame 1, I select the left arm and rotate it around the Y-Axis 30-degrees and insert a keyframe for rotation

On frame 30, I rotate the leg around the Y-Axis -60-degrees and insert a keyframe for rotation

I copy the keyframes from frame 1 and paste them on frame 60

On frame 1, I select the right arm and rotate it around the Y-Axis -30-degrees and insert a keyframe for rotation

On frame 30, I rotate the leg around the Y-Axis 60-degrees and insert a keyframe for rotation

I copy the keyframes from frame 1 and paste them on frame 60

Sprite Sheet

For the sprite sheet, I need to export keyframes from Blender

I use NUMPAD Zero to go into camera view

Under the output properties tab, I change the resolution to 36 x 36

I select my camera and use ALT + G AND ALT + R to clear the location and rotation

In side view, I rotate the camera around the X-Axis by 90-degrees

Back in camera view, I move the camera until the character is standing on the floor and within frame

I add an area light and rotate it around the X-Axis by 90-degrees

I reduce the power [0.5]

Under the render properties, under the film panel, I make sure “transparent” is checked so I can export the images with a transparent background

Under the output properties tab, I make sure the file format is PNG and the color profile is RGBA

On frame 0, I render the image

I then save the image to my folder

I repeat this process for every 5 frames [5, 10, 15, 20, 25, 30, 35, 40, 45, 50, 55, and 60]

I open GIMP and make a new document that is 252px x 72px with a transparent background

Under the image menu, I select configure grid and change the horizontal and vertical to 36

Under the view menu, I select “show grid”

I import each of my renders in sequence onto the new document

After they are all imported, I can export the entire sprite sheet as a PNG