I’m going to be making a bunch more tutorials on specific things such as tiles, metal, trees…So if you want me to create a tutorial on anything from trash cans to ¾ view RPG characters just DC mail me and I’ll make it!

I’ve noticed a lot of bad pixel art on this site. I’ve hardly ever download any games anymore because of poor graphic quality. Its like the graphics were an after thought…Bad mistake, you need to think about what your graphics are going to look like and spend some time on them. You could be the crazy goodest coder on this site but if you’re graphics look terrible then you’ll still screwed.

You need to practice if you want to get better. I did, and in a couple of months my skills had increased %200. I now am going to give a few tips on what I have learned over the past couple of years.

1.Shading:

What I see a lot of is pillow shading. This is an example of pillow shading. DON’T DO THIS…or I will track you down and cut off your clicking finger with this rusty tin can lid.

Here's an example
Image


In this the spriter shaded all edges and did not pick a light source. Its just plain ugly and it leaves the viewer confused and repulsed. It looks as it the light is coming directly form the front…like your eyes are the sunlight shinning on the sprite. This is unrealistic and as a result looks sloppy and unprofessional. You must pick a light source. In this article I will be using the top left corner.

Image
In order avoid pillow shading you need to pick a light source. I usually choose the top left corner. What this means is the sun is shining down on the sprite from the top left and then creating the shadow on the lower right edges of the sprite. The light source will always cast the shadow or shade on the opposite side of the light source. Always use your chosen source and don’t be switching in the middle of the sprite.


Dithering

Dithering is a technique were you use a checkerboard pattern of pixels to blend colors together. If used correctly this can cut down on your color count and look quite slick.
Image
Right here folks, only two colors blended to create a cool effect. It almost looks like your on a beach or something. Now, how does this look on a real sprite…
Image
Look right there. Pretty cool huh. Dithering can be used to make things look more natural…and it just makes things look cool.
Image
This is a log before and after. Dithering can add a lot to a sprite so start doing it!

Contrast

Many times people try to use lots of colors and smoothly transition between light and dark. DON’T DO THIS. Have you ever seen a shadow from something and saw it smoothly transition from dark to light? No, the light is suddenly cut off drawing a fine line between dark and light. When choosing a color palate choose about three colors of a certain shade. Light, medium, dark…if you feel you need more try to use dithering to transition.
Image
Here’s the million-color transition combined with pillow shading. Look at the second tree. It’s vastly better, just from those few techniques. See how there’s only two colors in the top of the tree? It looks a lot better than the first and it has a ton of less colors. DON’T USE TO MANY COLORS.

Anti Aliasing

This technique is another way to blend things and make them looks smoother without using tones of corny colors. The process is that you put light edges on the sharp edges of a black pixel out line. It creates a smoother look.
Image
See how it looks smoother when the sharp black edge is soften by the lighter shades? Of course you do.


2.Outlines

The main thing to making a good sprite is the outline. The outline is like the foundation of a house. If you’ve got a bad house foundation your house stinks…if you’ve go a bad outline you’re sprite stinks.

Basic things to consider, don’t plaster the sprites arms and legs together in a stick looking thing. Here’s an example.
Image
The guy looks fake. Its ugly. In real life you don’t stand like that.

Imagine your guy is angled toward the screen and you can see some of his front. So when he’s walking its like eventually he would come out of the screen. Also, get his arms out from his side and spread his feet apart some.
Image
See, all these guys are angled toward the screen and their arms and legs are spread apart…and I must say, there’re lookin’ good.


3.Highlighting

Highlighting is one of the last things you do on a sprite. It’s basically the opposite of shading. Shading is where you darken were the light doesn’t shine and highlighting is adding a glimmer where the light shines the brightest on a sprite.
Image
See that little round circle of white? That’s a highlight and it makes the sprite look like its really metal.

Highlighting can be useful in creating cool hair as well.
Image
You see that little ring of lighter color around the front of the sprite’s heads? That’s were the lights striking it the most and in turn creates the highlight.
Image
There are some good highlights in these sprites as well. Can you spot them? You just put the lighter shade on the opposite spot of the darker shade.

Conclusion.

Anyways, I hoped this helped in some small way. If you want to get better I would suggest studying other peoples art to learn how to use different techniques and such.

Go here to my site and see some of my stuff www.aphoticpixel.com