Sprite pixelling
Neil Black

I'm looking for a good tutorial on drawing 32x32 and 64x64 sprites. I've got one on 16x16 but they aren't big enough, and they're so deformed because of the small size that making bigger sprites like those would just look bad. Does anyone know where there are some good tutorials? I'm trying google, but haven't found anything so far.

X-G

Just practice. Take what you know and make it bigger.

Archon

You should invest time in drawing software like The GIMP so you can use its drawing tools to get the effects that you want.

I wouldn't suggest that you just draw pixels with the cursor. You can get nice sprites and effects when you mix blending and blurring and manipulating colour gradients (for example).

And to get good at doing it... a book wont make you good -- practice would.

Johan Peitz
Neil Black

Al I have for software is Paint, and I'm not likely to be getting anything else anytime soon. But I need some sprites before I can do any more coding. I don't know, are there any good freeware programs I could use?

But even if I had the right software and knew how to use it, I don't know what a sprite of that size should look like. Are there any games I could look at that use those sizes?

kentl

The Gimp is free and so is Paint.NET

Rampage

But you should never use The Gimp.

Dennis

I second what X-G and Johan Peitz said.

The Gimp is overkill for pixel pushing. Paint or anything similar is good enough for small sprites.

Archon said:

I wouldn't suggest that you just draw pixels with the cursor.

I would suggest just that. Draw your basic shape and then refine each pixel individually. Push those squares around until you're satisfied with the result or until you're sick of pushing them.

Archon said:

You can get nice sprites and effects when you mix blending and blurring and manipulating colour gradients (for example).

Eeeww, blending, blurring and gradients are evil. All they will do is make your sprites look ugly, mushy and undefined, unidentifiable...I could go on forever. Stay away from any of those "effects" when doing your pixelling. Place each pixel by hand and always evaluate whether that particular pixel adds anything to the definition of the sprite, if not, remove it.

On the original question:
One possible way is to stretch the 16x16 sprite that you already have to 32x32 and then refine it. Add more definition to the shape, colors and details. Make it smooth, remove unpleasant pixels, add pixels until it looks like the thing you envisioned.

Possumdude0 said:

But I need some sprites before I can do any more coding. I don't know, are there any good freeware programs I could use?

There is nothing wrong about using (ugly) placeholders until you get better sprites. Check the links that Mr. Peitz gave to you. Be prepared to find out that no tool in the world will automatically make your sprites better though: Practice, practice, practice.

Possumdude0 said:

But even if I had the right software and knew how to use it, I don't know what a sprite of that size should look like.

It should look like the thing that you have in your mind for it. It helps to write down a detailed description of the item/person/whatever in textform before moving on to actually drawing/pixelling it. Also make a very rough sketched version first, check if it comes close to your imagination and add and remove detail appropriately. And as this can't be stressed enough: Practice, practice, practice.8-)

Paul whoknows
Quote:

Eeeww, blending, blurring and gradients are evil. All they will do is make you're sprites look ugly, mushy and undefined, unidentifiable...I could go on forever.

I disagree! they are powerful tools for artists, however they are not so powerful for untalented people.
You have basically two ways, the old-school(see Johan's link), and the new way, using basically Photoshop(or the Gimp or any other similar tool), if you use the latter you only need to downsize your graphics to 32x32(or whatever) and let the antialiasing do the hard work!, and if you are using color palletes you have options to limit the amount of colors.
What tools are you using?

OICW

Paul: that antialising at the edges of sprites is nasty when blitting them without alpha channel.

Trent Gamblin
Dennis said:

The Gimp is overkill for pixel pushing. Paint or anything similar is good enough for small sprites.

I can't imagine drawing lots of sprites in Paint.. Something like The Gimp that has a large toolbox and lots of filters is what I recommend (although the filters aren't as important as the tools when it comes to pixel art). Using Paint gets very tedious very fast IMO.

[edit]

Then again, my pixeling sucks, and people have drawn the Mona Lisa in Paint, so forget everything I just said. ;)

kentl

For such small sprites as 32x32 and 64x64 what would the filters actually be useful for? Isn't those sizes about getting gritty and pixeling everything yourself if you want a good result?

TeamTerradactyl

I would have to second (or third?) Paint.NET (not just "Microsoft Paint").

Others have suggested Gimp, which is alright if you're a bit heavier into graphics. However, for simple designs, I would go with PdN (Paint.NET) if you use Windows, since it is very simple, and all the plugins (for special effects or abilities to import/export to different file formats like PCX, etc.) are open-source and available from their forums.

My new favorite is using the layers ability. I don't think I ever really understood how to use them efficiently until I saw how the artist for Ctrl-Alt-Del was turning them on/off, moving them around, shading things with them, etc. He shows how he did a few holiday cartoons here.

So I would suggest that, taking your 16x16 pixel, stretching it to 32x32 or 64x64, and then tweaking it with blending, filters, and stuff (using layers, of course, so you don't mess up a bunch of stuff :) ).

Edward Sheets

Don't forget Tile Studio: http://tilestudio.sourceforge.net/

It's really good for pixeling sprites and animation. And it's free...

Paul whoknows
Quote:

that antialising at the edges of sprites is nasty when blitting them without alpha channel.

The originator of this thread did not specify if he/she/it was interested in a particularly aesthetic look.
Is there a powerful reason not to use alpha sprites?
However, for an old-school look, obviously we should avoid sprites with alpha channel.

Dennis
Paul whoknows said:

[quote I]
Eeeww, blending, blurring and gradients are evil. All they will do is make you're sprites look ugly, mushy and undefined, unidentifiable...I could go on forever.

I disagree! they are powerful tools for artists, however they are not so powerful for untalented people.
</quote>If we were not talking about pixelling here, I would agree to some extend. Well maybe I shouldn't have generalized that much. (..are evil(to me, from my experience just don't work for sprites)).

Paul whoknows said:

What tools are you using?

and

Trent Gamblin said:

I can't imagine drawing lots of sprites in Paint.. [..] Using Paint gets very tedious very fast IMO.

I'm using Cloanto's Personal Paint under Amiga Emulation(see attached screenshot) for all my pixelling/spriting work. Yes, for a lot of spriting, using just (ms)Paint gets indeed tedious but that's just because it lacks some of the convenience features, mainly palettes, a magnifying glass with more than 2x zoom and a 1x preview that stays on screen while in zoom mode, not because it lacks any of the basic functionality(placing pixels) needed for pixelling.

I said:

Practice, practice, practice.

Start listening to your own advice man!

Paul whoknows

Hey Dennis! I was looking to your art! really good works! it seems that you are very experimented pixel artist!
I have some old pixel works done, but now I find 3d modeling + sprites pre-renderization faster than doing pixel art, believe it or not.

OICW

Well I for one want to commit a suicide if I imagine what amount of work should it take till I done some bigger picture pixel per pixel. I just know how long it took me to do the graphics for my CH2005 entry.

Trent Gamblin
kentl said:

For such small sprites as 32x32 and 64x64 what would the filters actually be useful for? Isn't those sizes about getting gritty and pixeling everything yourself if you want a good result?

In most cases yes, but sometimes filters and effects can be useful. For example, say you wanted to change the tint of your sprite from green to red as a variation or you just didn't like the green. The only way to do it in MS Paint and some other programs is replacing every pixel.

Dennis said:

Yes, for a lot of spriting, using just (ms)Paint gets indeed tedious but that's just because it lacks some of the convenience features, mainly palettes, a magnifying glass with more than 2x zoom and a 1x preview that stays on screen while in zoom mode, not because it lacks any of the basic functionality(placing pixels) needed for pixelling.

Yes, those are the biggest features missing from MS Paint. I also like have quick and easy cut tools and flipping/rotating tools as well.

Zaphos

Er, not that I'd recommend it particularly, but mspaint does have an up-to-8x zoom and cut tools and flipping/rotating tools ...

edit:

Quote:

The only way to do it in MS Paint and some other programs is replacing every pixel.

If you did want to change color schemes in paint, it'd be useful to know that you can color swap by right clicking with the eraser tool. It'll replace anything under the cursor that's the foreground color with the background color ... or maybe vice versa (I forget which).

Dennis
Paul whoknows said:

Hey Dennis! I was looking to your art! really good works! it seems that you are very experimented pixel artist!

Thanks, I guess.
[grammar nazi mode]
"experimented"?(for the following I assume you meant experienced, but I'll continue using experimented, 'cause I think it's funny) Yes, I got experimented a bit but not very much, mainly because of a lack of time(yah, I know this excuse is getting more and more lame the more often it is given).
[/grammar nazi mode]
If I got a dollar everytime I heard someone say that my works are good, I'd already have accumulated about 20 dollars over the past few years(which actually is quite the hint that I'm really just an amateur and not as good as thousands of real artists out there).:P

Paul whoknows said:

I have some old pixel works done..

Do you still have them? May I see them? (maybe I could learn something from looking at them)

OICW said:

Well I for one want to commit a suicide if I imagine what amount of work should it take till I done some bigger picture pixel per pixel.

That's the spirit!;D

Trent Gamblin said:

Yes, those are the biggest features missing from MS Paint. I also like have quick and easy cut tools and flipping/rotating tools as well.

Hm, I just looked again and I was wrong, it does support a 1x preview window while in zoom mode and as Zaphos pointed out, it also has up to 800% zoom. The cut and paste features are poor though, as they don't support transparent cuts (which I (ab)use a lot for spriting).

OICW

Dennis: well I admire pixel artists, I just know that I don't have patience and skill to do it. I can draw outline of the object but when it comes to shading it and giving it details I don't have the right feeling for it. Well when drawing with pencil I have some skill but when it comes to pixeling... So that's why I'd rather commit a suicide than drawing the picture your avatar is taken from.

23yrold3yrold

MSPaint is win at least for the rough stuff. Shading and gradients and such can be done in other programs. I use Photoshop Elements since it came with my tablet.

PS: Nice links Johan.

aadfo824

IRT OICW:

Stick figures all the way!

FuriousOrange

I find Paint Shop Pro 5 good for spriting as it doesn't go over kill on all the additional features. This link is pretty good for bigger sprites (64 x 64 being possibly the lower limit of how effective it might be). As everyone else has said the best way to get good at 32 x 32 sprites is to draw loads and loads of them, same with everything else I guess.

Johan Halmén
Quote:

But you should never use The Gimp.

I use Gimp, but I don't recommend it. It's only for the 1337. Seriously, I really wouldn't recommend it only because I like it. Too many hate it.

Neil Black

I did some messing around with MS Paint on Sunday, and got some alright results for my first try. But as other have pointed out it gets tedious. For me it got tedious at about the third 32x32 sprite. I really, really don't like pixelling, but I'm the only one who can do it for me, so I'll have to suffer through. Attached are the three frames I did for one sprite, and here is some code I made to look at how it animates

1#include <allegro.h>
2 
3BITMAP* buffer;
4 
5BITMAP* Hero;
6 
7 
8 
9int Frames;
10 
11void Draw_Stuff(){
12 clear_to_color(buffer, makecol(0, 0, 0));
13
14 if(Frames == 1){
15 masked_blit(Hero, buffer, 32, 0, 100, 100, 32, 32);
16 }
17 if(Frames == 2){
18 masked_blit(Hero, buffer, 0, 0, 100, 100, 32, 32);
19 }
20 if(Frames == 3){
21 masked_blit(Hero, buffer, 32, 0, 100, 100, 32, 32);
22 }
23 if(Frames == 2){
24 masked_blit(Hero, buffer, 64, 0, 100, 100, 32, 32);
25 }
26 blit(buffer, screen, 0, 0, 0, 0, 640, 480);
27
28}
29
30 
31 
32 
33 
34int main(){
35 
36 allegro_init();
37 install_keyboard();
38 set_color_depth(16);
39 set_gfx_mode( GFX_AUTODETECT, 640, 480, 0, 0);
40
41 Frames = 1;
42
43 buffer = create_bitmap(640, 480);
44 Hero = load_bitmap( "Characters/Hero.bmp", NULL);
45
46 while(!key[KEY_ESC]){
47
48 Frames++;
49 if(Frames > 4) Frames = 1;
50
51 Draw_Stuff();
52
53 rest(100);
54 }
55}
56END_OF_MAIN()

For some reason the pixels from the previous frame are still visible when the next frame is drawn, despite the clear_to_color(), and I don't understand this. It's also a crappy-looking thing, but I understand that I need practice. Note: the code looks for the Hero bitmap in a file named Characters, just saying that so no one says it won't load because they didn't look at the code ;)

EDIT: Crap, there's some attached code as well, but it isn't the right code, and I can't seem to remove it.

OICW

Well at first you could try draw_sprite. Then you should see whether there are some artifacts in the sprite itself - ussualy at the edges if the sprite. Sometimes when using tools which generate smooth lines (antialiased) magic pink gets other mixed with some alpha pixels and when saved produces different color.

Sirocco
Quote:

I use Gimp, but I don't recommend it. It's only for the 1337. Seriously, I really wouldn't recommend it only because I like it. Too many hate it.

Gimp and Photoshop are great for what they are made for: photo editing. Pixeling is something completely different and they aren't geared toward that, so there are more efficient tools I'd look at before resorting to either of those.

James Stanley

'So you want to be a pixel artist?' is another good tutorial about drawing. It's mirrored all over the place and half of them are down most of the time. Just Google for it...

Rampage
Quote:

'So you want to be a pixel artist?' is another good tutorial about drawing.

Is that the one from Tsugumo? That's the best I've seen.

23yrold3yrold
Quote:

Is that the one from Tsugumo?

Yup.

Dennis

Here's the most recent version of Tsugumo's Tutorial series.

23yrold3yrold

Oh wow, cool. I thought he stopped writing that ages ago.

Dennis

Yes, basically that's what he did but apparantly he came back to it at the beginning of this year.

Trezker

ZOMG!!!!

Tsugumo continuation! People working on Allegro 5!

Is hell freezing too?

Paul Pridham

For pixel art, use Graphics Gale: http://www.humanbalance.net/gale/us/

Animation, layers, sprite sheets, colour replacement, etc.

Thread #591135. Printed from Allegro.cc