TIPS: creating characters using layer body parts

[Slasher]

I'm looking for tips on creating characters using layer body parts.

I am currently using this method but would like to improve.

If you have any hot tips I would like to hear them.

Thanks

[Khris]

Why don't you post what you have so far? That way your thread actually belongs here (your post should've gone here: tech stickie)  and b) give us something to work with.
On the other hand, I'm not sure what kind of advice you're looking for. The only advice I can think of right now is using a paint program that supports grouping layers.

[Slasher]

I am using Paint shop pro (7) to handle the layers.

Once the layers are done, merge layers, copy, paste into ags. Return to paint program, Undo merge layers so it shows all layers separately again.

The rotation of parts is a bind cleaning up those after pixels.

These ways seems a bit cumbersome.

Mod: please move if required.

[Anian]

Well recently AJA's team did a game called "Barely floating", where they used that technique to animate, they have 3 videos explaining the process of making their game and in the 2nd video I think you can see how the characters are made:
http://www.adventuregamestudio.co.uk/forums/index.php?topic=46662.0

And on this point, I'd suggest working with vector program (Illustrator, Inkscape etc.) and not Photoshop or Paint shop, because there's no clean up and no pixel rotation and transformations.

[Slasher]

Cheers

i am going to try DrawPlus vector and try that.

Videos very useful.

[Eric]

Hey, I tried this awhile back. Here are some tips for you, accompanied by some WiP images that I never really finished.

I started this walk cycle draft using a body I'd made in Poser, and picked out I think 12 different keyframes on which to base my animation. I copied + pasted into Illustrator, and started by drawing each part individually over the Poser model. I used the pen tool and the mouse, manually setting my curves. I over-drew the joints, so that there was overlap between parts. I drew the head and hat really large and rough with a tablet in Photoshop, and Live Traced them in Illustrator, because this originally just started as an attempt to do colored linework:

Were I to do this again (there will be a lot of "Were I to do this again" in this post), I'd either do it all in Illustrator, or leave my vectors headless before moving them over to Photoshop and I'd draw the heads there. At this point, I had all the pieces you need to make a police detective:



I was working through this really quickly, so there's some weird stuff, like the front ball joint of the shoe that has a weird trailing point. I copied the hands over from another failed walk cycle, so they don't quite fit with the rest of the body.

I kept each of my walk cycle guides on a separate layer. I did a simple print screen, and used the top of the GUI window to make sure they were aligned. I'd show an image for this, but I deleted them all from the .ai file, apparently. I started by placing all of the parts on the model and arranging them for the first frame. Then, I'd select all, and ctrl+C to copy the parts, hide and lock that layer, then move up to the next one and ctrl+F (to paste in front, in the same place). This meant I wasn't starting from scratch on every frame, but was able to move the parts just slightly from one frame to the next.

I pretty much just selected each part, rotated, moved and scaled as I needed to. Were I to do this again, I would use the following method:

1. Establish a circleof a few pixels around which each part should rotate. For example, in making the arm, put a circle in the center of the shoulder socket, one at the elbow, one at the wrist.

2. Use alt-click with the rotation tool to select these circles (one at a time, see below), which will define the point around which the object is rotated.

2. Start by rotating the whole arm, then the forearm, then the hand. Work from the joint that moves the most amount of mass to the one that moves the smallest.

...This would give more consistency than what I did, which was to just kind of eyeball it.

I did this 12 times, until I had a full walkcycle. Some parts needed to be changed a little, especially around the knees. Were I to do this again, I might make a separate, more consistent knee and elbow piece to cover that joint. There are, on this version, no elbows of which to speak. I left all of the parts unattached, just kind of hanging out there, looking like this:



To move everything over to Photoshop, I drew a printer's mark bullseye on a separate layer. I then went in to each individual layer and combined the parts that needed to be combined -- the upper arm and forearm, the thigh and calf, the two parts of the shoe -- using the Pathfinder unite function. Generally, this worked well, and kept the same color + stroke consistent. Sometimes I'd adjust a few things afterward, but not too often.

Then, I'd copy each frame over to Photoshop, resize a little, and line up the bullseyes, again keeping each frame in a separate layer. I tried to start with my widest frame, where the feet were furthest apart, but I think I still wound up using the expand canvas function to make sure everything fit. With all layers visible, it looks like this:



Animated, it looked something like this:



This walk, because I'd made some "toughness" adjustments in Poser, was a bit overblown for me. But it was a cinch to go back and make the motions more subtle for the next version, though I didn't unite my segments here (because I was still just experimenting [and ignore that weird half-step -- obviously a mistake that I should've corrected!]):



It took me, from start to finish, Poser, drawing the head and all, about two hours to do the first walk, and another 20 minutes to adjust for the second walk. Honestly, making the animated gif took up most of that time.

The next day, I wondered how I would fare if I just kind of eyeballed the movements for an animation. This one is a rough of a quick draw and two gunshots fired at a speeding car. Imagine that he has two hands, that the hands are also animated, and that there's a gun. I have faith in your imagination! I was too lazy / still experimenting to draw them myself!



It turned out pretty well, I thought! Only 20 minutes to do this one.

The big con to this method is foreshortening. It works swell for east and west views, but you'd have to change the scale of the arms and legs for north to south, and your diagonals. Also, any motion that made the sprite turn from one view to another would be tricky to line up correctly. My attention span wandered before I got that far with it, however.

I hope this is somehow useful, even if you just learn from my mistakes. I expect others will chime in to say, "WHY IN THE WORLD WOULD YOU DO THAT THIS WAY WHEN [simple way] WORKS BETTER?" And the answer will be because I didn't know about that way, and thanks for telling me (and slasher) that it existed.

[Monsieur OUXX]

This rendering technique is a long, ongoing quest.
Nobody ever achieved the perfect production process.

It often comes down to this :
- Either you manipulate your layers "By hand" in your favorite painting program. It's fine but then you need to be a good animator.
- Or you use the little app that SSH wrote ("WalkCycle Generator" or something like that). Here: http://www.adventuregamestudio.co.uk/forums/index.php?topic=26501.msg451190#msg451190
- Or you use some advanced 2D animation program, that does "onion skin" -- I think ProgZmax is the specialist around here. They come in 2 flavours :
    a. those for pixel-art (they put a lot of emphasis on palettes, dithering-removal, aliasing-removal, etc.)
    b. Those for vertex-based graphics. (there are a lot of new specialized programs since the age when everybody was using Flash for that)
    Nowadays, with the rebirth of Indie games, you can find some interesting hybrids. There was a free and powerful app posted recently on the forums, but I can't find it.
- Or you use some advanced animation program/3D program, like Poser. then you have 2 approaches :
    a. you can render only the animation (and then go back to using a paint program to draw around)
    b. you can render the whole 3D mesh (possibly with cell-shading shader) and save it as a 2D picture.

Or you can combine all techniques above.

[Slasher]

Thanks guys,

very informative and useful.

Love the finished animation Eric 

I've started using DrawPlus 4 and I am getting used to the controls.

I will check out those programs Monsieur OUXX.

It may be a little while before I produce a great character but it's fun learning.

Cheers guys