Fireworks, like Photoshop, is a powerful professional tool used by designers and programmers alike. You can use this software for creating original graphics, to resize images, and even for making animated GIFs!

Fireworks also works well with Flash. You can export images to use with Flash animations.

Try this basic tutorial and then explore on your own!

Fireworks screen shot

Create a folder for your work

Start a New Document

From the toolbar select “File > New”
Width: 200
Height: 100
Pixels/Inch: 72

Create a Shape for Your Button
Click on Rounded Rectangle in the Tool Box

  1. Select a color
  2. Draw rectangle
  3. Use Pointer Tool to stretch and move

Add Effects To Rectangle

  1. Go to the Properties Window
  2. Click on the “+” next to “Effects”
  3. Scroll down to “Bevel and Emboss > Inner Bevel”
  4. Choose a good look for your button

add effect

Add Text to Your Button

  1. Select a color
  2. Select the Text Tool in the Tool Box
  3. Position cursor in your button and type
  4. Change font style and size
  5. Use the Pointer Tool to move text
  6. “Add Effects” from the Properties Window

Export As A JPEG

  1. Click in the grey “canvas” area
  2. Properties Window, “JPEG- Better Quality”
  3. From the toolbar select “File > Export”
  4. Save to your folder

export as jpg

Save As Workable File: “button.png”

  1. From the toolbar select “File > Save”
  2. Save to your folder

Use Layers to Create Many Buttons in One File

  1. Click on your text in the button
  2. From the toolbar select “Edit > Copy”
  3. From the toolbar select “Edit > Paste”
  4. Rename Text Layers in Layers Window
  5. Hide the first text layer
  6. Use the Text Tool to edit the new text

Export New Button As A JPEG

  1. Click in the grey “canvas” area of your document
  2. Properties Window, “JPEG- Better Quality”
  3. From the toolbar select “File > Export”
  4. Save to your folder

Repeat this process for as many buttons as you need.

finished button