Tutorial on Character Design and Animation Types (WIP)

In this small tutorial i give some tips and hinds i learned in art school so you may improve your workflow and dont do mistakes that i did. also i will talk about different ways of animation and how to get your personal best result.

first you have an idea. you decided it shall be an adventure game so you came to this or any other engine suitable for your purpouse.

but what is an idea without the pictures to imagine it.
Lets say you have a character. you can draw, at least a bit. you got at least pen and paper.
what you now need is a charactersheet. in this you dont only draw your character itself but also different types of mimics and so on. haircut, costumes... if you do this keep in mind you alllways should design the view directions of your character. like front, side , back. i for myself do the in betweeners too so if front is 0 side is 90 and back is 180 i do 45 and 135 too. but this option looks best handdrawn so i would skip it with flash.
remember when you create your character: Make it easy to animate!
If you do pixelart or handdrawn its horrible to do the super detail on the dress over and over again.
or you make a octopus hero and you need to animate 8 arms every frame. it sucks and takes time. tons of it!
so keep it simple! make it symetric so you can mirror the image in the end.
also check if the face is actually possible to turn (see link below)
consider if there are any costume changes needed during the game. perhaps you should draw a bare figure of your hero. in this way you can apply hair and costume changes when ever you want.

Also i like to encourage you to watch and download some bare animations from something like disney or games like darkstalker, broken sword and so on!!!
just to watch them and try to redraw. analyse and learn. animation is a high art and the difference between flash and handdrwan is sometime massive!
so when you decided flash or handdrawn consider the thing below:
what will your framerate be? normal films are 24frames a second. animes for TV are sometimes only 18 Frames per second. i usually go down to 12 frames per second. it saves me half the frames i need.
just a little math to illustrate:

24 frames per second means 1,440 frames per minute!!!
so 12 frames per second `only` 720 frames per minute!!!

the maths is a little glimpse to what you load on your shoulders if you consider a super smooth 24 fps walkcycle. you have to do it on all of you character animations through out the game. or it will look akward.

here we come to the huge backlash of traditional animation. while in flash you can transform and move the different parts of the body in traditional means you animate everything from scrap. it looks more alive and better but it aint fast! no i think you could do 10 games just in flash while in traditional you would still sit there and draw you main character...
but handrawn is sooo beautiful!!!
Also there is an option to the traditional animation. It is called Rotoscopic animation and was used in the last express. also there it was used in a more movie like sort of way.
in the lnks i posted some of my trys in this direction. they where made with photoshop. any camera that gives you the needed size of the end picture will do. it took me less then an hour to put it together and there are sooo many possibilitys!

well next is your consideration of the program you work with. i for myself work with photoshop and consider some little assets in game will be made with flash. just to save me time. but here are is free software outhere too!
Gimp for example. What you need is multilayer. so you can make seperat assets of the body.
Also y tablet is a nice and good investment. wacom does good once and the pen and touch would just do.

Well now its your turn. hope i was of some help. If you got more questions leave comment and i will try to answer it.
I also will update this thread now and then so revisit migth pay for you.

have fun!

here is another interesting gif to watch. it is from broken sword. note that the head is allways the same. so you bet its copy pasted.
remember? keep it simple. why should you allways redraw the head if it doesn`t change?
So for the head in a walkcycle you allways can state: seperat layer for head.
Also i found broken sword directors cut hd interesting regarding it mixture of flash and traditional animation types. it was so compeling that i even considered the developers choice as new way of my own workflow.
some shots of face in dialog and so on are flash. other animations are traditional. blended together. I also sense some rotoscopic works on the charactermodel here... just watch the body. it realistic. could be a women and they cut nico head in. if you ain´t good at drawing or not good enough for animation yet. this is a nice and quick way to give the player a wow feeling.
the magic works!
and it saves you loads of time!

but what if you make it like a film and put an actor infront of cardboard with markings on them. later you draw a cockpit of an airplane or an space shuttle in the background. here the real possibilitys start! you could dress your rotoscopic character like i.e. han solo. no costumes required. just do it digital. put in some props for the blaster or so and in the background pic you put the deathstar.

just the available realism on the animations would make your game stick out of the mass!

also i added a video for auto-rotoscoping. for the lazys out there...

Don't forget there are loads of programs out there that allow artists / animators to use sprite parts to generate animations. Sprite part animations allow parts of animations to be recycled for multiple animations by using 2d bones / joints, key frames & meshes to update the position / rotation of sprite parts & for warping parts in case of meshes.

They are most useful for side-scrolling games, such as platformers & games that tend to scroll sideways only. Front / back walk cycles are not so easy to create with sprite parts, but I suppose they may be a bit more possible these days to a degree, when done in combination with warp meshes.

Anyway. Nice little post.

P.S: by the way. The amount of frames & fps & all that is somewhat irrelevant. Typical animation should consist of something like 4 to 32 frames, depending on the animation / situation. Also there is no reason at all for duplicated frames for getting the timing right, as VS allows you to define custom pause values between each frame as opposed to a global value - of course you can use a global value instead, but manually defining pause values for frames can save a lot of vram & hd space, seeing as it's not having to load as many frames for each animation.

thanks for the input. as you maybe have guessed i am a traditional hand drawn type. so i have to admit i can´t contribute anything to the 2d bone animation program section.
the fps was more a hint to all those considering hand drawn or roto as their style for the game. allthough i think, sometimes i think/write around things to complicated. fps only matters when you think about doing handrawn animation and the smoothness of the animation itself bothers you. the maths was a little glimpse to what you load on your sholders if you consider a super smooth 24 fps walkcycle. you have to do it on all of you character animations through out the game. or it will look akward.

i will resume this tutourial soon.

happy easter

Walkcycle comparison

below i post two links for those who consider handrawn animation.
it compares 4 frame vs 8 frame and gives an idea how the drawn base figure could be build up.

it all hush hush drawn but i work on other stuff too. so forgive my clumsy drawing.

i also add a link to the trailer of the whispered world. please watch the animations of the characters! you will note that they are animated with 12 or 18 frames a second maybe even less. but still it is an absolute awesome game and an incredible style!
NOTE: even companys like deadelic have to make a cut with the animation frames. especially when the characters are so detailed in their costumes. because you want to release in the end... and you are not studio ghibli.
So for your handrawn animation it would do with 8 frames per walkcycle or move. when you got an symetrical character you can mirror everything and call it a day.
work with the limitations that you (time) have and make it a winning situation. simplify your character but give it a individual touch. it must be unique in your game (just imagine what an embarasment it would be to have other npc that would look just the same and you mistake them for the main char).
think about the pain every belt or knob on the shirt will cause you when you have to animate them for 4 different walkcycles, 4 picking up animation, 4 use animations. that would be 96 times you draw that damn belt...