Tài liệu Thiết kế flash với flash cs5 part 1 docx

ptg Getting Started with Flash CS5 Introduction Flash is an application for developing rich content, user interfaces, and Web applications. Adobe Flash Professional CS5 allows designers and developers to integrate video, text, audio, and graphics into rich experiences that deliver superior results for interactive marketing and presentations, e-learning, and application user interfaces. Most major com- mercial Web sites have implemented Flash content because of its cross-platform consistency, rich graphics capabilities, and small file sizes. After you create and fine-tune multimedia content in Flash, you can deliver it on the Web within a browser using the Flash Player. Flash Player is a software product devel- oped by Adobe for browsers on the Macintosh and Windows. Flash is the world’s most pervasive software platform, used by millions of professionals and reaching more than 97% of Web-enabled desktops worldwide, as well as a wide range of consumer electronic devices, such as PDAs and mobile phones. You can also deliver Flash content as a separate application using AIR or an application on an Apple iPhone. Flash operates virtually the same on both Macintosh and Windows versions, except for a few keyboard commands that have equivalent functions. You use the [Ctrl] and [Alt] keys in Windows, and the A and [Option] keys on a Macintosh computer. Also, the term popup on the Macintosh and list arrow in Windows refer to the same type of option. 1 1 What You’ll Do Prepare to Install Flash Install and Start Flash View the Flash Window Create a Project Plan Build a Flash Project Create a New Document Create a New Document from a Template Open an Existing Document Change Document Properties Work with Document Windows Save a Document Save a Document in Different Formats Get Help While You Work Get Online Updates and Support Finish Up 1 From the Library of Wow! eBook ptg 2 Chapter 1 System Requirements Before you can install Flash Professional CS5 and development content, you need to make sure your computer meets the minimum sys- tem requirements. You can create Flash con- tent on Windows and Macintosh computers. As a Flash developer, you also need to be aware of the system requirements for viewers of your Flash movies in a browser using the Adobe Flash Player. Web users need to down- load and install the player in order to view and interact with Flash content. The Flash Player is free and widely distributed over the Web at www.adobe.com . Some Flash CS5 features require the latest version of QuickTime. During the installation, use the Recommended installation type to install the required components. You can obtain the latest version of QuickTime at www.quicktime.com . For Windows Computers You need to have a computer with the follow- ing minimum configuration: ◆ Intel Pentium 4, Centrino, Xeon, or Core Duo processor or equivalent. ◆ 1 GB of RAM (2 GB recommended). ◆ 2.5 GB available disk space. ◆ 16-bit (thousands of colors), 1024 x 768 resolution. ◆ Microsoft Windows XP with Service Pack 3 or higher; Windows Vista with Service Pack 1, Windows 7. ◆ Internet or phone connection required for activation. ◆ QuickTime 7.x or higher; DirectX version 9.0c or higher. For Macintosh Computers You need to have a computer with the follow- ing minimum configuration: ◆ Multicore Intel-based Macintosh. ◆ 1 GB of RAM (2 GB recommended). ◆ 2.5 GB available disk space. ◆ 16-bit (thousands of colors), 1024 x 768 resolution. ◆ Mac OS X 10.5.x, or later. ◆ Internet or phone connection required for activation. ◆ QuickTime 7.x or higher. For Viewers in a Browser Your visitors n eed to have a computer with the Flash Player and the following minimum configuration: ◆ For Windows 98/Me. Internet Explorer 5.5, Netscape 7.x, Mozilla 1.x, Firefox 1.x, AOL 9, or Opera 7. 11. ◆ For Windows 2000. Internet Explorer 5.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x, CompuServe 7, AOL 9 , or O p era 7. 11. ◆ For Windows 7/Vista/XP/Windows 2003 Server. Internet Explorer 6.0, Netscape 7.x, Mozilla 1.x, CompuServe 7, F i r e f o x 1. x , A O L 9 , o r O p e r a 7. 11. ◆ For Macintosh OS X 10.1.x - Mac X 10.4.x. Safari 2.x, Internet Explorer 5.2, Netscape 7.x, Mozilla 1.x, Firefox 1.x, AOL for OS X, Opera 6, or Safari 1.x. Preparing to Install Flash From the Library of Wow! eBook ptg Chapter 1 Getting Started with Flash CS5 3 To perform a standard application install, insert the Adobe Flash Professional CS5 installation disc into the drive on your computer, and then follow the on-screen instructions. Because the setup process is different for Macintosh OS X and Windows platforms, general steps are provided to help you get started, and the on-screen instructions will guide you through the rest. Make sure to have your serial number handy because you'll be asked to enter it during the installation process. If you're updating from a previous version of Flash, you'll be required to verify the older version with your serial number for the previous version. The Flash installation includes all the components you need, including the Flash Player 10, to develop Flash content. The Flash Player is soft- ware installed on a user’s computer that allows them to view published Flash movies (SWFs) in a Web page or through the player. Installing Flash Install Flash Professional CS5 Insert the Flash Professional CS5 DVD into your DVD ROM drive, or download the software online to your hard disk. If necessary, double-click the DVD icon or open the folder with the downloaded software, and then double-click the setup icon. Follow the on-screen instructions to install the product; the installer asks you to read and accept a licensing agreement, enter a serial number, indicate the language you want, enter or create an Adobe ID or skip the step, and specify where you want to install the software. 3 2 1 3 2 Did You Know? Most Adobe applications can be downloaded. It's all very simple, you go to www.adobe.com , click the Products menu item, and then select the application you want to purchase. You will need a credit card (of course), and a lot of bandwidth. From the Library of Wow! eBook ptg 4 Chapter 1 You can start Flash in several ways, depending on the platform you are using. When you start Flash, the computer displays a splash screen and then the Flash window. When you start a new Flash session or close all documents, a Welcome screen appears in the Document window, pro- viding easy access links to open a document, open a recent item, cre- ate new documents, create new documents from template, and display online video tutorials to help you get started. You can also use links to access many Flash related Adobe Web sites, including Adobe CS Live Online Services ( New! ) and Adobe Flash Exchange, where you can download additional applications and information. Starting Flash Start Flash in Windows Click Start on the taskbar. Point to All Programs (which changes to Back). Point to an Adobe Collection CS5 menu, if needed. Click Adobe Flash Professional CS5. If you’re starting Flash Professional CS5 for the first time, you might be prompted to specify the following: ◆ Enter or create an Adobe ID to register the product, click Submit, and then click Done. The Flash Professional CS5 window opens, displaying the Welcome screen. 5 4 3 2 1 Welcome screen Did You Know? You can hide the Welcome screen. On the Welcome screen, select the Don’t Show Again check box. You can set launch preferences to customize how Flash starts. Click the Flash (Mac) or Edit (Win) menu, click Preferences, click the General cate- gory, select an option from the On Launch list arrow, and then click OK. 4 2 Don’t Show Again check box From the Library of Wow! eBook ptg Chapter 1 Getting Started with Flash CS5 5 Start Flash in Macintosh Open the Applications folder (located on the main hard drive). Double-click the Adobe Flash CS5 folder. Double-click the Adobe Flash CS5 application icon. If you’re starting Flash CS5 for the first time, you might be prompted to specify the following: ◆ Enter or create an Adobe ID to register the product, click Submit, and then click Done. The Flash Professional CS5 window opens, displaying the Welcome screen. 4 3 2 1 3 1 Shortcut for Adobe Flash CS5 Did You Know? You can create a shortcut on the Macintosh. Drag and drop the Flash application to the bottom of the monitor screen, and then add it to the dock. You can work in other programs as Flash starts up. When you start Flash, the Welcome screen no longer stays in front, so you can work in other pro- grams ( New! ) . Launching Flash and Opening a Document You can also start Flash and open a Flash document at the same time. Double-click the Flash file icon in Windows Explorer (Win) or in a Macintosh folder (Mac). You can identify a Flash document by the file icon or FLA file extension. A file extension is a three-letter suffix at the end of a filename that identifies the file type for the operating sys- tem. The Macintosh doesn't need to use file extensions, but added the feature to promote cross platform use. In the Mac Operating System (OS) 10 or later, you have the option to show or hide file extensions. When you are working on both platforms, using file extensions on the Macintosh allows Windows and Flash to recognize and open the files. For Your Information From the Library of Wow! eBook ptg 6 Chapter 1 Tools Panel Contains drawing and other related tools to create and manipulate graphics. Property Inspector Displays information about the properties and attributes of tools and graphic elements. Viewing the Flash Window Panel Windows Gives you access to authoring tools and attribute settings for elements. Welcome screen Provides easy access links to create and open Flash documents. From the Library of Wow! eBook ptg Chapter 1 Getting Started with Flash CS5 7 Document Window Displays open Flash documents, which include an Edit bar, Timeline and Stage. Edit Bar Displays what editing mode you are working in and allows you to switch scenes. Stage Provides a place to compose the content for individual frames, which includes drawing artwork or arranging imported graphics. Timeline Gives you a visual represent- ation of every frame, layer and scene in the document. From the Library of Wow! eBook ptg 8 Chapter 1 Before you begin to create a movie in Flash, it's important to develop a project plan first. The project plan provides a site map for you to follow as you build your project in Flash. Without a project plan, you'll inevitably hit road blocks, which will cause you to waste time redesigning all of or portions of the movie. Planning a movie project involves determining its purpose, identifying the audi- ence, logically developing the content, organ- izing the structure of the content, developing the layout and design, and identifying the delivery computer system. With a project plan in place, you'll be ready to create a movie in Flash. Plan a Movie Creating a movie can take a long time; it's worth the effort to plan carefully. The ten- dency for most first-time Flash developers is to start creating a movie without carefully planning the project. Before you begin, you need to develop and follow a plan. Otherwise, you might end up spending a lot of time fix- ing or completely changing parts of the movie, which you could have avoided from the beginning. You need to figure out the goal of the project, the look and feel of your pro- duction, its length and size, how it will inter- act with the viewer, and how and for whom it will be distributed. When planning a movie, it's important to accomplish the following: Determine the purpose Is it for training? Sales? Entertainment? Informing? The answer will determine the types of features you may want to include or exclude in the movie. If the purpose is to cre- ate a training site, you might want to include simple navigation, easy-to-use instructional material, and a help system. On the other hand, if the purpose is to create a sales pro- motion, you might want to include eye-catch- ing graphics, videos, and audio to get users' attention and draw them into the presenta- tion. Identify the audience How you create your movie will depend on how you classify the intended audience. If the intended audience consists of novice com- puter users, you will have to concentrate on making the navigational controls and layout as simple to use as possible. If the users are experienced computer users, you can include more advanced features and interactions. Develop the content and organize the structure The most beneficial planning tools for the multimedia developer are the script and schematic flowchart. The script tells the story of your movie production in text form. Just like in the movies, a script is used to describe each section, to list audio or video, and to provide a basis for the text that will appear onscreen. Schematic flowcharts are the best way to sketch the navigational structure of a movie and make sure that each of the sec- tions is properly connected. After you have the script and schematic flowchart mapped out on paper, you will quickly see the correla- tion between what you have developed and what you will begin to set up in Flash. Develop the layout and design of the movie The storyboard tells the story of your movie in visual form. It helps you design the layout of each screen in your movie. The storyboard follows the script and develops visual frames of the movie's main transitional points, which help you develop the Flash media elements Creating a Project Plan From the Library of Wow! eBook ptg Chapter 1 Getting Started with Flash CS5 9 you will use to create your movie. A story- board can take a long time to develop, but the media elements you assemble and create in the process will shorten the overall develop- ment time. As you develop your layout and design, be sure to keep: ◆ Navigation easy to understand and consistent from page to page, such as navigation bars or drop-down menus ◆ Tex t e a sy t o r ead ◆ Sound and animation limited ◆ Movie file sizes as small as possible for fast downloads. Break up large files into small ones for easy management ◆ Color consistent and appropriate for the audience ◆ Content accessible to users with visual or auditory impairments Identify the delivery computer system and browser to be used for playback Some computers are more up-to-date than others. You need to determine the minimum computer hardware and software require- ments in which your movie will be delivered. The hardware and software requirements will determine what types of media you can use and how the movie will play back. Some hardware requirements you need to consider for the delivery computer system are (1) CPU (central processing unit), which deter- mines the speed with which your computer can compute data; (2) RAM (system memory), which determines how fast files load and how smoothly they run; (3) Sound cards, which determine if you can use sound files; (4) Video cards, which determine the quality and speed of the graphic and video display, and (5) Monitor resolution, which determines the color display (number of available colors), size (1024 x 768 is typical, while 1440 x 900 is becoming more and more available), and overall look of your movie. Some software requirements you need to consider are the operating system version and supported browser type and version. See “Preparing to Install Flash” on page 2 for spe- cific details about these requirements. Sample script Sample flowchart From the Library of Wow! eBook ptg 10 Chapter 1 After you develop a project plan, you can use Flash to create a movie according to the plan. Creating a movie involves six main steps: set- ting up movie properties, assembling media elements, positioning the media elements on the Stage and sequencing them in the Timeline, adding custom functionality and interactive elements, previewing and testing the movie, and finally publishing or exporting the movie for distribution. Build a Movie with Flash Before you start creating a movie using Flash based on your project plan, it's important to understand the process of developing Flash software. The basic steps for developing inter- active multimedia software with Flash are listed below. Step 1: Set up document properties Before you start a Flash project, you need to create a new document and set up initial doc- ument properties, such as the user’s viewable screen size, for how your movie looks and operates. It is important to specify document property settings that affect the entire movie at the beginning of the project, such as how colors are defined and the size and location of the Stage, so you don't have to redesign the movie later. Step 2: Create or import media elements Media elements include graphics, images, buttons, videos, sounds, and text. You can cre- ate new media elements in Flash or import ones that have already been developed. Flash provides several tools for creating media ele- ments, including shape and paint tools, and text creation tools. You can also add media elements from the Library, a media storage area. Media elements are either static or dynamic. Static media is an element, such as text or graphics, created or imported into a movie that doesn’t change unless the author makes the change and republishes the movie. Dynamic media is an element, such as data, MP3 sound, a JPEG image, or Flash Live Video (FLV) video, stored outside of the pub- lished movie and loaded when needed or changed by scripting, which makes updating easy, keeps file sizes down, and provides per- sonalized information to the user. Step 3: Position the elements on the Stage and sequence them in the Timeline The Stage is the viewing area you use to dis- play where media elements appear in a movie, and the Timeline is the area you use to organize what you want to occur at the time and duration you specify. You use the Stage to create the look and feel for your production; you use the Stage and Timeline together to arrange the media elements in space and time. The Stage represents the media ele- ments' position in space (where) and the Timeline represents the media elements' position in time (when). Step 4: Add navigational components, interactive behaviors, and motion effects Scripting allows you to add custom function- ality to your movie, such as moving objects on the Stage, formatting text, storing and managing information, performing mathe- matical operations, and controlling the movie in response to specific conditions and events, such as a mouse click. In Flash, scripts are written in ActionScript, a Flash-specific pro- gramming language. To help you get started scripting and save you some time, Flash comes with built-in components, and scripts called behaviors . Components are elements you can use to quickly create a user interface. For example, components can include Building a Flash Project From the Library of Wow! eBook . Netscape 7.x, Mozilla 1. x, CompuServe 7, F i r e f o x 1. x , A O L 9 , o r O p e r a 7. 11 . ◆ For Macintosh OS X 10 .1. x - Mac X 10 .4.x. Safari 2.x, Internet. 9, or Opera 7. 11 . ◆ For Windows 2000. Internet Explorer 5.x, Netscape 7.x, Mozilla 1. x, Firefox 1. x, CompuServe 7, AOL 9 , or O p era 7. 11 . ◆ For Windows