After previewing the completed page mock-up, you're ready to begin your project.

  1. In Fireworks, select File > New.
  2. In the New Document dialog box, enter 700 for the width and 600 for the height. Ensure that both measurements are in pixels.
  3. Set the Canvas color to Custom and select black from the custom color menu.

    The New Document dialog box should look as follows:

    This is a picture of the feature being described.

  4. Click OK to create the document.

    A Document window appears with a title bar that reads Untitled-1.png (Windows) or Untitled-1 (Macintosh).

    If the Document window isn't maximized, that is, if it doesn't fill the center of the screen, maximize it by clicking the Maximize button (Windows) or the zoom box (Macintosh) at the top of the Document window. This step will give you plenty of room to work.

  5. Select File > Save, and then browse to the following folder on your hard disk:

    local_sites/cafe_townsend/fireworks_assets/

  6. Name the file homepage-mockup.

    NOTE

    On the Macintosh, select the Add Filename Extension option if it's not already selected.

  7. Click Save.

    The title bar displays the new filename with a .png extension. PNG is the native file format for Fireworks. The PNG file is your source file. It's where you'll do all of your work in Fireworks. At the end of this tutorial, you'll learn how to export your document to another format for the web.