• Hey Guest! Ever feel like entering a Game Jam, but the time limit is always too much pressure? We get it... You lead a hectic life and dedicating 3 whole days to make a game just doesn't work for you! So, why not enter the GMC SLOW JAM? Take your time! Kick back and make your game over 4 months! Interested? Then just click here!

Graphics Is this a good way to make pixel art?

aereddia

Member
I'm working on a game with my friend and he is in charge of the art. He's new to pixel art and has a very strange way of making it, but I wanted to know if this process was normal or completely insane. This will be his process for the battle sprites and we'll be using color palettes to show the different enemies.

He's drawing these images by hand and then scanning them into photoshop. I believe he cleans them up at this point because the scanning process doesn't get everything at 100% and sometimes you just have to make some edits. I'm not sure about the order here, but he shrinks them and reduces their color palettes next. This requires some more clean up since shrinking them will blur some pixels and colors. By this time, the image size is somewhere around 200x200 (give or take 50 pixels), and he's got between 20-40 colors for each image. He's done this for 13 sprites already and will probably do this for more.

I normally don't care how the art gets made, but this feels horribly inefficient to me. I know you can work on art however you want and everybody's habits will be different, but does this sound like a good way to you? Am I crazy? Is this how most people do it? Does it matter?

Thanks.
 
He could probably reduce the colours a bit more if that's really an issue for you I guess. If it looks good and his speed isn't holding you up then I don't really see a problem. Finding a workflow that works best for you can be tricky.

The workflow isn't unfamiliar to me, I used to do the same albeit without trying to adjust too much for a pixel art effect.
Right now my workflow has changed a lot. I draw on my android tablet, export and send to my PC to resize slightly, do some touch ups and maybe add effects, and then animate it with Dragonbones if it needs animating.
 

YellowAfterlife

ᴏɴʟɪɴᴇ ᴍᴜʟᴛɪᴘʟᴀʏᴇʀ
Forum Staff
Moderator
If a person is more familiar with drawing on paper, it's okay - I sometimes do similar, except I trace over the lineart in Inkscape. If the resolution was lower, there could be some issues with translating lineart to pixels (as you'd have to do more cleanup for it to read), but at 200x200 may as well
 

Toque

Member
Sometimes there is no quick way when your not quick.

I’m guessing he/ she is comfortable with pen and paper and adapting to digital.

I could see how it might not look right or pixel art.

It’s a skill. It may not be just a workflow issue.

Good pixel art is not as easy as it looks.
 

pixeltroid

Member
He's drawing these images by hand and then scanning them into photoshop. I believe he cleans them up at this point because the scanning process doesn't get everything at 100% and sometimes you just have to make some edits. I'm not sure about the order here, but he shrinks them and reduces their color palettes next. This requires some more clean up since shrinking them will blur some pixels and colors. By this time, the image size is somewhere around 200x200 (give or take 50 pixels), and he's got between 20-40 colors for each image. He's done this for 13 sprites already and will probably do this for more.

I normally don't care how the art gets made, but this feels horribly inefficient to me. I know you can work on art however you want and everybody's habits will be different, but does this sound like a good way to you? Am I crazy? Is this how most people do it? Does it matter?
I get the feeling your friend knows what he's doing.

There's no "one true and correct way" to make pixel art. If it looks like pixel art and looks good, its good. Don't be afraid to experiment. And don't force your art guy to emulate one particular style that is popular.
 

pixeltroid

Member
I think it looks good with the exception of how many different colors there are. When you have 10 different shades of one color in an image it doesn't look like pixel art. It looks like someone took a giant image and shrunk it.
can you post a sample?

A lot of pixel artists use multiple shades of one color to add clarity and depth to the art. Check out the background graphics for street fighter 3. They had multiple shades of a colors and looked realistic and beautifully pixel-art-ish at the same time.
 

aereddia

Member
can you post a sample?

A lot of pixel artists use multiple shades of one color to add clarity and depth to the art. Check out the background graphics for street fighter 3. They had multiple shades of a colors and looked realistic and beautifully pixel-art-ish at the same time.
Sure, maybe you can see what I mean here. There's 31 colors in total and a lot of shades around the thorax and abdomen. It looks good, but it looks like someone took a picture and shrunk it.

Thanks for the replies though. It sounds like it's more common than I thought, and I might be a little crazy about the whole thing.
 

Attachments

pixeltroid

Member
Sure, maybe you can see what I mean here. There's 31 colors in total and a lot of shades around the thorax and abdomen. It looks good, but it looks like someone took a picture and shrunk it.

Thanks for the replies though. It sounds like it's more common than I thought, and I might be a little crazy about the whole thing.
It looks great to my eyes. I cant count 31 colors but its looking professional. I like how the fur on the spiders body is drawn. Don't worry about the art, you are working with a good artist!
 

Rayek

Member
A couple of pointers.
  • I opened the spider in Pro Motion NG, and had the colours mapped to an indexed colour palette. One colour is unused, and should be deleted.
  • Too many shades: for good (pixel) art you want contrasting colour ranges. For example, the red eyes consist of 5(!) colours, which can be reduced to 3 or even 2. I dragged some colours around on top of others in PM, and a number of the colours were hardly used. PM also allows for blackening pixels to see how they are used, which is helpful in identifying them in the image.
  • The colours lack contrast overall. Your artist is too careful - neither here, nor there.
  • Avoid single rogue pixels. These are apparent in two main areas: 1) the black outline, 2) the shading/colouring. Clean this up.
  • The main issues with the colouring: noisy dithered look, lack of contrast in lighting (shadow versus highlights, for example)
  • Dull uninteresting colour choices. Be bolder. Throw in unexpected colours.
  • Black outlines might work, but your artist is advised to look into pixel art outlines do's and don'ts.
  • Pillow shading. The light source seems to be coming from the front. Avoid.
  • Don't try to emulate reality too much - go for contrast. The sternum and coxas, while quite realistic, draw too much attention, and are too detailed/realistic. Rather imply. Don't get lost in detail where it doesn't count. Decide what the focal points of your graphic are. In portrait paintings often the face gets all the detail, and the rest is very, very vague and only implied.
  • Same for the eyes: this is a small graphic. Who cares about realism - more contrast, bigger.
  • add more interesting visual detail. The legs are too vague, add segment detail. Go bold again. Make those legs more threatening, add spikey details.
  • Abdomen is too realistically dimensionated: scale it up a bit for a more interesting outline.
Here is a quick overpainting done in Pro Motion. I normalized the colour palette, added more contrasting shades, reduced the colour palette, moved some colours, and just made it a bit more contrast rich. Then opened it in PhotoLine, to change the abdomen's size and rotated a bit, adjusted the colour of the abdomen.

As far as colour palettes go: might not look like it, but mine uses less colours than the original. It's about effective use rather than the number of shades.

My version is by no means a finished one, btw. It needs cleaning up, and it's very, very rough. I would probably change the overall pose as well, and the mandibles need work. With the proper art program this spider could easily be segmented and posed differently, and animated quickly.

Anyway, as far as process goes: I always start on paper and do rough thumbnails first to get a good initial pose and idea (often more than twenty, or so, depending on the subject). Then I pick a couple of the better ones to investigate further and draw more detailed ones. I then pick the most interesting one or two, and scan the sketches. I use those as a background template in an art app. For pixel art I tend to work in Pro Motion NG, or use Krita to paint a larger version with more detail (even a polished version), and then bring it in PM for adjustments. Or not :) Depending on the style and resolution I may do the entire thing in Pro Motion.

PS I would suggest to your artist to adopt a slightly more digital workflow. Learn one pixel art app, and one good digital painting app (Pro Motion NG and Krita are my weapons of choice). When doing pixel art, work at the intended resolution (in most cases).



 

aereddia

Member
A couple of pointers.
  • I opened the spider in Pro Motion NG, and had the colours mapped to an indexed colour palette. One colour is unused, and should be deleted.
  • Too many shades: for good (pixel) art you want contrasting colour ranges. For example, the red eyes consist of 5(!) colours, which can be reduced to 3 or even 2. I dragged some colours around on top of others in PM, and a number of the colours were hardly used. PM also allows for blackening pixels to see how they are used, which is helpful in identifying them in the image.
  • The colours lack contrast overall. Your artist is too careful - neither here, nor there.
  • Avoid single rogue pixels. These are apparent in two main areas: 1) the black outline, 2) the shading/colouring. Clean this up.
  • The main issues with the colouring: noisy dithered look, lack of contrast in lighting (shadow versus highlights, for example)
  • Dull uninteresting colour choices. Be bolder. Throw in unexpected colours.
  • Black outlines might work, but your artist is advised to look into pixel art outlines do's and don'ts.
  • Pillow shading. The light source seems to be coming from the front. Avoid.
  • Don't try to emulate reality too much - go for contrast. The sternum and coxas, while quite realistic, draw too much attention, and are too detailed/realistic. Rather imply. Don't get lost in detail where it doesn't count. Decide what the focal points of your graphic are. In portrait paintings often the face gets all the detail, and the rest is very, very vague and only implied.
  • Same for the eyes: this is a small graphic. Who cares about realism - more contrast, bigger.
  • add more interesting visual detail. The legs are too vague, add segment detail. Go bold again. Make those legs more threatening, add spikey details.
  • Abdomen is too realistically dimensionated: scale it up a bit for a more interesting outline.
This is all great feedback, and your redesigns look fantastic. I might show him this in the future because it's just too good.

It's about effective use rather than the number of shades.
That another great point. I never thought about it that way, but that describes color in pixel art perfectly.


We're both still relatively new to making games and I suppose we both have a lot to learn about working effectively. I'm not gonna lie, it still seems odd to scan in hand-drawn images to a computer, but I guess that's just what works for a lot of artists. If that's how the sausage gets drawn, then so be it.
 

Niels

Member
The way the spider is drawn makes me wonder why you aim for pixelart at all, your artist is more comfortable with drawing, so why not go that way?
 

aereddia

Member
The way the spider is drawn makes me wonder why you aim for pixelart at all, your artist is more comfortable with drawing, so why not go that way?
We need these images to be palette swapped for different enemies. We're using Pixelated Pope's palette swap shader and I need an exact color match to swap any colors. That means he has to simplify the colors, but I suppose you could also do that in vector art. I'm also blowing these images up by a factor of 2, which I believe is frowned upon for vector art. He actually wanted to go for vector art, but the rest of the game is in pixel art and I think the two styles would clash if you put them right next to each other.
 

Niels

Member
Pixel and vector art don't mix together, but there is nothing keeping your from going full vector art
 

kburkhart84

Firehammer Games
I'm understanding that is is actually somewhat common for artists to use paper and then scan things in, especially for "big" pixel art like this. If you were working maybe 32x32 or smaller then it would be a waste of time in my opinion, but once you get 64x64 and up that's a lot so using paper to save on drawing time makes sense. The issue here is more about the cleanup than the actual process. If you want the style to end up more "contrasty" like someone redid the spider for you above, you have to make that happen as part of the color selection and cleanup phase. One thing that could be done is the creation of a palette, with a limited amount of each hue. Then, in the cleanup, you have to choose only from those colors. And then the amount of contrast is determined by the palette.
 
Top