Creating Flash-friendly character design
Creating Flash-friendly character design
When you're working in Flash, it's important to know the strengths and weaknesses of the program. This is going to affect how you design your project and your characters. Now unlike in 3-D programs like Maya or 3D Studio MAX, Flash works with a series of flat layers. This means that we should favor design styles and movements that recognize this and allow for it. Now we have to work around this flatness and create the illusion of dimensionality, that the character actually is in a series of squished levels. So I'm going to show you the rig that we're going to create during the course of this class.
Let me change the workspace layout a little bit. So it's easier to see the vertical stack. That's good. Let me switch this to Outline mode. Each layer has a different outline color. I'm going to pull the figure apart a little bit. Let's go back to color. So you get the idea. Essentially think of it like a one of those little flat dolls on strings that you pull and yank the legs out.
It's pretty much no different. That's the physical structure of the character. I'm going to reverse them back now, okay. So the simpler and the more graphic your design, the easier it's going to be for you to pose the character and to animate them, and the more realistic and the more detailed the design, the harder it's going to be. So let me show you. In fact these layers are old one single color means I can move them, align them into different positions and poses, and I don't have to worry quite so much. I can split the legs over here.
Quite drastically change the pose of the character, even without doing anything really substantial. I don't have to worry about lining up too much details. That's pretty good. I can flip the head over, all kinds of things, and that's just a simple example. Now, let's suppose that our figure has lines, one of the big design no-nos of Flash. Try to avoid stripy lines that cross the seams of the levels. You got to try to avoid polka dots, and I've seen all these things in actual productions and they caused havoc, because lining up the seams, if stripes cross them or dots cross them or some other graphical element crosses these points, the animators have to spend quite a lot of time making that work.
So let's try to do something similar with this guy. If I move that arm, you can see immediately on the shoulder area, if I move that hand, try to do anything with that hand to make him look like, "Come this way sir," oh dear, oh dear. That's going to be someone's lunch break ruined. So this is the problem with being too ambitious and too fancy with these graphical elements. You have to be very careful about how you structure them and where you put them and if I wanted to do something even more important with one of these shapes.
For example, if I wanted to take the arm and work inside the arm, to do something really interesting and position it into a different gesture, it's easy enough to do it. It's just a single area of flat color. To do this same thing with the striped arm involves point after point after point. It's going to take a long time just to do something, the smallest change.
That's not going to be fun and the chances are it's not going to look good. So that's one of the cardinal rules when you're designing a character for Flash. Don't inflict this on yourselves, because it will wear you down. I'm not saying it's impossible. There are ways and means to do some of these effects, but they require quite a bit of engineering and they're certainly not for somebody who's beginning to work in Flash and you should have a lot of time to decide to do it. As a good rule of thumb, the more complicated your design, the less energy and time that you're going to have to actually animate the character.
Let me show you just the simple example of a simple design, little dollar bills walking in great numbers. These are marching. Let's go in a little closer. Okay, let's go try it again. So there we see a little shape, a simple shape tweened animation. A lot of personality in that, a lot of fun to work in, and all this is a couple of layers, so if you're in the process of learning this program, I think you'll get a lot more enjoyment out of animating something that's easy to work with, and not overly laden with graphical elements, things around the perimeter or any of the detail.
So that's initially, we'll try to keep these symbols as simple as we can, and make your time as free as possible to focus on actually making our little guy perform and act and walk. So let's move on.
Creating Flash-friendly character design provides you with in-depth training on 3D + Animation. Taught by Dermot O' Connor as part of the Flash Professional CS5: Character Animation
Hand-Drawn Animation in Flash108,174 Views
Introduction to Flash Animation136,171 Views
2D Animation Principles249,778 Views
ActionScript 3.0 in Flash Professional CS5 Essential Training1,094,482 Views
Best Practices for Flash-based Banner Ads260,937 Views
Illustrator CC 2013 One-on-One: Fundamentals1,677,422 Views
Edge Animate Essential Training631,228 Views
Illustrator CC 2013 One-on-One: Mastery301,996 Views
After Effects CC Essential Training2,629,103 Views
Illustrator CC 2013 One-on-One: Advanced391,930 Views