110 likes | 272 Views
CIS 205—Web Design & Development. Flash Chapter 1 Getting Started with Adobe Flash CS3. Chapter 1: Getting Started with Adobe Flash CS3. Introduction
E N D
CIS 205—Web Design & Development Flash Chapter 1 Getting Started with Adobe Flash CS3
Chapter 1: Getting Started with Adobe Flash CS3 • Introduction • Flash is a development tools that allows you to create compelling animations, games, and simulations delivered via the Web, DVD, or even cell phones • Flash is now extremely common and popular because it is optimized for the Web • Flash uses vectorimages which have much smaller file sizes and are scalable (can be resized and reshaped without distortion) • Flash allows for streaming so that a Flash movie can start playing when a Web site is opened instead of waiting until the entire file is downloaded.
Lesson 1: Understand the Flash Workspace • Organizing the Flash Workspace • The Flash workspace is the set of tools and panels on the screen • Flash operates much like a movie • You create scenes on a stage • The scenes run in frames on a Timeline • You arrange objects (graphics and text) on the stage • Then you animate the objects using the Timeline • Playing the movie (Flash document) is done with controls (start, stop, rewind, etc.) • The workspace has a menubar, a stage, and a Timeline
Lesson 1: Understand the Flash Workspace (2) • Stage • The stage contains all objects in the movie • The stage has a size and a backgroundcolor • The Pasteboard is the gray area surrounding the stage • Objects on the stage will appear when the movie is played in a browser or the FlashPlayer • Timeline • The timeline controls when objects appear on the stage • A movie is a series of still images that appear over time • Images are contained within frames which are segments of the Timeline • Objects can appear in separate overlapping layers
Lesson 1: Understand the Flash Workspace (3) • Panels • Panels are used to view, organize, and modify objects and features in a movie (Flash document) • Tools panel • Property inspector (e.g., document properties) • Library panel • Tools panel • The Tools panel contains a set of tools for drawing • Tools (draw, paint, text, selection) • View (Zoom, Hand) • Colors (for changing the stroke and fill colors) • Options (brush size, etc.) • Panels can be moved using drag/drop within blue zones
Lesson 1: Understand the Flash Workspace (4) • Start Adobe Flash and work with Panels • Start the Adobe Flash program (the Open/Create screen appears) • Under Create New, click Flash File (ActionScript 3.0) • Click Window on the menu bar, point to Workspace, then click Default • Click Window on the menu bar, observe the panels with check marks (these are displayed), then click HidePanels • Click Window on the menu bar, click Color • Click Window on the menu bar, click Library
Lesson 1: Understand the Flash Workspace (5) • Start Adobe Flash and work with Panels (cont’d) • Click Window on the menu bar, point to Properties, click Properties • Point to the far left of the workspace until the Toolspanel is displayed, then point to the right • Click the Library tab and drag to the stage to make it a floating panel • Click the Library tab and drag to the Colortab until a bluerectangle appears and drop (it is then grouped with the Color panel) • Click the Collapse to Icons button (two right arrows in the upper right corner of the grouped panels)
Lesson 1: Understand the Flash Workspace (6) • Start Adobe Flash and work with Panels (cont’d) • Click the Color panel icon to display the Color panel, click it again to hide the Color panel • Click the Expand Dock button (two left arrows in the panel group) to expand the panel group • Click the Library tab and drag to the bottom of the Color panel until a blue line appears and release (the Library panel is docked below the Color panel)
Lesson 1: Understand the Flash Workspace (7) • Start Adobe Flash and work with Panels (cont’d) • Click the Properties panel Collapse button (short line in upper right corner of the panel) to collapse the panel • Click the Properties panel Expand button in the upper right corner of the panel to expand the panel • Click the Properties panel Close button (the X) • Click Window in the menu bar, point to Properties, click Properties • Click Window on the menu bar, point to Workspace, click Default
Lesson 1: Understand the Flash Workspace (8) • Change the Document Properties • Click the Size button in the Property inspector (PI) to display the Document Properties dialog box • Click inside the Title text box, type Myworkspace • Click inside the Description text box, type This is a typical workspace setup • Double-click the number in the width text box, type 400, double-click the number in the height text box, type 300 • Click the Background color swatch, click the blue color swatch in the far-left column, click OK • Drag the scroll bars to center the stage
Lesson 1: Understand the Flash Workspace (9) • Change the Document Properties (continued) • Click View on the menu bar, point to Magnification, click Fit to Window • Click File on the menu bar, click Save • Navigate to the drive and folder where your data files are stored, type workspace for the file name, click Save • Click File on the menu bar, click Close