A bevel effect can be applied to create a 3D effect to any object in Adobe Fireworks CS3. A bevel effect can be applied to create an inner or outer bevel. Keep reading to find out how you can apply this effect to your Firework objects.

1. Start Adobe Fireworks CS3, and open a document from your files that contains an object to which you would like to apply a bevel effect.
2. Step 2

   Choose the Pointer tool from the Fireworks toolbox and click on the object to which you want to apply the bevel. The object will appear with a blue outline around it once it is selected. The “Properties” pane at the bottom of the screen will display the properties for the selected object.

3. Step 3

   Click the “+” button to right of the word “Filters” on the right side of the “Properties” pane to display the effects that can be applied to the selected object in the form of a pop-up menu.

4. Step 4

   Point to “Bevel and Emboss” and choose either “Inner Bevel” or “Outer Bevel.” “Inner Bevel” will bevel the selected objects inward into the canvas while “Outer Bevel” will bevel the object outward from itself. The effect will be immediately applied to the selected object.

5. Step 5

   Double-click on the bevel effect in the list of effects under the word “Filters.” A small window will appear that contains the settings for the bevel effect.

6. Step 6

   Use the menu at the top of the window to choose the type of bevel you would like to apply.

7. Step 7

   Set the width, contrast, softness and angle of the applied bevel.

Adobe Fireworks is an excellent package for creating web content and can also be used for some desktop creations, including newsletters and brochures. Because Fireworks is a vector-based graphics application, the images created are scalable and can be ported to many other packages, both web-based and print. Newsletters can be in various sizes although the standard for most is 8.5 inches by 11 inches. By creating the newsletter in Fireworks, you also have the ability to convert it to a PDF.

1. Launch Adobe Fireworks. Open a new document (Ctrl+N), and choose a size. The standard size for newsletters is usually 612 px by 792 px (8.5 inches by 11.0 inches).
2. Step 2

   Choose a font from the menu “Text > Font.” The heading (masthead) is going to be the largest of the text on the page.

3. Step 3

   Choose a size for your newsletter heading from the menu, “Text > Size.” A size of 48 works well to start although you can reduce or enlarge it later.

4. Step 4

   With the text still selected, in the Properties dialog box, choose a color for your font. See Tip 4a for more color options.

5. Step 5

   Select the Rectangle tool from the Tools menu bar. (Type letter “U” on the keypad).

6. Step 6

   Choose the text and font you will be using. You can do this by clicking “Type > Font” from the Menu and selecting the font style you wish to use. This should be the type logo and associated subheadings for your front cover magazine.

7. Step 7

   Select the Pointer Tool from the Tools menu to vary the chosen font effects, and click on the heading.

8. Step 8

   Choose the Scale option from the Tools menu (Click letter “Q” on the keypad). This will enable you to re-size the type as large as you wish. Add additional smaller type for subheadings as preferred. You are now ready to add the body of type to your newsletter.

9. Step 9

   Select the Text Tool (letter “T”) from the Tools menu. Hold the left mouse button and create a text box by dragging the cursor to form a square. This is where you will enter the content of your newsletter. See Tip 9a.

10. Step 10

    Type the newsletter content into the text box or paste it in from another source.
    The text box will fill as you type and you can use the Selection Tool to drag and re-size the content.

11. Step 11

    Bring your photos or images to the document by dragging the selection into the new document or use the Import command from the File drop-down options on the menu. Once the selection is inserted, you can re-size or re-position your image.

Prototyping is one of the many uses of Adobe Fireworks. You can develop a website very quickly from this application and maintain the richness, power and flexibility of vector graphics. Once you have exported your Fireworks file to HTML, you will have the ability to continue to build, edit, enhance or change the entire look of your webpage. Adobe Fireworks works very closely with Dreamweaver, a companion product for building websites and includes rich HTML editing features. Also, Adobe Fireworks allows you to bundle and categorize your graphic images in separate “Image” files, making it easier to locate each individual component. In web parlance, these are called ‘Assets.”

1. Launch Adobe Fireworks.
2. Step 2

   Open your Fireworks application with the associated files you wish to convert.

3. Step 3

   Click “File > Export” from the file menu or (“Ctrl+Shift+R”). The “Export” dialogue box appears.

4. Step 4

   Choose where you want your website to reside by navigating to the target directory in the “Save in” drop-down box. Optionally, you may choose to keep this file in the same directory as your websites.

5. Step 5

   Type in the name of your file in the “File name” text entry field, or you can let the “File name” field default to the name Fireworks has chosen.

6. Step 6

   Choose “HTML and Images” from the “Save as type” drop-down box. Make sure you choose this option. Any other type will not create the website and its associated images.

7. Step 7

   Click the “Put Images in Subfolder” checkbox. This will place all of your graphic images in a separate subfolder in your target directory.

8. Step 8

   Click “Save.” The HTML files and associated images have been created.

9. Step 9

   Test the new webpage by navigating to the directory you created and clicking the HTML file.

When you first enter text into an Adobe Fireworks CS3 document, the text lies on a perfectly straight horizontal path. You can change this path by attaching the text to a shape or a wavy line. Attaching text to a path is a great way to create circular or wavy text in your Fireworks document.

1. Start Adobe Fireworks CS3 and open an existing document that contains a shape or line that you would like to attach a block of text too. Alternatively, you can create a new blank document and use the “Text” tool and “Shape” tool or “Line” tool to create your text and shape or line.
2. Step 2

   Choose the “Pointer” tool from the Fireworks toolbox on the left side of the screen, if necessary.

3. Step 3

   Select the shape or line you want to attach text to by clicking on it with your mouse.

4. Step 4

   Hold down the “Shift” key on your keyboard and click the text you want to attach to the already selected shape or line. Both the shape or line and text should be selected now. You can tell they are selected because they should be surrounded by a blue sizing handles surrounded them.

5. Step 5

   Choose the “Text” menu and click on “Attach to Path” to attach the text to the shape or line. The text should automatically be brought up to follow the top path of the shape or line.

Web banners are images you design to include any information or digital pictures online. Use banners as marketing tools to promote a band, offer a service or display a business. With a graphics application like Adobe’s Fireworks, you can easily create your own professional-looking banner and optimize it for the Internet, even if you don’t have design experience.

1. Launch the Adobe Fireworks application and create a new file. Click “File,” then “New.”
2. Step 2

   Assign a banner size in the “New Document” dialog window by typing in a width and height in pixels. A common banner size is 468 pixels wide by 60 pixels high, but you can specify this value as preferred. Continue by setting the resolution to “72″ and click the “Transparent” radio button so that you do not get any unwanted colors in the background of your banner. Click the “OK” button when finished.

3. Step 3

   Click a shape button on the “Tools” menu, such as the “Rounded Rectangle,” and drag your mouse along the canvas. Add or change the color by clicking the “Fill Color” button in either the “Properties” or “Tools” menu and select the shade that you want for your banner.

4. Step 4

   Add text to the design by clicking the “Text tool (T)” button in the “Tools” menu and then double-click an area in your banner to begin typing. You can format the font, changing the color or font face, by dragging your mouse over the text to select it and clicking the associated buttons in the “Properties” menu to enforce the changes.

5. Step 5

   Insert images into your banner to enhance the design. Click “File,” then “Import.” After you select your graphic, drag your mouse until the image is the size you prefer and apply a special setting, such as a drop shadow, by clicking the “Filters” button in the “Properties” menu.

6. Step 6

   Preview your work to ensure it’s the quality you desire. Click “File,” then “Image Preview.” Assign a “GIF” file type if your banner does not include digital images; otherwise, select the “JPG” option from the “Format” drop-down menu. Set the “Quality” by typing in a percentage, such as 80 percent, and keep in mind that the higher the quality, the larger the file. Click the “OK” button when finished.

7. Step 7

   Name and save your finished banner. Click “File,” then “Save.” Enter a title in the “Save As” text field, locate the destination folder for your file and click the “Save” button when done.

While you are creating your animation in Adobe Fireworks CS3, you will need to preview the animation to see if you are getting what you want out of the animation. There are animation control buttons in Fireworks CS3 that allow you to easily play, stop and move around the frames in your animation. This is a great way view your progress.

1. Start Adobe Fireworks CS3 and open an existing document from your files that contains an animation that you would like to preview in Fireworks.
2. Step 2

   Locate the animation controls in Fireworks CS3. The animation controls are located just underneath your document on the bottom right side.

3. Step 3

   Click the second button on the animation controls to play the animation in Fireworks. You also use this same button to stop the animation from playing.

4. Step 4

   Jump to the first frame by clicking the first button on the animation controls.

5. Step 5

   Press the third button to move to the last frame of the animation. Notice that there is a number after the third animation button. This number tells you what frame you are currently on in the animation.

6. Step 6

   Use the fourth button, after the frame number display, to go to the previous frame in the animation.

7. Step 7

   Skip to the next frame in the animation by clicking the fifth button.

If you have already applied a filter to an object within Adobe Fireworks CS3, you may find that you want to modify some of the properties of that filter. Instead of recreating the filter, you can simply use the Properties inspector to modify the settings of that filter.

1. Start Adobe Fireworks CS3 and open an existing document from your files to which you have already added a filter and now you want to modify it.
2. Step 2

   Select the object or one of the objects that the filter you want to modify is applied to in your Fireworks document. The “Filters” section of the Properties inspector will then be displayed.

3. Step 3

   Click on the “info button” in front of the filter that you want to modify from the “Filters” list in the Properties inspector. The info button is depicted by the letter “i” inside of a blue circle. A pop-up box will appear with the details of that filter. If a pop-up box does not appear, you are not able to modify that filter.

4. Step 4

   Use the settings in the filter pop-up box to modify the filter until you get the changes you want.

5. Step 5

   Click in a blank area in the document to enter the changes the filter and close the filter pop-up box.

6. Step 6

   Use the same method to modify any other filters within your Fireworks document that you would like to modify. You can go back at any time in the document’s life and change these filters using the same method outlined above.

A bitmap mask is a great way to hide and emphasize objects within your Adobe Fireworks CS3 document. After you have created a mask and linked it to certain objects, you may decide that you want to edit that mask. You can do this by changing the shape of the mask, removing objects, changing colors or transforming the mask.

1. Start Adobe Fireworks CS3 and open an existing document from your files that contains a bitmap mask that you would like to edit.
2. Step 2

   Click on the layer in the Layers palette that contains the bitmap mask you would like to edit. The layer will be highlighted in gray once it is selected.

3. Step 3

   Use the brush, shape or line tools to edit the current shape of the selected mask.

4. Step 4

   Change the colors of the tools you are using to change the colors that the mask uses to cover the layer.

5. Step 5

   Remove objects included in the mask by clicking to selecting the object you want to remove, choosing the “Edit” menu and clicking “Cut” to remove the selected object.

6. Step 6

   Transform the mask by choosing the “Modify” menu, pointing to “Transform” and selecting to skew, scale rotate or flip one of the objects included in the mask.

7. Step 7

   Save the new mask when you are finished editing it. You can go back and edit the mask at anytime.

If you have a scanner along with Adobe Fireworks CS3, you can directly scan any photo or document from your scanner to Fireworks. When you do this you can choose to scan in color and crop the image before you scan it.

1. Put the image you want to scan in Fireworks in your scanner and start Adobe Fireworks CS3 on your computer. The way you should place your image in the scanner is based on the instructions for how to scan outlined in your scanner manual.
2. Step 2

   Choose the “File” menu, point to “Scan” and click on “Twain Select” to open the “Select Source” dialog box.

3. Step 3

   Click on the name of your scanner in the “Sources” text box of the “Select Source” dialog box. Click the “Select” button. This action tells Fireworks what scanner you want to use to scan the image.

4. Step 4

   Select the “File” menu, point to “Scan” and click on “Twain Acquire” to open the “Twain Acquire” dialog box.

5. Step 5

   Verify that “Scan to Adobe Fireworks” is selected in the text box of the dialog box. Check the option to scan the image in color if you would like and choose the option to “Select parts of a page or View page first” if you want to crop the image before scanning it.

6. Step 6

   Use the “Scan” button from the “Twain Acquire” dialog box. The dialog box will close and the image will be scanned into Fireworks.

Fireworks is an Adobe application used for images. Fireworks has the capabilities to create animations and Flash files that are useful for web design or MySpace pages. Create a homemade animated gif and upload it to your MySpace page, send it in an email or use it to brand your website. Learn how to make an animated .gif with Fireworks and create a personal design suited to your style.

1. Create a desktop folder. Find an image to animate and drag it to the folder. Launch the Fireworks application and choose to open the file in the menu panel under file and open in the drop-down menu. You may choose any type of image you desire. For this example, I am going to use a moose.
2. Step 2

   After you have opened the image, the Fireworks application will display windows for properties or you can choose to display them under the menu panel windows. Choose Layers and Frames. A window will open displaying the options available for the layers and frames. Using the lasso tool in the tool panel, select the area that you will be animating. For this example, I am going to make the moose walk across the street, so I will select the entire moose. To make the selection cleaner, zoom the scale up to 150%. Select the area as close as possible.

3. Step 3

   Copy the selected area and cut it. Open a new document in Fireworks. Choose to have a transparent background and make the new document the same size as your original document. Paste the selected cut image into the document and save it to your folder. Zoom the new image to 150% or larger and clean up the edges by erasing them with the eraser tool. Save the image.

4. Step 4

   Fill in the area that was cropped using the marque tool copy selections of the background and paste them over the cropped area. Use the Smudge tool to make it appear as if nothing was cut from the background. On the menu, go to the option Modify and choose Flatten Layers in the drop-down menu after you have cleaned up the original document. This document will serve as a backdrop for the entire animation. Save the image.

5. Step 5

   On the panel area of the Fireworks, add frames. For this example, I used four frames. Copy the background and paste it into each frame. Select the first frame and open the second image made. Copy the image and paste it into frame one. Go to frame two and paste the same image, moving it forward slightly. Repeat this step into each frame. On the frame panel set the time delay and test your animation. Saving your document, use the option export wizard to generate a .gif after it is saved. Choose to browse the new animation in the browser when the animation is displayed. Drag it to the desktop and your .gif is created.