QuickStart! - Adobe Fireworks CS3 Course

Fireworks has been around for a number of years. It's not as popular or well-known as some of the other graphics applications from Adobe, such as Photoshop or Illustrator, so it may be unfamiliar to you. But Fireworks is really quite a versatile program. Specifically, it's designed for creating and editing and optimizing web graphics. With Fireworks you can create and edit both bitmap and vector images. You can quickly and easily design web effects such as rollovers, navigation bars and pop-up menus. You can use Fireworks to crop and optimize graphics to reduce your file size and also save time by it allows you to automate repetitive tasks. Fireworks is smaller and much more focused and streamlined than either Photoshop or Illustrator, but does many of the jobs that web designers require from both of these workhorses, so rather than using both Photoshop and Illustrator, you can combine those activities just to one program, Fireworks. After creating or modifying your graphics, Fireworks will export or save your files as JPEGs, GIFs or one of another graphic formats, along with HTML files containing HTML tables and JavaScript code. All of these for use on the web. You can also export or save file types specific to other applications such as Photoshop or Flash if you want to continue working with these files in those programs. In addition, it's easy to make Fireworks the default image editor for authoring applications like Dreamweaver or Director. In the Fireworks tool panel, there are distinct sections containing tools for drawing and editing vectors or bitmaps. In Fireworks, the tool you select determines whether the object you create or edit is a vector or a bitmap. For example, the pen tool right here in the vector section creates and modifies vector images. Whereas the paintbrush tool here in the bitmap section of the tools window creates bitmap images. Notice that the text tool here is in the vector section. And using this tool you create and modify text. This text is vector. It can even be spell checked using Fireworks' great spellchecker. After drawing vector object, bitmap objects or text elements, you can use a wide variety of tools, effects, commands and techniques to enhance or complete your graphics. For example, you can apply filters to the images. You can go into the button editor to create interactive navigation menus in buttons like I have here. Here's the button editor. Notice when you do create these buttons they appear here in the library window here of the assets panel where a single modification is made to this master button. For example, let's change the color. Purple. And click done. We'll change all of the buttons that are based on that master symbol here in the library. We create interactive graphics in Fireworks by drawing slices or hotspots on your Fireworks canvasses using either the hotspot tool or the slice tool here in the web section of the tools panel. The slices tool creates these blue-green rectangles. This cuts or slices the graphic into different sections. To these sections you can apply rollover behaviors or animations or even URL links so that each of these slices links to a different URL page. You select the slice and then here in the link text field of the properties inspector type your link. Notice that right here I have some buttons and there slices around each one. I go to the preview panel. Notice that I can demonstrate these animations. So those slices make those animations possible. You can even take each of the slices and using the optimize panel, optimize each slice differently than the others so, for example, this slice I can optimize as a GIF. The adjacent slice as a JPEG. These slices then allow you to fine tune how your pages will be optimized. Those sections that optimize better is GIFs, you can slice those up and using the optimize panel here set the optimization export so that those files are exported as GIFs and those sections that are better optimized as JPEGs, slice those up and set them for JPEG here in the optimize panel.