In this tutorial you'll create a simple promotional web page for the fictitious Double Identity movie website. The page will consist of an interactive SWF header at the top of the page (see Figure 1) with supporting text filling out the layout. Along the way, you'll explore the Adobe CS4 product workflow and learn the fundamentals of creating mockups and interactive content.

Figure 1. Fireworks mockup for the web page's header movie

The mockup shown in Figure 1 is a focal point for the tutorial. First you'll gather supplied media assets in Adobe Photoshop, Adobe Illustrator, and Adobe Soundbooth. Then you'll create a mockup for the header in Adobe Fireworks and transform it into an interactive movie in Adobe Flash Professional. To wrap things up, you'll produce the final site files in Adobe Dreamweaver, along with a few notes about editing the files.

When you've completed this tutorial, you'll have the knowledge you need to navigate the CS4 workflow to create your own projects. The tutorial takes approximately an hour and a half to complete.

Requirements

To complete the tasks demonstrated in this tutorial, you need the following software and files:

Fireworks CS4

• Try
• Buy

Flash CS4 Professional

• Try
• Buy

Dreamweaver CS4

• Try
• Buy

or Creative Suite 4 Web Premium (includes Fireworks, Flash, and Dreamweaver)

• Try
• Buy

Sample files:

• cs4_project.zip (ZIP, 11 MB)
• cs4_project_completed.zip (ZIP, 24 MB)

Prerequisite knowledge

This tutorial is geared towards beginning level users interested in getting up-to-speed on web-production workflows using Adobe CS4 products.

Page 1 of 6

Next Page

About the author