Make a sprite

A sprite is a 2D character for a game, with one or more clips. A clip is one animation, such as idle, walk or run. In this guide, you make a pixel art knight with an idle clip and a walk clip. You start from the template Sprite from an image model.

Open the template

1. Click Workflows in the header.
2. In Templates, click Sprite from an image model. tabletop copies it into your org and opens it.

   guides/sprite-template

The template has these nodes:

Both Generate Sprite nodes use the same concept image. So the two clips show the same knight.

Describe your character

1. Click the Plain Text node at the left.
2. Change the knight to your character. Keep the parts about the style, the pixel size and the three views.

   guides/sprite-prompt

Set each clip

1. Click a Generate Sprite (Image) node. Params shows Columns, Rows, Subject width, Subject height and Reference frame first. Below them, it shows one section for each part of the node.
2. Set Columns and Rows: the poses of the clip. For example, 4 columns and 1 row give 4 frames.
3. Set Subject height: the height of the character in art pixels, such as 48. Keep Subject width at 0, so the height sets the scale. Give all clips of a character the same subject size.
4. In Frames Prompt, fill in the fields:
   • Subject: who is in the clip, such as “the knight”.
   • Motion: what the subject does, such as “idle breathing loop: the chest rises and falls by one pixel”.
5. In Sprite Clip, type the name of the clip in Clip, such as “idle”. Turn on Loop for a clip that repeats.

   guides/sprite-clip

Pick the colors

The Sprite Palette section sets the palette of the clip. All frames use the same colors.

1. Set Palette:
   • Auto finds the colors in the concept art. Colors sets how many.
   • A preset, such as PICO-8 or Endesga 32, uses a known pixel art palette.
   • Custom uses the colors that you pick or type.
2. After a run, Auto shows the colors that it found. Click Edit these colors to change them.

   guides/sprite-colors

To add a clip, such as a jump:

1. Select a Generate Sprite (Image) node and click Clone in the canvas bar.
2. Link the concept image to the new node, and its output to Combine Sprites.
3. Change the fields and the clip name.

Run it

1. Press ⌘A on Mac or Ctrl+A on Windows or Linux to select all nodes.
2. Click Run.
3. Look at the concept art when it is done. If it is wrong, click Re-run in the Run tab of Generate Image. Do this before the clips run, or click Step in place of Run.
4. Wait until Preview plays the sprite.

   guides/sprite-result

Export the sprite

1. Click Export Sprite.
2. In Params, set Format to your game engine. Set Name, such as “knight”.
3. Run the node.

   guides/sprite-export

The export also has a normal map, so your game can light the sprite. Download the files from the library.

Use a video model

The template Sprite from a video model makes a run clip with Generate Sprite (Video). First, it draws a start frame as pixel art at the subject size. Then it makes a short video of the motion. Last, it turns one loop of the video into pixel art at the same subject size. The start frame uses an image model: OpenAI, Leonardo or Gemini. The video uses Leonardo or Runware.