From Photo to Sprite: How to Prepare Images for Ideal Pixelation

Pixelating a photo is usually described as a resolution problem.

Take a large image, make it smaller, reduce the colors, add some dithering, and you have pixel art.

That works technically. It doesn't always work visually.

A photograph can look perfectly clear at 1200 pixels wide and completely fall apart when reduced to 64 or 96 pixels. A face loses its expression. A person blends into the background. A tree turns into a dark blob. Small highlights disappear, while unimportant textures somehow survive.

The problem isn't necessarily the pixelation algorithm.

Quite often, the original photo was simply not a good candidate for heavy reduction.

When there are only a few dozen pixels available to describe a subject, the image has to make some decisions before the computer makes them for you. You need to decide what the subject is, where its outline is, which areas should stay dark, and which details can be thrown away.

That preparation has a surprisingly large effect on the final sprite.

1. Start With the Subject, Not the Resolution

Before changing the resolution, I would look at the photo itself and ignore the pixels for a moment.

What is the thing the image is actually about?

This sounds obvious, but it becomes important when the photo contains a lot of secondary information. A person standing in a room may occupy only a small part of the frame. A landscape may have dozens of different textures competing for attention. At normal resolution, the eye has no trouble sorting them out. Once the image gets small, it can't do that anymore.

One quick test is to step back from the image or simply squint at it.

The details start disappearing almost immediately. Hair stops looking like individual strands and becomes a dark mass. Leaves merge together. Folds in clothing turn into a few larger patches. What remains is much closer to the information a small sprite can actually preserve.

That is usually what I want to see.

A useful source photo doesn't have to be simple, but its main subject should be easy to pick out. The outline should make sense. The important light and dark areas shouldn't all have the same value. And the background shouldn't contain so much contrast that it starts competing with the subject.

This is why a fairly ordinary portrait against a plain wall can work better than a much more impressive street photograph.

The street photograph may contain far more visual information. That's exactly the problem.

At 32 × 32 pixels, there simply isn't enough room to keep most of it.

So the first step isn't really “prepare the image for pixelation.” It's deciding what part of the image is worth keeping in the first place.

2. The Silhouette Usually Survives Longer Than the Details

There is a useful way to see why this matters: remove almost everything from the image.

Take a photograph of a person and turn the person into a single dark shape. No skin tones, no hair texture, no fabric detail, no facial shading. Just the outside contour.

You have thrown away an enormous amount of information, but the person may still be recognizable.

That tells you something about small-scale images.

The silhouette carries a lot more information than its simplicity suggests.

At 64 × 64 or 32 × 32 pixels, the outer contour may occupy only a few dozen meaningful transitions between foreground and background. A change of one pixel can alter the shape of a shoulder, the angle of a head, the edge of a hat, or the position of an arm.

Texture doesn't have the same privilege.

A patch of hair might contain hundreds of tiny variations in the original photograph. After downscaling, those variations are averaged together. They don't necessarily become hundreds of tiny hair pixels. More often, they become one slightly darker area.

The same thing happens with grass, brick walls, skin texture, fabric, and foliage.

This is why sharpening a photograph before pixelation often isn't as useful as people expect. Sharpening makes small edges more obvious at the original resolution, but those edges may still disappear when the image is reduced. If the large shape underneath them isn't clear, making the texture sharper doesn't fix the problem.

A stronger silhouette does.

Take a person wearing a dark jacket against a similarly dark background. At full size, you can probably still tell where the person is because there are plenty of other clues: the face, folds in the jacket, hair, shadows, perspective, and so on.

Shrink the image far enough and those clues start collapsing into the same few colors.

The jacket and the wall become one shape.

That is the kind of failure that needs to be fixed before pixelation, not after it.

Changing the background, moving the subject away from it, or introducing a little more edge light can do more for the final sprite than adding another sharpening pass.

And this is where lighting becomes particularly useful.

3. Rim Light Is More Useful Than It Looks

One of the easiest ways to make a subject survive aggressive pixelation is to give its edge a little more definition.

A rim light does exactly that.

In photography, rim lighting is the bright edge that appears where light catches the outline of a subject. It is especially useful around hair, shoulders, hats, animals, and other shapes that would otherwise merge into the background.

At full resolution, a thin highlight may seem like a minor lighting detail.

At 64 × 64 pixels, it can become the line that tells the viewer where the subject ends.

You don't necessarily need to add an artificial bright outline. Sometimes simply choosing or preparing a photograph with directional light is enough.

For example, a person standing in front of a bright sky naturally gets a strong silhouette. A darker background behind a sunlit shoulder can create a similar separation.

This is one reason backlit photographs can sometimes produce surprisingly good sprites.

The photograph already contains a useful boundary.

The important thing is not the cinematic look of the lighting. It's the fact that the lighting gives the subject an edge that remains visible after most of the detail has been removed.

4. Don't Just Increase Contrast Everywhere

“Boost the contrast” is common advice for pixel art conversion, but it is easy to overdo.

Global contrast affects the entire image. What you usually need is structural contrast.

Suppose you're converting a portrait.

You might want:

• the hair to remain distinguishable from the background
• the face to remain separate from the hair
• the eyes and mouth to survive as small dark marks
• the shirt to remain separate from the torso and background

You don't necessarily need every part of the photograph to become more contrasty.

If you push everything too far, you can end up with an image containing mostly black and white regions, with very little useful middle ground. Once the palette is reduced to four or sixteen colors, those exaggerated boundaries can become harsh blocks.

A better approach is to ask where contrast actually matters.

For a face, the important contrast may be around the eyes, nose, jaw, and hairline.

For a landscape, it might be the boundary between a mountain and the sky, or the foreground and the horizon.

For an object, it could be the outline plus one or two major planes created by the light.

The goal isn't “more contrast.”

The goal is enough contrast in the places that explain the shape.

5. Highlights Are Expensive

Highlights look great in photographs because photographs have thousands or millions of available colors.

Pixel art doesn't have that luxury.

When you reduce an image to a tiny palette, a small bright highlight has to compete with every other bright region in the frame.

A reflection on a window, a shiny forehead, a white shirt, a cloud, and a bright patch of sky may all end up asking for the same palette entry.

That's when a photograph can start losing its hierarchy.

For a sprite, the brightest value should usually have a reason to exist.

If everything contains highlights, nothing feels highlighted.

This is particularly important when working with a four-shade palette such as the original Game Boy's. With only four available tones, assigning the brightest shade to a tiny reflection may mean taking it away from a much more important part of the subject.

Sometimes removing a highlight from the source image actually makes the final sprite look better.

You're not trying to preserve the photograph exactly.

You're trying to preserve the information that makes the photograph recognizable.

6. Faces Need Special Treatment

Faces are probably the hardest common subject to pixelate.

The problem is scale.

At 32 × 32 pixels, there may only be a handful of pixels available for the entire head. The eyes, nose, mouth, hair, ears, and facial shadows all have to compete for the same space.

This changes how you should choose a source photograph.

A close-up face is usually easier than a full-body portrait because more pixels are available for facial structure.

Front-facing portraits can also be easier to interpret than heavily turned faces, although a strong three-quarter view can work very well when the lighting is clear.

What matters most is that the major planes of the face are visible.

Think in terms of:

rather than individual skin pores, eyelashes, and wrinkles.

Those tiny details are useful at photographic resolution. They usually aren't useful after aggressive downscaling.

If the face depends on those details to remain recognizable, it is probably not ready for pixelation yet.

7. Landscapes Have the Opposite Problem

Landscapes usually contain too much structure rather than too little.

A photograph of a forest might contain thousands of leaves, branches, shadows, highlights, and overlapping shapes.

At high resolution, that's beautiful.

At sprite resolution, it becomes noise.

The trick is to find the large shapes underneath the texture.

A useful landscape might reduce to something like:

FIGURE 7.1 • THE 5 STRUCTURAL PLANES OF A LANDSCAPE

The individual leaves aren't important anymore.

The mountain's shape is.

The distribution of light and dark is.

The horizon is.

A forest can therefore work very well as pixel art if the source photograph has a strong silhouette and clear layers. A highly detailed forest photographed under flat, even lighting can be much harder.

Before pixelating a landscape, try temporarily blurring it.

If the composition still makes sense after the blur, that's usually a good sign.

If everything turns into one indistinguishable mass, reducing the resolution further isn't going to solve the underlying problem.

8. Backgrounds Should Usually Be Simpler Than You Think

One of the easiest mistakes is spending too much effort preserving the background.

The background is often responsible for destroying the subject's silhouette.

A complicated wall, patterned floor, trees, buildings, and people behind the subject can all produce small high-contrast regions. After quantization, those regions become competing blocks.

This is particularly obvious with portraits.

A subject may occupy only 30% of the image while the background occupies the remaining 70%. If the background has as much contrast and texture as the subject, the pixel-art version has no obvious focal point.

You don't necessarily need to remove the background.

Often it's enough to simplify it.

Reduce its contrast. Remove distracting objects. Push it toward one or two broad tones. Let the subject carry the detail.

This is one of those cases where making the image less interesting can make the final sprite more interesting.

9. Downscale Before You Quantize

There is an important order to the process.

Don't reduce the image to four colors first and then make it tiny.

Usually, it is better to establish the target resolution first.

For example:

The reason is simple.

Color quantization performed on a large photograph has to deal with details that will disappear anyway.

Once the image has been reduced to its target resolution, those details have already been merged together. The palette reduction is then working on the shapes that are actually going to appear in the final sprite.

This also makes the result easier to inspect.

If the target is 64 × 64, look at it at 64 × 64.

Don't judge the result while zoomed to 800%.

At that scale, every pixel looks like an important little square.

It isn't.

10. Choose the Target Size Before You Edit the Photo

The amount of preparation you need depends heavily on the final resolution.

A 128 × 128 sprite can preserve quite a lot of facial structure.

At 64 × 64, you start losing smaller features.

At 32 × 32, the image becomes much more dependent on silhouette and large tonal regions.

At 16 × 16, you're barely describing an object at all. You're designing a symbol.

That means the same photograph can be excellent at one size and terrible at another.

For example, a portrait might work like this:

FIGURE 10.1 • RESOLUTION SCALE HIERARCHY

This is why “make it pixel art” isn't really a single operation.

The target resolution determines what information is allowed to survive.

11. A Simple Pre-Pixelation Checklist

Before sending an image through a quantizer, I usually think about five things.

Pixelation is fundamentally a process of throwing information away.

The good results aren't the images that lose the least information. They're the images that lose the right information.

12. The Best Source Image Is Not Necessarily the Best Photograph

This is probably the counterintuitive part.

A technically excellent photograph isn't automatically a good source for pixel art.

A sharp 4K photograph with beautiful texture, subtle gradients, complicated lighting, and a busy background can be extremely difficult to reduce.

A slightly imperfect photograph with a strong silhouette, simple lighting, and obvious subject separation can produce a much better sprite.

That's because pixel art isn't trying to reproduce all the information in the original image.

It is trying to describe the image with a very small vocabulary.

Four shades.

Sixteen colors.

A few thousand pixels.

Once you start thinking about the conversion that way, the preparation process becomes much easier to understand. You're not “improving the photo” in the conventional photographic sense. You're preparing it so that the important shapes remain when almost everything else is gone.

And that's the real trick behind a convincing photo-to-sprite conversion:

don't ask the pixelation algorithm to decide what matters.

Give it an image where the important things are already obvious.