Lesson 6 cs5


Published on

Published in: Technology, Art & Photos
  • Be the first to comment

Lesson 6 cs5

  1. 1. Learning Web Design with Adobe CS5 Dreamweaver ® Fireworks ® Flash ®
  2. 2. Create Dynamic and Interactive Pages: Lesson 6, Exercise 47 <ul><li>Spry is a JavaScript library in Dreamweaver CS5 that allows Web designers to build pages offering interesting interactive options. </li></ul><ul><li>Using the Spry framework, you can add interactive or dynamic tables to a Web page that draw data from XML sources. </li></ul><ul><li>Insert Spry widgets such as menu bars, collapsible panels, or form fields with built-in validation; or apply Spry effects such as Appear/Fade or Highlight to give page content extra emphasis. </li></ul>
  3. 3. Create Dynamic and Interactive Pages: Lesson 6, Exercise 48 <ul><li>Timeline. A special panel where you organize and control content using layers and frames. </li></ul><ul><li>Property inspector. A panel that displays the most commonly used attributes for the currently selected item. You can view and modify the attributes in the Property inspector. </li></ul><ul><li>Toolbars. Flash displays the Edit Bar by default in the work area. To display the other toolbars, choose the Window > Toolbars menu command and click the toolbar you want to add. </li></ul><ul><li>Panels . Panels along the right side of the Stage in which you select options to control the behavior or appearance of the selected object. The panel name appears on its title bar. You can collapse or expand panels as needed. </li></ul><ul><li>Stage. The rectangular area where you create content and preview the file. </li></ul><ul><li>Pasteboard . The gray area outside the Stage, where you store content that you do not want to display when the file plays. </li></ul>Document tab Edit bar Stage Timeline Property inspector Tools panel
  4. 4. Create Dynamic and Interactive Pages: Lesson 6, Exercise 48 <ul><li>The timeline is a vitally important part of arranging, ordering, and timing your Flash projects. </li></ul><ul><li>The layers of your Flash document appear in the column on the left side of the timeline. </li></ul><ul><li>The frames in each layer appear in a row to the right of the layer name. </li></ul><ul><li>The timeline header shows frame numbers. </li></ul><ul><li>The playhead moves as the animation plays, showing the current frame (the one displayed on the Stage). </li></ul><ul><li>The timeline status bar shows the current frame number, the current frame rate, and the elapsed time of the current frame. </li></ul>
  5. 5. Create Dynamic and Interactive Pages: Lesson 6, Exercise 49 <ul><li>Flash has two drawing models: </li></ul><ul><li>Merge Drawing model. By default, Flash uses this drawing model, which automatically merges overlapping shapes. If you move or delete a shape that overlaps another shape, the underlying shape is permanently altered. </li></ul><ul><li>Object Drawing model. This model lets you draw overlapping shapes without them merging or affecting the appearance of other shapes on the Stage. </li></ul>
  6. 6. Create Dynamic and Interactive Pages: Lesson 6, Exercise 50 TERMS Elapsed time. The length of time it takes to reach the current frame when the animation plays. Frame-by-frame animation. Animation created by changing the content on each frame in a sequence. Frame sequence. A series of frames beginning with a keyframe and ending with the next keyframe. Keyframe. A frame in which you specify changes in an animation. Tweened animation. Animation in which you specify a starting point and an ending point and let Flash fill in the frames between.
  7. 7. Create Dynamic and Interactive Pages: Lesson 6, Exercise 51 <ul><li>The contents of the active layer display on the Stage. </li></ul><ul><li>You can insert a new layer at any time. By default, the new layer becomes the active layer. </li></ul><ul><li>Move layers in the Timeline list to rearrange their stacking order. For example, move a layer up in the list to move it toward the front of the frame. </li></ul><ul><li>It is a good idea to rename layers to reflect their contents. </li></ul>Layers
  8. 8. Create Dynamic and Interactive Pages: Lesson 6, Exercise 51 <ul><li>A symbol is a graphic object, movie clip, or button that you create once and can use many times. </li></ul><ul><li>You can create a symbol by converting objects already entered on the Stage, or you can create an empty symbol. </li></ul><ul><li>Any symbol that you create becomes part of the library for the current document; you can share symbols among documents. </li></ul><ul><li>You specify the symbol type in either the Convert to Symbol or the New Symbol dialog box. </li></ul><ul><li>To create a another instance of the symbol, simply drag the symbol you want to use to the Stage from the Library. </li></ul><ul><li>If you want to modify the original symbol that is saved in the Library, right-click the symbol and click Edit. The symbol opens on the Stage so that you can make changes. </li></ul>
  9. 9. Create Dynamic and Interactive Pages: Lesson 6, Exercise 51 <ul><li>In a Flash animation, the easiest way to create movement over time is to use tweening. </li></ul><ul><li>With motion tweening, you can animate the size, position, rotation, and skew of instances, groups, or type. Use motion tweening to animate Flash objects easily and modify properties. </li></ul><ul><li>Use shape tweening to animate a change in a shape over time. For example, you can make a square tween into an oval. Shape tweening only works on shapes. You cannot use shape tweening to animate groups, instances, type, or bitmap graphics. </li></ul>
  10. 10. Create Dynamic and Interactive Pages: Lesson 6, Exercise 52 <ul><li>In the Publish Settings dialog box, Flash displays a tab for each selected file format so you can select options such as dimensions, color settings, and image control settings. </li></ul><ul><li>On the Formats tab in the Publish Settings dialog box you select the type of files you want to generate. By default, Flash (.swf) and HTML (.html) are selected. </li></ul><ul><li>On the Flash tab, set image, sound compression, debugging, and file protection options; and select to generate a text file listing the amount of data in each frame of the final Flash Player file, if desired. </li></ul><ul><li>On the HTML tab, select an HTML template, and set parameters specifying options such as how to align the application on-screen, what size window to use, and the background color, as well as playback and quality options. </li></ul>
  11. 11. Create Dynamic and Interactive Pages: Lesson 6, Exercise 53 <ul><li>Multimedia files present information in the form of video sequences, animations, illustrations, and sounds. </li></ul><ul><li>The Media drop-down list on the Common tab of the Insert bar provides buttons for inserting several popular types of multimedia files. These files include Flash movies and objects, Shockwave movies, Java applets, ActiveX controls, and plugin files. </li></ul><ul><li>Plugin files require Netscape Navigator plugins for Netscape and Mozilla browsers. </li></ul>
  12. 12. Create Dynamic and Interactive Pages: Lesson 6, Exercise 54 <ul><li>You can create up, down, over, and over while down states for your buttons. </li></ul><ul><li>An up state is the normal state for the button on the page. </li></ul><ul><li>A down state is the state of the button when it is clicked. </li></ul><ul><li>An over state is the state of the button when the user positions the pointer on it. </li></ul><ul><li>An over while down state is the state of the button when it has been clicked and the user hovers the mouse over it. </li></ul>
  13. 13. Create Dynamic and Interactive Pages: Lesson 6, Exercise 55 <ul><li>You can create slices in your Fireworks image and save those slices as individual files. </li></ul><ul><li>Slices are used most often to add interactivity to your site. You can use slices in special elements, like pop-up menus, or use them to divide up large images into pieces that can be loaded progressively. </li></ul><ul><li>You can draw slices or create them based on existing objects in your Fireworks document. </li></ul><ul><li>Slices always occupy the Web layer of a Fireworks document. </li></ul><ul><li>In Fireworks, you use states to store the alternate images that create a rollover effect. When the mouse pointer triggers a rollover, the object in one state is hidden and the object in the other state is displayed. </li></ul>