I wrote this tutorial to help explain
how I make low-res
characters from scanned art that I drew. If
you don't know much about photoshop, try
reading my background art tutorial
to at least get a
sense of what tools I'll be using them and how I use them.
So, shall we begin?
the sketch I'll be using. It's just a little alien guy I used
to draw all the time, and he was supposed to be the main character
to my first game [backgrounds can be seen here].
So I drew him and scanned
What I'm going to be doing
with him is resizing him to fit into a 320x200 environment.
Cause right now he is MUCH bigger than that. The first thing
I do [mostly because he isn't inked and the pencil lines might
get lost in the reduction] is darken those lines. So I make
a new adjustment layer and select curves.
So I just dragged the lower
node to the center and it darkened the pencil lines. Now that
I can see it a little better, let's get ready to resize it...
all darkned now
thing I do to make sure the proportion of my character is
right is, I load up a background that I have already drawn
for the game or I draw one quickly. Personally I like to work
with a background that has a door in it. Mostly because I
think that a character that looks wrong next to a door is
one of the worst things in a game.
so we have our quick and ugly background. Now, I'll flatten
the alien image and then copy and paste it onto a new layer
in the background image.
It's quite big no? So hit
CTRL + T and while holding shift, size the image till
the whole thing fits in the background canvas. REMEMBER TO
Then drag the shrunken
image onto the door and gauge the character's height against
the door. When you're pleased with his height, hit enter...
There we go, now we have an
awfully blurry but appropriately sized image. We can now go
ahead and copy the newly shrunken image over to a new canvas
and get rid of the background, it really serves no further purpose.
Since the image is so
blurry some people may not be able to remember what their
original image looked like, so if this is the case, just
open your original image up and use it as a non blurry reference
while the blurry one will act as a guide. No worries.
a new layer and put it above your outline. Choose the pencil
tool and begin to trace. I'm using red because if I used black,
the line might get lost in the original image and I'd mess
up or not be able to see my traced line so well. So I'd suggest
using another colour for the outline and then just changing
Ok, so I went around my
character with the red, getting all the important parts and
trying to keep the original pose and all that of the line
I think he looks good even
though he doesn't look exactly like my pencil drawing... But
that's ok, he's a sprite now, not a sketchbook drawing.
So now that he's outlined,
we can start colouring.
outline layer to Preserve Transparency and draw over
the outline with some colour, here I made his skin grey and
his clothes green.
Then make another layer
and choose the flood fill tool [or press k] and with anti-alias
turned OFF! and with use all layers turned on, I flood filled
in the clothes and skin.
The reason I put the colour
on a separate layer will make sense when it comes to shading.
I didn't like how some
of the pixels looked so I went back and changed them just
to make it more pleasing to me and to help get his pose better
I flattened his head, fattened
his right arm and changed the shoulder on the right arm also.
This, to me, is better.
So, let's shade this mofo.
To shade I make a brightness/contrast
new adjustment layer and place it between the outline and
the colour, so that the outline is on top of the brightness/contrast
layer and the colour is beneath it.
This way, when shading
I won't accidentally change the colour of the outline.
Now, just like in the background
tutorial, I just start cutting light areas out of the colour.
I did my lightest lights first.
Then I added
some wrinkles to the knees and took out the dark lines in
the middle of the chest. I think it is best if the shadow
defines his form and not outline. I also added to the face,
giving him more of a character.
I also thinks it's good
to not shade the face of your character too much, leave a
lot of light on it because that is the face we are going to
be playing, so I personally want to see what it looks like.
Now, choosing a lighter
grey and drawing on the brightness/contrast layer, I go back
in and add my second layer of shadow.
I'm only going to have
3 levels of shadow on this guy, dark, middle and light tones.
Knowing where to place
these shadows isn't really what I'm teaching here [and I'm
not an expert on it anyway] so just look around you at light
and shadow and always remember that light usually comes from
1 direction more than the other. So try and have 1 side of
the character darker than the other. This really helps to
define form and give the character weight.
he is an army official, I'm added his medals and random shiny
things on his costume.
I just opened up another
layer and drew the colours on it. No big deal.
I didn't like how dark
the outline was around the character so I lightened it up
a little. On both his head and his body.
Now, the outline is where
we will focus next. We very well could just leave the image
the way it is and it would be just fine I think.
But I want to play around
with it a little bit more and try and add some detail to his
going to do is take a darker colour green and [with preserve
transparency ticked on] draw darker colours on the left side
of the image.
Then I did the same thing
with the grey of the hands and head. It isn't that noticeable
really, but I think for the minor bit of effort, it looks
All that was really left
was too test the character against a couple of colours and
see if he looked ok. I used the primaries and then an odd
purple just to make sure.
I think he looks ok except
for the fact that his head kind of looks weird against the
blue and the purple.
So just as another test
I used a much darker bit of grey to completely outline the
head and hands. This really makes his head stand out but it
also detracts from the green in some cases.
I dunno, it's up to you
how you want it to look.
And keep in mind that in
the upper colour bar test, not many games have large areas
of flat colour like that, so there probably won't be a problem
with the head getting lost in the background.
we have it. A complete character shot drawn from a scanned
pencil image. It isn't hard at all really, once you get the
hang of it. Total colours used, 14.
I hope this helps...