Pixeling made easy (quick GIMP technique)

OK, I am in no way a pixel artist (or not yet at least), in fact, the aircraft I make in this tutorial is my first ever pixel project.

So I wanted to make a decent looking aircraft, with a big rocket jet at the back.
And I made this in about 10 minutes with no prior pixel experience :

Actual size :
Ok, not absolutely awesome, but still,  I think it looks decent enough.

So here's how to do it (this works in GIMP, but it may also work in other programs that support layers and transparency) :

Step one, basic shapes :

Just make the general shape of your object with simple colors, no shading, no nothing, like this :


Step two, new layer :

Use the Layer window/dock to create a new layer.

To do this click the button in the bottom left-hand corner, and select transparency as "Layer Fill Type".

Step three, shading

Use the pencil tool, with a low opacity setting (I used 12%). Pencil in black for shadows and white for highlights, on the new layer.

Here are what my Pencil settings look like :


Notice the two selected colors are black and white, I just have to switch between the two to lighten or darken areas.

Here's what the shading layer looks like when layered above a blue background :


As you can see, the lighting layer is what provides the depth and form to the image, the basic shapes layer just gives color.

I find this technique a lot more user friendly than the technique I see in other tutorials, where you select the color of each pixel manually. The downside to this one is it won't work with pallettised systems unless you pallettise the image in post-processing, which can technically screw everything up

Here are three indexed versions of the picture, 32 colors, 16 colors and 8 colors.

32 colors is largely acceptable, but given the small amount of hues (4), this isn't surprising.
16 colors loses a little detail, but the quality is still acceptable.
8 colors loses practically all detail, and it could probably be done better by hand-picking 8 colors and doing it the "proper" way.


I hope this tutorial gets you all pixeling, have fun.

If you have anything to add or you have other nice noob-friendly techniques, post away.

Now this is cool.

Could you show us a not-zoomed-in version of the aircraft?

Now this is cool.

Could you show us a not-zoomed-in version of the aircraft?

Sure...

From 4 colors to 32 is way to much.
This is only 16 colors
But it looks like it could be over a houndred. Thats like one of the things with pixeling, you use as little
colors as possible.

Thats not even pixeling. But its nice, I might try it.

From 4 colors to 32 is way to much.
This is only 16 colors
But it looks like it could be over a houndred. Thats like one of the things with pixeling, you use as little
colors as possible.

Thats not even pixeling. But its nice, I might try it.

Yeah, my technique isn't that good for pixel art, but it's useful for making game sprites.

This is only 16 colors

That picture is AMAZING. Cool sprite by the way.

Made with Potatoshop CS2 with the same technique...

I will probably use this sprite in Pixelpart, and if I do, I'll credit Gaeel in the Thanks To section for teaching us that awesome technique.

Made with Potatoshop CS2 with the same technique...

I will probably use this sprite in Pixelpart, and if I do, I'll credit Gaeel in the Thanks To section for teaching us that awesome technique.

You don't need to credit me, I just showed you a quick technique.

Quote from: youffle214 on June 02, 2009, 18:59:28

Made with Potatoshop CS2 with the same technique...

I will probably use this sprite in Pixelpart, and if I do, I'll credit Gaeel in the Thanks To section for teaching us that awesome technique.

You don't need to credit me, I just showed you a quick technique.

Thanks for the technique, im a user of Gimp and this will help in the future 

For the record, this same method is still very possible with Paint.net.... recordly-speaking.

For the record, this same method is still very possible with Paint.net.... recordly-speaking.

That's why I wrote : "this works in GIMP, but it may also work in other programs that support layers and transparency"

I screenshotted the menus and tools for the GIMP though, if you have similar screenshots for Paint.NET I can post them in the tutorial so new users can follow, or you can write a Paint.NET specific tutorial.

If this happens, I will remove the (quick GIMP technique) part from the thread title.

Note that this goes for other graphics suites, like Photoshop and Paint Shop Pro, if people own these programs and want to write up a quick tutorial, or send me some screenshots of relevant menus, then it could possibly help more users.

This technique should work in pretty much anything that supports layers and transparency, both of which are pretty basic and are included in most graphic editors out there.

Alright! Now I'm gonna be able to make some custom objects for my level that don't look like crud!