| Say you work for a company that does custom auto refinishing. First assignment: Design an intro page for the company's new Web site. You have the following idea for an animation: The first thing you want your audience to see is a beat-up jalopy limping along a city street toward the center of the screen, where it stops and morphs into a shiny, like-new car as your company's jingle plays in the background. A voice-over informs your audience that your company's been in business for 20 years and offers the best prices in town. UP TO SPEED
An Animation by Any Other Name | | You may occasionally hear Flash animations referred to (by books, Web sites, and even Macromedia's own documentation) as movies . Perhaps that's accurate technically, but it sure can be confusing. QuickTime .mov files are also called movies, and some people refer to video clips as movies; but to Flash, these two things are very different animals. In addition, Flash lets you create and work with movie clips , which are something else entirely. And "movie," with its connotations of quietly sitting in a theater balcony eating popcorn, doesn't convey one of the most important features Flash offers: interactivity. Here's the most accurate way to describe what you create using Flash: a Web site or program with a really cool, animated interface. Unfortunately, that description's a bit long and unwieldy, so in this book, what you create using Flash is an animation . |
Across the top of the screen you'd like to display the company logo, as well as a conventional navigation bar with buttonslabeled Location, Services, Prices, and Contactthat your audience can click to get more information about your company. But you also want each part of the car to be a clickable hotspot. That way, when someone clicks one of the car's tires, he's whisked off to a page describing your custom wheels and hubcaps; when he clicks on the car's body, he sees prices for dent repair and repainting ; and so on. Here's how you might go about creating this animation in Flash: -
Using Flash's drawing tools, you draw the artwork for every keyframe of the animation: that is, every unique image. For example, you'll need to create a keyframe showing the beat-up junker and a second keyframe showing the gleaming, expertly refurbished result. (Chapter 2 shows you how to draw artwork in Flash; Chapter 3 tells you everything you need to know about keyframes.) -
Within each keyframe, you might choose to separate your artwork into different layers . Like the see-through plastic cels that professional animators used in the old days, layers let you create images separately and then stack them on top of each other to make a single composite image. For example, you might choose to put the car on one layer, your company logo on a second layer, and your city-street background on a third layer. That way, you can edit and animate each layer independently, but when the animation plays, all three elements appear to be on one seamless layer. (Chapter 4 shows you how to work with layers.) -
Through a process called tweening , you tell Flash to fill in each and every frame in- between the keyframes to create the illusion of the junker turning slowly into a brand-new car. Flash carefully analyzes all the differences between the keyframes and does its best to build the interim frames , which you can then tweak orif Flash gets it all wrongredraw yourself. (Chapter 3 guides you through the tweening process.) -
As you go along, you might decide to save a few of the elements you create (for example, your company logo), so you can reuse them again later. There's no sense in reinventing the wheel, and in addition to saving you time, reusing elements actually helps keep your animation files as small and efficient as possible. (See Chapter 7 for details on creating and managing reusable elements.) -
Add the background music and voice-over audio clips, which you've created in other programs (Chapter 8). -
Create the navigation bar buttons and hotspots that let your audience interact with your animation (Chapter 7). -
Test your animation (Chapter 13) and tweak it to perfection . -
Finally, when your animation is just the way you want it, you're ready to publish it. Without leaving the comfort of Flash, you can convert the editable .fla file you've been working with into a noneditable .swf file and either embed it into an HTML file or create a standalone projector file your audience can run without having to use a browser. Chapter 14 tells you everything you need to know about publishing. The scenario described above is pretty simple, but it covers the basic steps you need to take when creating any Flash animation.  |
