Workflow with Piskelapp to create a Spritesheet

Piskelapp

9 Steps

Go to Piskel and create a new sprite

Draw something basic!

You can add layers to your drawing: each item that moves independently should be its own layer to make editing easier

In my example, I only animated the mouth, so the mouth is its own layer.

You can use the "Duplicate this frame" button next to each frame to make a copy you can edit.

Slightly animating each copy of the frame will help you create an animation!

Adjust the number of columns until your spritesheet only has one row

If you find it easier, you could make your spritesheet only have one column instead. Regardless, what we want to avoid is a spritesheet with rows and columns because that will make your programming more challenging when you go to use the spritesheet.

Click on Download

Using the download button, you can download a PNG which you will need to upload to whatever project you are using it in. You can also email yourself that file for safe-keeping.

Use the save button to save a draft

If you use the save button you'll get a piskel file which you can bring back to piskelapp in order to be able to continue editing in the future. This file won't work in your game, but will let you pick up editing where you left off.