WC.Project Builder 2.Int


This project begins with the Striped Umbrella site created in Dreamweaver – Assignment 5.

You have been asked to enhance the Striped Umbrella site by adding a Flash movie and changing a graphic image on the café page.  The idea is to replace the static crab logo image with a Flash animation that plays in the same space on the page.

Sample Completed Project Builder 2.Integration

  • In PhotoShop, open the crab_logo.psd file
  • Turn the visibility off and on for each layer to see the image is constructed
  • In Flash, start a new Flash File (ActionScript 2.0) and import the crab_logo.psd file to the Stage, specifying that each layer is editable and setting the Stage size to the same size as the PhotoShop canvas
  • In Flash, create an animation using the crab_logo.psd image – you decide on the type of animation, which could be a zoom or fade in; the entire crab moving; the crab claws moving; and so forth
    [Hint:  The crab image is made up of a body and left and right claws – if you want to animate these as one object, you can press and hold [Shift] to select all three, then convert them to a graphic symbol; include a rollover effect or some other form of user interaction]
  • Save the movie as crab_Anim.fla
  • Display the Publish Settings dialog box, deselect the HTML option and  publish the document
  • In Dreamweaver, open the Striped Umbrella site on the Files panel
  • Open the café.html page and  delete the café_logo graphic on the page
  • Insert the crab_Anim.swf file in the cell where the café _logo graphic had been
  • Select the Flash movie placeholder and use the Properties panel to play and stop the animation
  • Save your work
  • View the web page in your browser
  • Save your work in your folder and the "Assignment" folder for your class period