Archive for May, 2013

It’s okay to lose, too

This has given me more trouble than I anticipated. I started out with the initial sketches, as usual. I made two of them, but I knew I had to go with the 8 frame one for consistency. These took way way longer to get to even this rough state than I care to admit. The back-view running animation at this isometric angle is seriously my least favorite thing in the world. The good news is that I only have to get it right once. The bad news.. is that I’m still not great at it.

 

 

Before I dig into this too deep, I realized waaaay after the fact that the reason my 12 and 14 frame animations looked so slow and silly was because I am displaying the whole thing at 11 frames per second. Meaning anything more than 11 frames would take longer than a second to play, as opposed to the 8 frames version which would play at least once a second. Pretty straight forward stuff here, dunno how I missed it. This realization changes nothing though, as I’d much rather go with less frames to make things go by a little quicker. Just some basic stuff I’m going to need to keep in mind with some later animations.

 
On the Action Script 3 end of things I found a much easier way to program the whole thing. Variables and for-loops n’ what not. Things I’m not nearly qualified enough to cover. Just know that I’m way happier and turned 100+ lines of code into 22.

 

The process was basically the same as what I covered before with a few exceptions. I was not expecting to run into any layering issues in this process, but boy was I wrong. Take a gander.

 

 

The head piece has the neck attached to it, and the body is resting on the layer above that. It wouldn’t have made any sense at this angle to try and do it the other way with the head on top, since the head keeps bobbing in in front of and behind his back. This would all be perfect, except in my initial sketch you’ll notice that I have the arms moving behind the head. Well, layer wise I need the arm to be above the body since in a few frames it appears above it, and then I’d also need it below the head. This is obviously impossible and has been a great cause of frustration for me (I promise, eventually I’ll have a week with no frustration and just smooth sailin’)

 

I’ve attempted to change the way the arm swings to make it look less ridiculous several times (and in the process completely jacked up the back arm), and I’m sure there is a way to handle this where the head and the arm never cross paths. I’ve spent so much time working on adjusting their movements that I didn’t even invest the time to draw a proper hand for his back arm. Nor have I taken the time to adjust their feet yet, though adjustments like that are really very simple if I can get the base animation to play nice.

 

Having said all that, we only fell a little short of our goal, though I am cheating a bit here. The bases for the bottom two animations there are obviously just mirrored versions of the upper two, and that is mostly what they are going to be in the end. Right now it’s literally just borrowing the symbols from South and North and mirroring them, but to do it properly I will have to make new symbols that are named properly and exist in their own special set. This is important for asymmetrical designs in outfits and what have you. It’s a simple set up that doesn’t require any extra art, just a little time.

 

Goal for next week:  Tweak the north animation to not look terrible, properly add in the east and west, adjust the feet and hands, and begin on the default costume. Oh, and since we fell short of the goal?  All of this will be done and uploaded with a special shame-edition blog post on Wednesday. Look forward to the tears!

 

 

Now that we’re caught up..

First off, let me say that there was no good tutorial for how this process even works that I could find online, and I searched off and on for weeks. Some people covered different parts of this idea, but no one used the idea to the extent that I needed to. The new system basically works like this:

 

Instead of me hand-drawing every frame of animation, I realized I could just draw pieces and manipulate them. What’s even better, is that I could take any of these pieces and swap them out for a different piece that would move the same way as the piece it was replacing. Meaning, I could replace the naked foot with a shoe, and the shoe would move the same way without me having animate it at all.

 

So in essence, I found a way to draw each piece of clothing only once instead of eight times per direction (4 times total vs 32), whiling making the program do the hard part for me. Granted with this method I do lose a little creative control, but it’s still very possible for me to go in and edit one individual frame if I need to (For example, if the foot needs to look like it’s coming right at us in one frame, and then bending back in another)

 

I was still super unhappy with the way our animation looked, though. Too stiff, not exaggerated enough. I decided to study some nice dynamic running animations, then try my hand at redrawing it one last time. Don’t let your friends tell you that you can’t learn anything from anime.

 

I drew it originally at 16 frames and then cut it down to the two versions you see here. I did this so I could ask everyone which one they liked better, but by the time I had uploaded I already knew the answer. After I had my sketch in, I made some objects and slapped them on as a sort of proof-of-purchase so I could know for sure that this idea was going to pan out.

At this point I’m confident in the way the animation looks and feels, so I go ahead and finish up all the base pieces for this direction.

This animation isn’t without it’s problems, either. The feet and hands will need to be adjusted on certain frames to prevent everything from looking so stiff. The important thing is that the framework is here and is easy to manipulate if I’m not happy with how a particular frame looks. And since all the outfits that will be layered on later are based on this base here, it’ll only need to be edited once.

This is the part where things get a little tedious. The images are actually exported individually as PNGs to be imported into the game. It’s a simple process, but it still takes awhile, especially at 32 frames per direction set and per clothing set. Even though I’ve cut out the work of me drawing a pair of pants 32 times, I still end up having to export it that many times for the game to be able to read it. I simply don’t have that kind of time, to export each set and try out different combinations in-game. So I’ve worked on a way a preview these directly in flash. Even though I’ve messed with this idea in theory several times, when I’m trying to actually make it work everything is riddled with bugs and sadtimes.  It’s probably my fault for paying attention during programming 101, or not paying attention when Hawk talks about algorithms and.. math.

At this point I’ve basically redefined the way every object is made by separating the color and the lines from each other and adding them to different layers. This isn’t a necessary step, but it  helps a lot when recoloring specific pieces or adding new ones later. It’s also useful for the way I’m going to be layering shadows onto the base and extra frames.

I managed to get a little more done that just be frustrated at and tweak my animation , redo all the objects in that animation, and program a skin tone changer. I’ve been fooling around with different layouts for our actual game website, and I continue to go back and forth on several ideas we came up with. We thought a background featuring an island with all the elements of the game in was a good idea, but I’m really doing a super poor job of angling it and finishing it. I’m also over-complicating the entire design. This is probably the 4th island I’ve attempted to draw with little luck.

Goal for next week: Finished Animation Bases for the other 3 Directions, Have a base outfit for each of them

(I also finished* redoing my own website.)

 

Animation Process

I’d like to chronicle the animation process that I’ve been struggling with on and off since January of ’12. I’m not an animator and basically everything I know about animation I learned for this project.

We had discussed doing a character creator for the game, so my first thoughts were “I need to animate a base, and then I can layer different sets of clothes over that base, paper-doll style”.







 

I had gotten to the point where I was ready to call it good in April of ’12, and made this live-preview of what we were looking at (though still not complete)

After the animation got to this point, I stopped working on it to focus on more map tiles and the way they transition into each other, GUI stuff, ideas for battle backgrounds, map objects. We had play tested the game a few times by that point. In Nov of ’12 I started to realize I hated all of this. The scale was weird, the animation looked awful, and  worst of all, it was going to be a TON of work to add all the outfits to those bases.

We began flirting with the idea of scrapping the character creator all together. It was going to be too heavy an art load for one dude to do, especially when so much more game exists that has yet to be made/finished.

I was frustrated again, and began redrawing the entire set to see if I could do it better now.

 

 

It was somewhere around this point that I realized I was looking at this entire thing all wrong, and began on a new process of animating these characters that would save me a lot of time and heartache..