Preface

Flash Out of the Box is a user-centric introduction to Flash MX 2004. This book is designed for people who want to get up to speed in Flash with minimal effort and without being shortchanged. The Preface provides a quick orientation to get off on the right foot. All the software you need is included on the CD-ROM that comes with this book.

Welcome to Flash Out of the Box, a user-centric introduction to Flash MX 2004. This book includes everything you need to get started in Flash, including trial versions of the software and all the example files from the exercises on the enclosed CD-ROM.

Who This Book Is For

A funny thing happened on the way to publication. I originally intended this book as purely for beginners. But during the review process, beta readers of diverse experience levels told me they found it tremendously useful. Having incorporated the suggestions of numerous readers, I feel this book serves a number of potential audiences.

This book is primarily geared toward beginning Flash users who want to bring their project ideas to life. Even if you’re a beginner, I assume you’re relatively intelligent and motivated, that you have a general familiarity with typical graphics programs and web browsers, and perhaps some HTML experience. I don’t assume any programming experience, but familiarity with JavaScript will make it easier to follow the programming examples (which I introduce gently). If you don’t understand all the code examples, don’t worry. You can use the code examples verbatim without fully understanding them, but I felt it was important to at least introduce readers to ActionScript, which is used to implement some important functionality. Most of the ActionScript is presented in the later chapters, and beginners will be well prepared by that time to take Flash to the next level.

This book is also an excellent choice for readers who may have a superficial familiarity with Flash MX 2004 (or previous versions) and want to learn more about the latest version’s capabilities. This group includes developers with previous ActionScript experience who may never have mastered Flash’s drawing tools and other animation and media-related features.

This book should also suit experienced programmers with no prior Flash experience who need to learn the Flash development environment. If you want to learn more advanced ActionScript, refer to the resources in Chapter 13. Regardless, the book is designed for people who want to get up to speed in Flash with minimal effort and without being shortchanged.

Because this book is designed for a range of users, it covers considerable ground. For beginners, it covers the basics in a way that you’ll appreciate and absorb quickly. We were all beginners in Flash once, but most authors seem to have forgotten what it was like to be brand new to Flash. I haven’t forgotten. Flash can have a steep learning curve, but with the right guide, you can be comfortable in no time. Even if you’re not a Flash beginner, the coverage of Flash features acts as both a refresher and a stepping-stone to greater expertise.

The first time I cracked open Flash (more specifically, Flash 3), I went through the Help documentation to find some hands-on exercises and found one of the most useful tutorials I’ve ever read. In those days, Flash was best known as an animation tool, and the mission of this particular tutorial was to animate a bouncing ball. I quickly learned to draw in Flash, use gradients, reuse graphics in an efficient way, animate the bouncing ball, set the tempo for a movie, and finally, publish the movie for use on the Web. All that in one tutorial! I felt like a genius, and I was immediately hooked on Flash.

The tutorial was effective because it revealed information on a need-to-know basis. I didn’t have to read a dry chapter on drawing tools outside the context of a real project. Instead, I learned to draw a circle and turn it into a bouncing ball with realistic motion. I started at point A and followed a story to point C. (The rest of the alphabet came later on.)

When I asked members of my user group (the Flash and Multimedia Users Group of Arizona) to divulge their first experiences with Flash, the stories were very similar. The ironic part is that when you look through the Help documentation in Flash MX 2004, the bouncing ball tutorial is nowhere to be found. The focus has changed from animation and basic design to Rich Internet Applications (RIAs), a term coined by Macromedia to represent web applications with a rich media interface. And while Flash’s evolution is good for developers at all levels, it also means that new users have a lot more to learn than they once did. While Flash development used to mean simple interactivity and motion graphics, modern Flash development can involve data connectivity, web services, and multiplatform deployment.

But even the latest version of Flash shares the same underpinnings as older versions, and new users still need a foundation to use as a stepping-stone to reach their goals. Somewhere in the evolutionary process, tutorials on the fundamentals got lost, so I’m bringing them back in style. Much like the bouncing ball tutorial, this book does not teach Flash, per se—it reveals Flash through tasks that every Flash designer performs during the course of a typical project.

However, this book isn’t merely a wading pool in which to get your feet wet. With this book’s lessons and guidance, you’ll be treading water, doing some laps, and swimming in the deep end in no time. You might even be brave enough to jump off the diving board, but regardless, I won’t just throw you overboard and wait for you to sink.

What’s In A Name?

Flash Out of the Box offers a unique approach to learning Flash.

You’ll learn how to use the tools that come in the box with Macromedia Flash to accomplish your goals—goals that ultimately exist outside of Flash. You’ll learn how to animate, make efficient Flash movies, implement basic interactivity and logic, stream and play video, publish Flash content, and more. But the goal isn’t to teach you Flash, per se. Rather, the goal is to enable you to implement your vision with Flash as the tool of choice. So rather than constrain your ideas with Flash’s authoring metaphor, I’ll get you thinking outside the proverbial box in ways that other introductory books often fail to do.

Another reason for the book’s name is that you’re going to learn a lot about Flash while using a box as a unifying theme throughout.

Why a box?

Boxes are representative of all aspects of design and development. A box represents form and structure (as in building blocks), transition (as in the boxes that hold your memories on moving day), and adventure (like the boxes you unwrap on your birthday). A box encompasses everything you include in its confines and excludes everything you bar from its interior. A box is a metaphor for your own preconceptions and the ability to understand and overcome them. A box is an atomic unit that can be transformed in endless ways. Every piece of paper, computer screen, and web browser window starts as an empty box, and it is up to you to fill it.

You’re going to use, abuse, and transform the box as you step through exercises that will reveal the basics of Flash in an intuitive way. Instead of running through chapter after chapter of information about the major facets of Flash, you’ll learn organically as we complete interesting exercises that present and reinforce the important concepts you’ll need to maximize your creativity. You play the starring role and Flash is the supporting cast.

In this book, we’ll use a box as the basis for graphic layouts, buttons, animations, interactive widgets, cartoon characters, containers for externally loaded assets, advertisements, and even as a television set for displaying video. The exercises show you how Flash can help you accomplish your goals, and the “Get Out of the Box” section at the end of each chapter inspires you to go beyond what you’ve learned to that point.

A box is never just a box. It’s a window. It’s a door. It’s the artwork on an album cover. It’s the canvas waiting to become an oil painting. It’s the jack-in-the-box longing for you to turn the crank. Millions of possibilities exist inside the constraints of a box, and I’ll show you how to implement, build upon, and transcend them.

You’ll learn to think and operate outside the box if you take this opportunity to explore Flash and ultimately bend its capabilities to your will.

What Makes Flash out Of the box Better?

If you’re standing in a bookstore right now, reading this Preface to determine how Flash Out of the Box compares to other books on Flash basics, set this one down for a moment. Find two other introductory Flash books and peruse the table of contents in each one.

The chapter list probably looks something like this:

Chapter 1: Interface
Chapter 2: Drawing
Chapter 3: Symbols (Graphics, Movie Clips, and Buttons)
Chapter 4: Animation
Chapter 5: Text
Chapter 6: Bitmaps
Chapter 7: Sound
Chapter 8: Video
Chapter 9: Components
Chapter 10: ActionScript
Chapter 11: Optimization
Chapter 12: Publishing

These topics are things I would expect to see in a book on Flash basics, because I already know how to use Flash. But they are not things you are likely to expect, because you do not already know about the various features of Flash or how they can help you create the projects in your head that brought you to this bookstore in the first place. Instead of a mental model of Flash, you have only a design goal, and you have no way to know if the preceding list will help you accomplish your goals. These books cover Flash in an order that is nonintuitive for the beginner because they are Flash-centric. They often cover Flash concepts without regard to when or why (or even if ) you should use a particular feature or technique.

Now look through the table of contents for Flash Out of the Box:

Chapter 1: Getting Started
Chapter 2: Creating Layouts Quickly
Chapter 3: Your First Animation
Chapter 4: Interactivity and Movie Clips
Chapter 5: Using Images and Video
Chapter 6: Building an Animated Ad
Chapter 7: Effects and Beyond
Chapter 8: Buttons and Interactivity
Chapter 9: Sound, Transitions, and Streaming Video
Chapter 10: Loading Assets on the Fly
Chapter 11: Building a Reusable Ad Template
Chapter 12: Flash for Handhelds and CD-ROM
Chapter 13: Get Out of the Box
Appendix A: Workflow and Workspace Tips

While you see some of the same topics in this book’s table of contents, the topics are presented in a very different way. For one thing, my book is considerably shorter than many because I assume you’re smart and experienced with other programs even if you’re inexperienced with Flash. Furthermore, I focus on the material you really need, and do so efficiently. So you won’t spend half your time learning features you’ll likely never use. Rather than teaching concepts in the abstract, I introduce them in a context in which they’re meaningful to the exercise at hand. I explain things to help you get where you want to go. After all, you’re not just shopping for a book on Flash. You’re shopping for a book that will help you achieve your goals of creating something spectacular using Flash. The difference is paramount.

The Promise Of This Book

Several techniques are used in this book to help you better understand and retain the information you are given. This approach is what makes Flash Out of the Box a more effective learning tool than other books on the shelf. Here’s a breakdown of the approach:

Learning by doing

People learn by repetition, so you should perform all the exercises. Techniques presented in one chapter are used again in later chapters, offering practice while you learn new techniques. After you’ve initially learned an operation, such as drawing a box, I gradually offer less hand-holding until you can perform the task as second nature. This means that you won’t have to absorb too much information at once.

Shortcuts

Shortcuts and alternative techniques are introduced after you have performed an operation at least once. Becoming more familiar with each operation from multiple perspectives reinforces the material, helping you to transfer it from short-term to long-term memory.

Chunking

Information in this book is grouped together in small pieces, revealing larger concepts through collections of digestible parts. This process is known as chunking. To see how this works, try to remember the following nine-letter sequence: pnggifjpg. Not too easy. Now try to remember the following chunks: PNG, GIF, and JPG. The difference is in the presentation. In the first case, you are expected to remember nine unrelated and abstract items (most people’s limit is three to five items). In the second example, you are asked to remember only three items, and the items are familiar and related to one another (they are all graphic file types). For example, instead of repeating four steps for drawing a box, I might just say “draw a box.” This gives you practice at flying solo and lets me take advantage of the chunks of information you’ve already learned.

Keeping it concrete

It is always easier to remember things that have meaning for you. So I’ll make abstract concepts concrete before expecting you to absorb too much more. Everything is presented in context, so you’ll understand when and why to use each feature, not just how.

Need-to-know basis

Some books try to teach you everything about a given topic before you’re ready. This book features “progressive disclosure” in which a topic is revisited in more depth as your knowledge and needs grow. This is the way we learn most things in life. We learn to tell time before we worry about time zones and daylight savings and leap years. Learning Flash should be no different. This book teaches what you need to know, when you need to know it, without getting bogged down in minutiae that isn’t relevant at the time. In other words, don’t go through this book expecting to learn everything there is to know about a topic in one chapter. Instead, expect to be introduced to a topic or tool and revisit it later to learn more.

Narration

The exercises are presented in a narrative style. New information is given as you go along, so the book follows a typical, iterative learning process. Sometimes steps are undone and restarted to simulate working alongside a teacher or a colleague. This gives the exercises a flow that’s more realistic than other books. It also helps you learn. If you see the mistakes now, you’ll be able to catch your own mistakes later on. I’ll show how to do it right and, on occasion, what happens when you do it wrong.

Sidebars

Sidebars are used to expand upon topics introduced in text sections. The topic is explained in the text enough to perform the exercise and explained in more detail in the sidebar. I cover important concepts in sidebars to avoid bogging down the main text with too many tangents for readers with more Flash experience. Beginners who want a deeper understanding of underlying Flash concepts are well advised to read all the sidebars.

Tips

In addition to the formatted notes and warnings, many tips are offered within the body text, without any special formatting. This may not sound like much of a selling point, but it is. This way, tips are woven seamlessly into your learning experience without being intrusive. You’ll learn deceptively more than you think you are learning.

Terminology

Flash terminology and operations are offered throughout the book in a way that makes it easy to remember the names of things and the purposes of the various panels. After I mention how to perform various operations in the Properties panel, for example, you’ll understand that panel intimately without our ever having discussed it in isolation. You will become familiar with standard Flash terminology, so that you can understand discussion groups and support lists and can ask questions in an intelligent manner.

“Get Out of the Box” sections

Each chapter ends with a section called “Get Out of the Box,” which offers suggestions about what can be accomplished with the skills you gained in the preceding exercises. Suggestions like these are also spread throughout the chapters, so you always have a reason for completing an exercise and always know how you can apply your new knowledge later on.

Accomplish instead of learn

Flash Out of the Box focuses on Flash as a tool, not as an end in itself. The book offers you a path to follow, a reason to follow it, and somewhere to go. All information is presented in a reader-centric, task-oriented fashion, and reasons are offered for completing each exercise. This book presents goals and helps you reach them, and I hope your own interest in the topic provides additional motivation apart from the reasons the book offers.

Make a mess

Flash design and development is rarely a linear process. More often than not, you end up with extraneous code, graphics that don’t get used, multiple versions of the same file, and a whole arsenal of ideas that may or may not work for a particular project. In other words, it’s fun. Design is about the process, and learning should occur the same way. Making a mess is not only acceptable, it’s desirable. And we’ll make plenty of messes…er, “serendipitous excursions” in this book. (Of course, it is always wise to clean up your files before handing them off to clients or other developers.)

The basics and beyond

You will learn what you hope to learn by using this book: the basics of using Flash so you can accomplish your design goals. But I also cover lots of more-advanced features that really add interest to the topic and to your project. The book is not an exhaustive Flash reference, so it won’t leave you exhausted. You’ll get up to speed quickly and be equipped to learn more in the future. Aside from information on the basics, I also offer lots of best-practice advice on everything from design to optimization to usability.

Why Use Flash?

I assume, since you are reading this Preface, that you have some idea of what Flash can do, and you have some things you’d like to do with it. If you don’t, here is some background information.

Flash started as an animation tool with a very basic programming language (ActionScript). From the heyday of the dot-com boom, Flash offered lightweight animations that could be incorporated into any web site, providing a compelling way to bring designs to life. However, instead of using Flash for practical reasons that users would appreciate, such as the animation of a diagram, designers everywhere were using it for convoluted, animated introductions that repelled users in droves. As a poor remedy, Skip Intro buttons became prevalent, and Flash quickly got a bad rap from usability experts such as Jakob Nielsen, who claimed Flash was “99% Bad.” (Since then, Macromedia has made great efforts to improve the usability of Flash content for users, and Nielsen and others have changed their tune.)

Soon enough, Flash made its appearance on our television sets, with Flash animators producing several full-length, broadcast cartoons. Next, the Flash Player made its way into handheld devices, starting with the Pocket PC platform and eventually PDAs and cell phones. Flash even showed up in kiosks in shopping malls. My personal favorite was an animated billboard on top of a taxicab in Las Vegas, the last place I ever expected to see Flash in use.

Over the past several years, with the advent of robust web applications, new usability concerns arose over the number of online transactions that failed. Upon recognizing this, Macromedia began morphing Flash into a serious application development environment, capable of loading dynamic information and exposing web services on the Web, CD-ROM, handhelds, and now, Macromedia Central (http://www.macromedia.com/software/central). The purpose is to use the ubiquitous Flash Player as a front end for web applications, helping to consolidate multiple screens into a single dynamic interface, creating a more engaging and effective application.

Flash is the ultimate tool for creating rich media experiences that engage, entertain, and even facilitate business processes. Of course, plenty of people still use it to make cartoons, and I, for one, think that’s pretty cool.

What you do with Flash is up to you, so I hope you’ve got some projects in mind. Soon, you’ll see just how easy it is to implement your designs in Flash, and by the end of this book you’ll be ready to transcend Flash’s limits and, in doing so, push your own.

How to Use This Book

If you read the book from cover to cover, you’ll find many tidbits in unlikely places that you’d miss if you skip around. You’re strongly encouraged to perform all the exercises so you get some practice and gain familiarity with Flash. Most of the exercises build on concepts and operations learned earlier, so unless you’re already familiar with Flash, you should definitely start at the beginning. The exercises are refreshingly brief, so give them a shot and pick up the finer points hidden along the way.

Getting the Examples Working

Nothing is more frustrating than a tutorial book in which you can’t get the examples to work. In anticipation of that, I offer the following guidance. This explanation will make much more sense once you get further into the book, learn to use Flash, and experience difficulties firsthand. You may want to just skim this advice now and revisit this section if you are having trouble getting something to work.

This book assumes you are using either the Flash MX 2004 or Flash MX Professional 2004 (Flash Pro) authoring environment. See http://www.macromedia.com/software/flash/productinfo/features/comparison for a comparison between the two. Flash development is largely identical on both Windows and Macintosh, although some of the keyboard shortcuts or locations of menu commands vary slightly across platforms. I point out differences where necessary.

The example files for the exercises and installers for both Flash MX 2004 and Flash MX Professional 2004 are included on the enclosed CD-ROM. I recommend you install Flash Pro if you don’t already have Flash MX 2004 installed.

If you have lost the CD-ROM and have a high-speed connection, you can download the trial software from Macromedia’s site (http://www.macromedia.com). I generally don’t use features that are exclusive to Flash Pro, and I warn you when I do. Almost everything works identically in Flash MX 2004 and Flash Pro.

The most common reason for being unable to get an example to work (assuming you haven’t made any typos) is a failure to set up the Flash file according to the instructions. Reread the surrounding text and follow the steps carefully. Be sure to place the code where it belongs (usually in the first frame of the actions layer).

Note

Refer to Appendix A for important tips on how to configure your workspace for maximum ease-of-use. The enclosed CD-ROM includes a sample panel layout, as described in the appendix.

Any code example that accesses movie clips, buttons, or text fields via ActionScript won’t work unless you set the item’s instance name properly. To set the instance name for a movie clip, button, or text field, select it on stage and enter the instance name on the left side of the Properties panel (accessible via the Window Properties menu command) where you see the placeholder “<Instance Name>”.

Note

In case of errors, updated examples and sample files can be downloaded from the book’s support web site at http://flashoutofthebox.com.

If you still can’t get it working, be sure to check the example files on the CD-ROM, contact O’Reilly book support, or check the book’s errata page.

To ensure the examples compile, set the ActionScript Version to ActionScript 2.0 under File Publish Settings Flash. All examples have been tested in Flash Player 7 (the latest version of the plugin corresponding to the release of Flash MX 2004 and Flash Pro), but many will work in Flash Player 6 or even Flash Player 5. Most examples can also be exported in Flash Player 6 format from Flash MX 2004 or Flash Pro by setting the export format (i.e., the Version option) to Flash Player 6. If you have trouble getting an example to work, especially an example that uses ActionScript, be sure to export it in Flash Player 7 format.

Flash MX—the previous version of the Flash authoring tool—does not support ActionScript 2.0. However, most of the exercises and example code work in Flash MX (some of the menu options and panel items may be slightly different, but you shouldn’t have any trouble adapting the exercises to Flash MX). If using Flash MX, set the Actions panel to Expert Mode (using the Options menu in the upper-right corner of the panel). In Expert Mode, you can enter ActionScript directly in the Script pane of the Actions panel rather than using Normal Mode’s menu-driven approach. Flash MX 2004 and Flash Pro no longer support a menu-driven mode for entering ActionScript, and all code is either entered directly in the Script pane of the Actions panel or created via the Behaviors panel.

Conventions

The following typographical conventions are used in this book:

Keyboard shortcuts

Keyboard shortcuts for Windows and Macintosh are often listed for a command. If only one keyboard shortcut is specified, it is the same on both platforms. If different, the platform is mentioned. For example, “Ctrl-G (Windows)” means to press the Ctrl key and the G key at the same time on the Windows operating system. “Cmd-G (Mac)” means to press the Command key and the G key at the same time on the Macintosh operating system. Shorthand notation such as “Ctrl/Cmd-G” means to use Ctrl-G on Windows and Cmd-G on Mac.

Menu commands

Menu commands are indicated using the arrow symbol ( ). For example, Edit Copy indicates that you should select the Copy command from the Edit menu. Similarly, Modify Arrange Send Backward indicates choosing a menu item several levels deep. The same convention is used to indicate that you should choose a tab or suboption in a dialog box, such as File Publish Settings Flash Action- Script Version.

Plain text

Indicates menu titles, menu options, menu buttons, and keyboard accelerators (such as Alt, Ctrl, and Cmd).

Italic

Indicates new terms, function names, method names, class names, layer names, URLs, email addresses, filenames, file extensions, pathnames, and directories. In addition to being italicized in the body text, method and function names are also followed by parentheses, such as stop().

Constant width

Indicates code samples, clip instance names, symbol names, symbol linkage identifiers, frame labels, variables, attributes, properties, parameters, values, objects, XML tags, HTML tags, the contents of files, or the output from commands.

Constant width bold

Shows commands or other text that should be entered literally by the reader.

Constant width italic

Shows text that should be replaced with user-supplied values.

Note

This icon signifies a tip, suggestion, or general note, although many tips are integrated throughout the text.

Warning

This icon indicates a warning or caution. Ignore at your own peril.

Comments and Questions

Please address comments and questions concerning this book to the publisher:

O’Reilly Media, Inc.
1005 Gravenstein Highway North
Sebastopol, CA 95472
(800) 998-9938 (in the United States or Canada)
(707) 829-0515 (international or local)
(707) 829-0104 (fax)

We have a web page for this book, where we list errata, examples, and any additional information. You can access this page at:

http://www.oreilly.com/catalog/flashbox

To comment or ask technical questions about this book, send email to:

For more information about our books, conferences, Resource Centers, and the O’Reilly Network, see our web site at:

http://www.oreilly.com

Acknowledgments

I offer my sincerest gratitude to the following people:

Bruce “I correct everything” Epstein

You took my fledgling of an idea for Flash Out of the Box to the O’Reilly editorial board and convinced them to let me write this book. Then you helped me shape the book’s vision, taught me to be the writer I thought I already was, offered sage advice at all the best (and worst) times, and suffered through quite a few nights of serious sleep deprivation to get this book ready for production. All of this makes you either brilliant or crazy. In either case, Bruce, you rock.

O’Reilly Media, Inc.

You have all been wonderful throughout this process. Even Tim O’Reilly himself kept close tabs on the book’s progress to make sure it lives up to the O’Reilly name. And believe me, I really hope it does. Thanks also to the O’Reilly staff, including Emily Quill, Rob Romano, Claire Cloutier, Glenn Bisignani, Bill Takacs, and Robert Luhn, and to my conscientious copyeditor, Norma Emory.

Robert Eckstein

You were kind enough to answer questions, offer advice, and even shoot video of your dog for this book. Thanks, Robert. May Scrappy and you both live long and healthy lives.

Ron Haberle

You put together the custom timeline effect featured in Chapter 6, and then offered yourself up as a reference when the opportunity came along for me to join the KnowledgeNet team. Why you did any of this, I’ll never know, but you’re a swell cat in my book (and this is, in fact, my book, so I get final say). Thanks, Ron.

Liatt Bailey

You used to be the guy who asked way too many questions about how to do the simplest things you could possibly do on a computer (I’m so glad that’s over). You’re also the guy who makes me laugh more than anyone else. Ironically, you’re terrible at telling jokes. For that, I’m appreciative. And a bit confused.

The beta readers and tech reviewers

I thank you for keeping me accurate and honest. Sham Bhangal, Paul Catanese, Lisa Coen, Marc Garrett, Mark Jonkman, Andy Rayne, Darron Schall, Drew Shefman, Dana Stokes, Karen Vagts, and Edoardo Zubler.

The Macromedia Flash Engineering team

Words cannot possibly describe how great you have been. In particular, I’d like to thank Mike Downey (Flash Project Manager), Mike Chambers (guru of everything Macromedia), and Ed Sullivan and Amy Brooks (Macromedia User Group Coordinators). All of you have been a tremendous help and have contributed to the Flash community in ways I can’t begin to explain.

FMUG.az (Flash and Multimedia Users Group of Arizona)

John C. Bland II, Shane “can’t design” Anderson, Bob Wohl, Ron Haberle, Muharem Lubovac, Shaun Jacob, Jeff “cross-homogenization” Garza, and everyone else in the group (all 180 of you) make this whole experience worth everything I have put into it. Without you, I’d still be wondering if there were other Flash geeks in Phoenix.

Above all else, I thank my wife, Christine Rose Pearson, without whom none of the possibilities in my life would have become reality. You are my eternal inspiration. You are my best friend. You are, quite simply, the place I call home. See you in Dreamland.

Robert Hoekman, Jr.

Phoenix, Arizona

October 2004

Get Flash Out of the Box now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.