Sprite Guides by JustMe

[JustMe]

since some people did a request to do a sprite-tutorial i start a poll now. my time is limited and i cant make tutorials for everything i do, therefore i may only make 1 tutorial you voted. my guides will be published in this thread if im done with it.

if you dont want a tutorial from me you can vote for no.

Sketching (Click to View)

multiple lightsource (Click to View)

1 basic knowledge and 1 tool we need:

1: shadow
shadow is always present, it can be erased by light, but cant be added.

2: layers
to do this we need layers, if you havent a tool that can create layers then download gimp or paint.NET, they´re freeware!

if you have no experience with layers then learn how to use, its very importent for any people who works with pics on pc.

next we need a pic we want to shade, ofc

i take this one, it has 2 suns which will be our lightsources. it should be separated in 3 layers:
1: char
2: lovely sun
3: bad sun
lovely and bad suns are transparent
we take out lovely sun and shade like normal, after that make the pic half-transparent by using eraser with 50% opacy.
note: make the shading on a separate layer!
same progress again with lovely sun
next we take out the shading and color lighted areas with red
and again with other sun, here also on separate layer!
note: shading layers (blue layers) MUST BE ABOVE the red layers!
now we have 4 colored layers: 2x shading and 2x lighted areas, display them all! you see, because of the half-transparant of blue it become purple. now we need our basic knowledge, it says:
shadow can be erased by light, but cant be added.
the purple areas are made of shadow+light, but we know shadow must be erased by light, therefore we take out any blue areas which overlap with red. if we have done this there will be only red and blue areas, no purple.
red areas: they´re lighted, you should use light color on these areas
blue areas: color it with dark color since its shadow

thats our result.

dynamic posture (Click to View)

before we start to draw a dynamic pose we need knowlegde about anatomy, otherwise it will be difficult. if you have trouble with anatomy make sure you visite my anatomy guide (will be added sometimes later).
besides that i put 3 principles which we should follow (yeah, its physics i always got bad marks, but unfortunately its important for movements)

1: scale principle
it says: if there´s a power which goes forward/up, there also must be an opposing power which goes backward/down.

explain and example (Click to View)

it is needed to keep balance and to make the body rotate. but do i have to regard this? yes because of this:
balanced walking
without balance->char will fall and looks stupid. ofc in game char will not fall, but we all want flawless sprites.
with enough experience at drawing you got a feeling for this, dont be scared.
thats a sprite from Whaat, i´m sure he can draw it without any thoughts of physics.

2: bounce principle
it says: in order to hit hard the hand/foot must go back before it attack.

explain and example (Click to View)

you see, regular chars also regard this. this movement is needed to gather power before the attack hit.

3: rotation principle
it says: more momentum=more power

explain and example (Click to View)

this is an alternate to bounce, but even more disastrous.
for my drawing below i didnt use this, because it can only be showed via animation.

you may ask why i did this, we only want to draw, not to learn physics.
for this i can say:
doing something without knowlegde is stupidly, you learn it 1 time and use it your whole life. treat this as school.


after that we finaly start drawing, i decided to draw a dashing swordattack. at this point we know:
the char have to jump!
first we start with a diagonal line which will be the backbone of the char. the backbone define the posture, therefore very importent. why diagonal and not vertical?
because your upperbody goes forward while you´re dashing.
based on the backbone we draw head, upperbody and hip. nothing difficult till now
now we draw legs. because of principle of scale we know that the leg (opposite of head) must go back if head goes forward
principle of scale also says left leg (opposite of right leg) should go forward in order to keep balance
legs are done, now the right hand. the char hold his sword and is about to slash, therefore we use bounce principle to make his attack strong. to do so we let the right hand go backward.
scale principle: other hand should go forward to keep balance and to prepare a rotation if right hand attacks.


after adding details and correcting some flaws we´re finish.
the 3 principles are imaginary, dont try to google them!

Shading (Click to View)

pants (Click to View)

a short shading guide for pants-fans


these 2 are most common shading, they´re ok, but not good.

NOTE: in order to draw many details as possible never draw big and clumsy shades, instead small but long.


this´s my way to shade pants:

first you shade the dark side with dark blue, but not as big as normal.
next we draw a Z in the middle of the pants.
-> now we concentrate on the red area, in this area we only use horizontal lines and try to match that Z. while shading pants try to draw curves, no straight lines.
->-> in green area we use diagonal lines from down to up till knee and match it to the other shading line.
in following we take spray with very dark blue and about 50-60% opacy to trace the lines, do it many times.
-> the same progress again, but with black from left to right on the same line and with white from right to left. be carefull not to color the shading lines with white.
redo the last prgresses as many times as you like.

if you did it correctly your result should like this.

[The Lost Global Mod]

isn't anatomy also included in making a base? ._.
i personally would like to have a tutorial on how to do bases, that's something i can't get right.

[JustMe]

anatomy: how to draw a well proportioned char
bases: how to draw a moving char

ofc you need to know about anatomy to be able to draw bases.
my coloring technique is also much like shading. i separate the section to the sake of the reader, he dont need to read 1-2 pages until he got something he really want to read.

i expected you guys would vote for shading, since its my best section, instead we have most votes for sketching.

seems we have a spamer again, kusha voted for everything.


@Mod
could you please remove it to tutorials, yesterday i forgot it.

Silverthorn edited this post 06-28-2012 07:00 AM because:

*swoosh* tutorialized

[Marko pro]

Lets go guys, vote for the shading!! ...
What supposed to be coloring that, i think, we all know(use color and start coloring)???

[qwertz143]

yup anatomy tutorial is needed

[JustMe]

Lets go guys, vote for the shading!! ...
What supposed to be coloring that, i think, we all know(use color and start coloring)???

no marko, you can use 2, 3 or more color. hard or light brush, pen or spray, 100% opacy or less. my coloring isnt the same as yours

[Kashif]

all of them

[JustMe]

@Kashif
nobody pays me for this and i didnt start the poll for nothing, actually i already answer your comment in my first post.

first tut:

Sketching (Click to View)

dynamic posture (Click to View)

before we start to draw a dynamic pose we need knowlegde about anatomy, otherwise it will be difficult. if you have trouble with anatomy make sure you visite my anatomy guide (will be added sometimes later).
besides that i put 3 principles which we should follow (yeah, its physics i always got bad marks, but unfortunately its important for movements)

1: scale principle
it says: if there´s a power which goes forward/up, there also must be an opposing power which goes backward/down.

explain and example (Click to View)

it is needed to keep balance and to make the body rotate. but do i have to regard this? yes because of this:
balanced walking
without balance->char will fall and looks stupid. ofc in game char will not fall, but we all want flawless sprites.
with enough experience at drawing you got a feeling for this, dont be scared.
thats a sprite from Whaat, i´m sure he draw it without any thoughts of physics

2: bounce principle
it says: in order to hit hard the hand/foot must go back before it attack.

explain and example (Click to View)

you see, regular chars also regard this. this movement is needed to gather power before the attack hit.

3: rotation principle
it says: more momentum=more power

explain and example (Click to View)

this is an alternate to bounce, but even more disastrous.
for my drawing below i didnt use this, because it can only be showed via animation.

you may ask why i did this because we only want to draw, not to learn physics.
for this i can say:
doing something without knowlegde is stupidly, you learn it 1 time and use it your whole life. treat this as school.


after that we finaly start drawing, i decided to draw a dashing swordattack. at this point we know:
the char have to jump!
first we start with a diagonal line which will be the backbone of the char. the backbone define the posture, therefore very importent. why diagonal and not vertical?
because your upperbody goes forward while you´re dashing.
based on the backbone we draw head, upperbody and hip. nothing difficult till now
now we draw legs. because of principle of scale we know that the leg (opposite of head) must go back if head goes forward
principle of scale also says left leg (opposite of right leg) should go forward in order to keep balance
legs are done, now the right hand. the char hold his sword and is about to slash, therefore we use bounce principle to make his attack strong. to do so we let the right hand go backward.
scale principle: other hand should go forward to keep balance and to prepare a rotation if right hand attacks.


after adding details and correcting some flaws we´re finish.
the 3 principles are imaginary, dont try to google them!

any critics?
anatomy: backbone will be next i think, or shading.

[Marko pro]

That a simple things which i know but i never thinks about it like somethings improtant...You can't see that method in my base:P...Really useful,this is first tutorial which showing us what exactly we need do for base...(this tut showing us why we need draw hand like this or leg or anythings else)-that reassons why you got thanks by me!!

[Whaat]

Oh dog D: i'm in bad examples.
Well yeah, it's totally scratched so not much thinking, only inspiration D: well anyways the sprite sucks D: but could you tell more clearly what's wrong with it? I really don't get it from those lines D: maybe white line means that he has no backbone becouse it's not straight or smthing?