|
![]() |
Course Course |
Animation
Animation is the act of creating activity or motion. Most people think of animated cartoons such as television shows and movies. However Flash can also be used to create learning resources and exciting promotional materials. The key to effective animation is restraint. Although we could have cool animations flying around on this page, it would distract from this text. Be sure the animation is effective, efficient, and appealing. In other words, it should be used to meet a need rather than simply add glitz to a project. The following links take you to the resources on this page.
Animation in FlashFlash contains great tools for creating a variety of animations. Flash offers five ways to create animation. Frame-by-Frame. The most flexible approach is called frame-by-frame animation. With this type, the developer makes small, individual changes to objects on the Stage within every frame. Although effective, this can be very time-consuming. If you’ve tried making a flip-book or creating claymation, you’re familiar with this approach. Since Flash is a frame-based program, it’s easy to move from frame-to-frame to make these changes. With frame-by-frame animation, you can make incremental changes in the placement of the object to give the appearance of motion (i.e., swinging pendulum, playing on seesaw, or raft floating on water). In addition, you can change the object itself, so it looks like it had been transformed (i.e., pumpkin turns into a jack-o-lantern, a frown turns into a smile, a plant grows). Tweening is a technique used to make animation much easier. The developer identifies a start point and end point, then the software figures out the positions of the objects “between.” Flash contains two types of tweens: motion tweens and shape tween. Motion Tweening. Motion tweens move objects from one place on the Stage to another. For example, we’ll move the airplane across the Stage. The developer places an object at the starting point at a Keyframe. Then, creates a Keyframe somewhere along the Timeline and moves an instance of the object to the end point. The creator returns to the beginning frame and chooses the motion tween option. The software then moves the object on a direct path from the beginning to the ending point. Flash provides options to tweak the tweening so that it looks more realistic. For example, motion guide can be used to move the animation along an established line so it looks like a plane is taking off. Easing is used to make it look like a ball is really bouncing. Shape Tweening. Shape tweens morph one image into another image. For example, we’ll change the shape of the cloud as is moves across the Stage. You could also change circles into stars, a seed into a plant, or a bike into a car. Keep in mind that shape tweening only really works well with the vector graphics. In other words, Flash shape tweening won’t work well on a photograph of a human face, but it would work for a line-based smiley face. ActionScript. Besides frame-by-frame and tweening, objects can be animated using ActionScript. In addition to animation, scripting is also used for highly interactive projects such as video games and simulations. Finally, you can also choose from pre-built animations provided by Flash. We'll talk more about this option in the Interaction section of the course. Armature Tweens (aka bone tweens). Inverse kinematics (IK) is a way of animating an object or set of objects in relation to each other. This is done using an articulated structures of 'bones' within the object(s). Use of the bone tool allows lets you add an articulated structure within the visual object and then connect naturalistic movements to those bones. When one bone is moved, the other connected bones move in relation to that initiated movement. When animating using inverse kinematics, you specify the start and end positions of objects and the software creates natural movements. If you want to use the same animation a number of times within a project, you may want to create a Movie Clip. Also, if you want to have animation within animation (called nested), then you may want to use the Movie Clip symbol. For example, we could have many hot air balloons rising taking off the ground. Rather than creating many separate balloon animations, we could just use different instances of a balloon movie clip.
|
||||||||||||||||||||||||||
Types of AnimationSome Flash developers are particularly interested in specific applications of animation. For example, they may be interested in developing cartoons, television programs, or web content. Skim Animation Concepts (adapted from Tony White's The Animator's Handbook) and The Twelve Principles of Animation at Wikipedia. Anime is an animation style that originated in Japan. You've probably seen Anime used in graphic novels, computer games, and television cartoons. Skim the Anime website at Wikipedia to learn a little about this type of animation. Let's explore a few cool techniques for using animation in Flash. These online tutorials were found and suggested by former students in this Flash class: Morphing. There are many ways to create an interesting visual morph. Try the following tutorials for help: Morphing Effect in Flash (Shape Tween) at Republic of Code and Shape Morphing by Eddie Carroll at Flash Kit. Tweening. There are good online resources for tweening: Motion Guide Tween at Echo Echo and Flash Tweening at W3Schools. Animation Basics. It's fun to tween. Flash Animation Basics at SmartWebby is a good tutorial on animation. Movie Clips. Once you've developed some animation, consider creating movie clips that can be reused within a project or incorporated into different projects. For ideas about developing movie clips, go to Flash Movieclip Symbols from SmartWebby and Creating Movie Clips at Flashexplained. Random Elements. From snowflakes falling to rockets launching, there are many times when you want your animation to occur at random places. Go to Random Animation at ToxicLAB. Animation Needs. Looking to make figures dance? Visit Flash Tutorial Beginner - Onion Skinning at Web Developers Notes and Flash Tip: Onion-Skinning Animation at About.com. Check out the dancers! Bouncing Balls. There are resources to help people create bouncing balls including Bouncing Fall at Macloo, How to Create a Bouncing Ball Animation in Flash at WonderHowTo and Creating a Bouncing Ball with Shape Tweening by Katherine Ulrich at PeachPit Press. Animating Puppets. For some fun, try animating puppets! Watch Flash CS4 Animating Puppets (Uses IK tools) at Adobe Layers Magazine. |
|||||||||||||||||||||||||||
Create an Animation ProjectNow that you know the basics, it's time to create your own projects. Rather than starting with something complex, consider a simple project. Some ideas below will get you started.
|
|||||||||||||||||||||||||||
|
|||||||||||||||||||||||||||
Learn MoreIf you'd like to learn more about creating basic Flash graphics and animations, explore some of the following off-site, online resources ( Note: A few of the resources were designed for earlier versions of the software, but techniques still apply to the current Flash software):
Longer-length Video Tutorials
The following websites contain examples and animations you can incorporate into your project. Some are free and some are fee-based.
|
| All Rights Reserved. Created 10/05. Updated 10/10. Feedback |