It may be hard to imagine, but once upon a time, pages on the World Wide Web didn’t have pictures, let alone animations, videos, and interactive graphics. All these elements were added through trial, error, debate, and debunk. Changes came when brave souls (like you) forged ahead and made things work with the tools at hand. If a commercial product worked well and was widely adopted, it became the de facto standard. Adobe’s PDF (portable document files) and Flash animation player are well-known examples. However, there’s always been a problem with proprietary and patent-encumbered technologies on the Internet. They’re like a toll road in the center of a major city. On the other hand, authorities and standards-writing groups have been known to create “standards” that few browser and web developers follow. Strictly structured XHTML pages fall into this category. The solution is to create standards for the Internet that are practical, usable, and don’t stifle creativity. Of course, that’s easier said than done.
If you don’t already have Adobe Edge Animate on your computer, you can get Version 1.0 from Adobe as part of a free Adobe Cloud membership. Go to http://html.adobe.com/edge/animate/. Click the Get Started button. You know the drill. Provide your name, email address and a password and you’re signed up. If you want more details on how to install Animate on your computer, check out Appendix A.
Despite the many improvements in software over the years, one feature has grown consistently worse: documentation. With the purchase of most software programs these days, you don’t get a single page of printed instructions. To learn about the hundreds of features in a program you’re expected to use online electronic help, but with a brand new product, like Adobe Edge Animate, the help files are minimal.
But even if you’re comfortable reading a help screen in one window as you try to work in another, something is still missing. At times, the terse electronic help screens assume that you already understand the discussion at hand and hurriedly skip over important topics that require an in-depth presentation. In addition, you don’t always get an objective evaluation of the program’s features. (Engineers often add technically sophisticated features to a program because they can, not because you need them.) You shouldn’t have to waste your time learning features that don’t help you get your work done.
This book periodically recommends other books, covering topics that are too specialized or tangential for a manual about Animate. Careful readers may notice that not every one of these titles is published by Missing Manual-parent O’Reilly Media. While we’re happy to mention other Missing Manuals and books in the O’Reilly family, if there’s a great book out there that doesn’t happen to be published by O’Reilly, we’ll still let you know about it.
Adobe Edge Animate: The Missing Manual is designed to accommodate readers at every technical level. The primary discussions are written for advanced-beginner or intermediate computer users. But if you’re a first-timer, special sidebar articles called Up to Speed provide the introductory information you need to understand the topic at hand. If you’re an advanced user, on the other hand, keep your eye out for similar shaded boxes called Coders’ Clinic and Designer’s Toolbox. They offer more technical tips, tricks, and shortcuts for the experienced computer fan.
Animate works almost precisely the same in its Macintosh and Windows versions. Every button in every dialog box is exactly the same; the software response to every command is identical. In this book, the illustrations have been given even-handed treatment, rotating between the two operating systems where Animate is at home (Windows 7 and Mac OS X).
One of the biggest differences between the Mac and Windows versions is the keystrokes, because the Ctrl key in Windows is the equivalent of the ⌘ key on the Mac.
Whenever this book refers to a key combination, you’ll see the Windows keystroke listed first (with + symbols, as is customary in Windows documentation); the Macintosh keystroke follows in parentheses (with - symbols, in time-honored Mac fashion). In other words, you might read, “The keyboard shortcut for saving a file is Ctrl+S (⌘-S).”
Adobe Edge Animate: The Missing Manual is divided into three parts, each containing several chapters:
Part 2 is all about animating the elements on the stage. You’ll learn advanced techniques for working efficiently in Animate. Animation is time-consuming work, but you can save lots of time by reusing and recycling your previous work with symbols. You’ll learn to manage and edit the timeline and the transitions you create. One chapter in this section is devoted to triggers and actions. You use these tools to automate your animation and give interactive control to your web pages. The last chapter is devoted to Animate symbols, a handy tool for grouping elements and reusing art and code. Symbols speed up the development process and add consistency to your compositions.
Part 4 helps you deliver your Animate masterpiece to an audience—that’s done by publishing your composition. In this section, you learn how to develop responsive designs that look good whether they’re viewed on a desktop computer, a smartphone, or a high-def TV. You’ll also learn how to accommodate browsers that aren’t up to date with HTML5 capabilities.
Appendix A explains how to install Animate on both Windows and Mac computers. You’ll also find tips on where to look for discussions and additional Animate resources. Appendix B: Menu by Menu briefly describes each menu command and its function.
You’ll find very little jargon or nerd terminology in this book. You will, however, come across a few terms and concepts that you’ll encounter frequently in your computing life:
To use this book (and indeed to use Adobe Edge Animate), you need to know a few basics. This book assumes that you’re familiar with a few terms and concepts:
Clicking. This book includes instructions that require you to use your computer’s mouse or trackpad. To click means to point your cursor (the arrow pointer) at something on the screen and then—without moving the cursor at all—press and release the left button on the mouse (or laptop trackpad). To right-click means the same thing, but pressing the right mouse button instead. (Usually, clicking selects an onscreen element or presses an onscreen button, whereas right-clicking typically reveals a shortcut menu, which lists some common tasks specific to whatever you’re right-clicking.) To double-click, of course, means to click twice in rapid succession, again without moving the pointer at all. And to drag means to move the cursor while holding down the (left) mouse button the entire time. To right-drag means to do the same thing but holding down the right mouse button.
When you’re told to Shift-click something, you click while pressing the Shift key. Related procedures, like Ctrl-clicking, work the same way—just click while pressing the corresponding key.
Menus. The menus are the words at the top of your screen: File, Edit, and so on. Click one to make a list of commands appear, as though they’re written on a window shade you’ve just pulled down. Some people click to open a menu and then release the mouse button; after reading the menu command choices, they click the command they want. Other people like to press the mouse button continuously as they click the menu title and drag down the list to the desired command; only then do they release the mouse button. Both methods work, so use whichever one you prefer.
Keyboard shortcuts. Nothing is faster than keeping your fingers on your keyboard to enter data, choose names, trigger commands, and so on—without losing time by grabbing the mouse, carefully positioning it, and then choosing a command or list entry. That’s why many people prefer to trigger commands by pressing combinations of keys on the keyboard. For example, in most word processors, you can press Ctrl+B to produce a boldface word. In this book, when you read an instruction like “Press Ctrl+L to insert a label,” start by pressing the Ctrl key; while it’s down, type the letter L; and then release both keys.
Throughout this book, and throughout the Missing Manual series, you’ll find sentences like this one: “Open the System Folder→Preferences→Remote Access folder.” That’s shorthand for a much longer instruction that directs you to open three nested folders in sequence, like this: “On your hard drive, you’ll find a folder called System Folder. Open that. Inside the System Folder window is a folder called Preferences; double-click it to open it. Inside that folder is yet another one called Remote Access. Double-click to open it, too.” Similarly, this kind of arrow shorthand helps to simplify the business of choosing commands in menus, as shown in Figure 1.
As the owner of a Missing Manual, you’ve got more than just a book to read. Online, you’ll find example files so you can get some hands-on experience, as well as tips, articles, and maybe even a video or two. You can also communicate with the Missing Manual team and tell us what you love (or hate) about the book. Head over to www.missingmanuals.com, or go directly to one of the following sections.
For many of the exercises, there are completed examples that you can use to check your own work. A completed example includes the word done in the filename as in 03-3_MyExample_done.
Finally, so you don’t wear down your fingers typing long web addresses, the Missing CD page also offers a list of clickable links to the websites mentioned in this book.
If you register this book at oreilly.com, you’ll be eligible for special offers—like discounts on future editions of Adobe Edge Animate: The Missing Manual. Registering takes only a few clicks. To get started, type http://oreilly.com/register into your browser to hop directly to the Registration page.
Got questions? Need more information? Fancy yourself a book reviewer? On our Feedback page, you can get expert answers to questions that come to you while reading, share your thoughts on this Missing Manual, and find groups for folks who share your interest in web design and animation. To have your say, go to www.missingmanuals.com/feedback.
In an effort to keep this book as up-to-date and accurate as possible, each time we print more copies, we’ll make any confirmed corrections you’ve suggested. We also note such changes on the book’s website, so you can mark important corrections into your own copy of the book, if you like. Go to http://tinyurl.com/animate-mm to report an error and view existing corrections.
Safari® Books Online is an on-demand digital library that lets you easily search over 7,500 technology and creative reference books and videos to find the answers you need quickly.
With a subscription, you can read any page and watch any video from our library online. Read books on your cellphone and mobile devices. Access new titles before they’re available for print, and get exclusive access to manuscripts in development and post feedback for the authors. Copy and paste code samples, organize your favorites, download chapters, bookmark key sections, create notes, print out pages, and benefit from tons of other time-saving features.
O’Reilly Media has uploaded this book to the Safari Books Online service. To have full digital access to this book and others on similar topics from O’Reilly and other publishers, sign up for free at http://my.safaribooksonline.com.