Tutorials » Tips for Putting Together a Sprite Sheet Hello, and welcome to my tutorial. In this guide I will be outlining tips for assembling and organizing sprite sheets. After reading this you should have a pretty good idea of how to make your sheets more useful and easier to navigate. This guide is not a guide on how to rip sprites - just how to organize them into a sheet. Furthermore, these aren't rules for submitting to Sprite Database - though if you follow these rules, your submissions will be more likely to be accepted.

I. Background Color

One thing to consider when assembling a sprite sheet is the background color.

The main thing is to avoid using a color that is already present on the sprites you are sheeting. For example, if you are ripping a character with a black outline, using black as the background color would be a bad idea, as users would have no way to separate the sprite out from the background. On the other hand, for a character like Samus from Metroid Zero mission, a black outline is fine and allows the sprite to stand out with minimal distraction.

This information may seem overly obvious, but trust me - I have received dozens of sheets with this problem over the years. It's one of the fastest ways to irreversibly ruin your work.

To avoid this issue, many choose to use neon colors like bright pink or green - while they aren't exactly pretty to look at, there is a low chance any sprite will use them so they do make a good background.

Others choose to use a transparent background. You can do this with .gif or .png files and it's a perfectly acceptable way of handling things. This method also works great for images that aren't pixelated and have some blurred edges.

I personally prefer to use calm, grey-ish shades of blue or green, or even purple or red. Like these:

---

II: Alignment

This one's pretty simple. Neatness counts, you know.

Here's a cropped area from a very well aligned sheet. [Marco (Heavy Machine Gun)]

But what if it was like this?

The individual sprites aren't aligned in a consistent way, which makes it difficult to understand visually.

Make a line, and put every sprite on it and they'll all be lined up! Of course, you should get rid of the line when you're done...


So, there you go. A nice, neat sheet and all it took was a little line.

---

III: Organization

Most sprite sheets are organized by what we call animations. Specifically, the individual sprites that make up the frames of an animation. It's important to keep sprites from the same animation together so it makes sense to anyone viewing the sprite sheet. By the same token, each animation should be placed separately enough from each other that the viewer can tell where one ends and the next begins.

When compiling animations into a sprite sheet, it's best to do so in a logical order. There are no definite rules for how to do this - as long as you put some thought into it, it should be fine. Using the example of a typical fighting game character, I like to follow an order that goes something like this: Basic actions (standing, moving, jumping, crouching), basic abilities (normal attacks, throws), special abilities (special attacks, super moves), defensive actions (blocking, taking damage, being knocked out),other actions (introduction, taunts, victory poses), and finally supplemental images (portraits, icons.)

Spacing is also an important part of organization. Using the same amount of space between each sprite, horizontally and/or vertically, will make your sheet easier to use and better to look at. You can also use larger empty spaces to show where one section of your sheet ends and another begins.

Overall, organization comes down to common sense. When in doubt, check out similar sprite sheets from other people and see how they did it. Keep related actions together, and leave plenty of space.

---

IV: Usability

Here's another big issue. When you rip a sprite sheet, it's probably so you (or other people) can use it for something.
Yet somehow, a large amount of sheets are simply useless. or unusable. There are a lot of ways this can happen, so pay attention.

• File format: Always save your sprites as PNG images. PNG is supported by pretty much every program, supports transparency, and won't distort, blur, or discolor your images. GIF is acceptable, but make sure you know how to save with a proper palette in your graphics editor. JPG should always be avoided - it compresses images, creating an irreversible blur that ruins sprites. It is technically possible to save an uncompressed JPG, but PNG is still better. BMP is also acceptable, but tends to have large file sizes and doesn't always work in web browsers. Use PNG instead.
  
  
• Completeness counts: Completeness is another factor in a sheet's usefulness. More complete sheets are more useful, seems self-explanitory. Of course you can't always get everything but it's not about winning or losing, we just want you to try. Er, or something like that.
  
  
• One game per sheet: For the sake of organization and clarity, I suggest that you limit a sprite sheet to images from a single game. That makes it easier for me to decide where they should go on the site, and makes it clear to users exactly what game's sprites they are looking at.

---

V: Tags

And now we come to what is usually the final step: the "tag". The tag is essentially a small area on the sheet where you can write basic information about what the sprites are, where they came from, who you are, etc. A couple of things to consider about tags, if you choose to include one:

---

Summary

If you follow everything in this guide, your sprite sheet should be lookin' good. Here's a quick rundown of everything you've read so far.