| As you saw in the previous exercise, it is possible to create a playback controller that can be used in Captivate. You can also create buttons used to navigate to various slides, sections, and even Web sites in Captivate. Where Captivate buttons differ from those used on Playback Controllers is the addition of a third button state (Figure 9.11). In Captivate, buttons can have Up, Over, and Down states, whereas playback controllers can have only Up and Down states. Figure 9.11. Add buttons to Captivate slides using the Button dialog box. Note the three button states. 
Though buttons can be any size, it is best to keep them small. The width can range from 60 to 100 pixels, and the height can range from 20 pixels to the width of the button (if it is to be square). Buttons also must be saved as BMP images and should fill the entire canvas in Fireworks. This exercise won't give you the step-by-step instructions for creating the artwork used in the button. Those instructions were presented in the previous section. To create a Fireworks button 1. | Open a new Fireworks document with a canvas size of 150 pixels wide and 150 pixels high. Set the canvas color to white. Draw a rectangle that is 70 pixels wide by 20 pixels high, fill it with a color or pattern, apply a small bevel to the image, and add the word Next to the image (Figure 9.12).
Figure 9.12. The artwork for the Captivate button has been created in Fireworks MX 2004. 
| 2. | Single-click the canvas and, in the Property Inspector, click the Fit Canvas button.
The canvas shrinks to the exact dimensions of the button.
| 3. | Press Control-A (PC) or Command-A (Mac) to select all of the objects on the canvas. Press Control-G (PC) or Command-G (Mac) to group the selected objects.
| 4. | With the objects still selected, press the F8 key (Mac and PC) or select Modify > Symbol > Convert To Symbol.
The Symbol Properties dialog box opens. Name the symbol and select Button as the symbol type (Figure 9.13).
Figure 9.13. The artwork is converted into a button symbol in Fireworks. 
| 5. | Double-click the green overlay on the button.
The Button Symbol Editor opens.
| 6. | Select the Over tab and click the Copy Up Graphic button.
| 7. | In the Property Inspector, open the Bevel effect and select Inset from the Preset Values pop-down menu (Figure 9.14).
Figure 9.14. Changing the preset to Inset causes the button to darken when the user rolls the mouse over it in Captivate. 
| 8. | Select the Down tab, click the "Copy Over Graphic" button and change the preset to Inverted. Click Done.
You are returned to the Fireworks canvas.
| 9. | Select File > Export Preview and select BMP 24 as the format. Click the Export button.
The "Export options" dialog box opens.
| 10. | Navigate to the C:\Program Files\Macromedia\Captivate\Gallery\Buttons folder.
| 11. | Name the image.
In this example, I used VQSGoo_up.
| 12. | From the "Save as type" pop-down, select Images Only.
| 13. | From the "Export slices" pop-down, select "Export slices." Click Save.
| 14. | Select File > Save As to save the button as PNG image, and save it to another folder on your computer. This will be the back up copy containing the all of the button states should you have to revisit the button. Quit Fireworks.
| 15. | Open the Buttons folder in which you saved the images, and rename the Over and Down buttons.
| 16. | Open the Captivate movie in which the button will be used.
| 17. | Select Insert > Button (which opens the New Button dialog box) or, if a button already exists, double-click the button in the Edit View panel (opens the Button dialog box).
| 18. | In the Type pop-down, select "Image button."
| 19. | Click the Navigate button (it has three dots) under the Up image preview. Navigate to the Buttons folder and select the Up button (VQSGoo_up).
Do this for the other two buttons (VQSGoo_over and VQSGoo_down). Click OK.
The button appears in the slide (Figure 9.15).
Figure 9.15. Add the Fireworks button to Captivate using the Button dialog box. 
|
|
