Getting Started / What is Fireworks?
Subtitles of the Movie
If you've used Fireworks before move on to the next movies covering all the new features Adobe has implemented in its latest CS4 version of the application. If you've never used Fireworks before, let me continue with a summary description of this application. First off, Fireworks is a tool specifically designed for web designers and web developers and all visual designers. I get asked a lot about the differences between Fireworks and Adobe Photoshop and Adobe Dreamweaver since you'll be using usually all three programs together so let me answer these questions right off the bat. Fireworks is smaller and much more focused and streamlined than either Photoshop or Dreamweaver yet does many of the jobs that web designers require from both of these powerful work courses. Photoshop is the industry standard for digital imaging with a deep set of features and functionality, that are specifically designed for photographers, graphic designers, web designers, and many other creative professionals. On the other hand according to Adobe, Fireworks is a much more focused tool with features for prototyping vectors and bitmap images for the web and also for creating application interfaces, Adobe Dreamweaver is also an industry standard but this one for web designers and producers, it has a deep set of features for creating and modifying web pages and web sites, again, Fireworks is a much more focused tool with features for creating click through mock up web pages or for quickly updating fills, borders, textures, and text flows around other web page designs. With Fireworks you can create and edit both bitmap and vector images quickly and easily designing web effects such as rollovers, navigation bars, and popup menus, crop and optimize graphics to reduce their file size, and save time by automating repetitive tasks, after creating or modifying your graphics, Fireworks will export or save them as JPEG files, GIF files or files of another format along with the HTML files containing HTML tables and JavaScript code and new in Fireworks CS4 it can also export as CSS rather than tables, you can use these on any pages on the web or create individual unique pages with these graphics. You can also export or save a type of file specific to another application including Photoshop or Flash if you want to continue working in the other program. In addition, it's also easy to make Fireworks the default image editor for authoring applications like Dreamweaver or Director. In the Fireworks tools panel, notice that there are distinct sections for tools for creating bitmaps and tools for creating vectors. In Fireworks the tool you select determines whether the object you create is a vector or a bitmap, for example the pen tool here in the vector section will create vector based paths whereas the brush tool paints a bitmap object. The text tool down here in the vector section creates text that can be edited and even spell checked. After drawing vector objects, bitmap objects, or text objects, you can use a variety of tools, effects, commands, and techniques to enhance and complete your graphics. You can use the Fireworks tools in the button editor to create interactive navigation buttons like I have here in this example. Notice if I go to preview you can see that these are interactive because they're animating when I roll over them. You can also use the Fireworks tools to edit imported graphics in the JPEG, GIF, PNG, psd, and many other formats. You can also create interactive graphics in Fireworks by drawing slices and hot spots, if I move over to original view and turn on my show slices and hot spots you can see these, these are outlined in green, more on the slices and hot spots later in the tutorial but these slices cut an image into different sections to which you can apply rollover behaviors, animation, URL links and then export these sections using different settings. On a web page, slices can appear as either table cells or CSS formatting. Slices and hot spots have drag and drop rollover handles that let you quickly and easily assign swap images and rollover behaviors to the graphics directly in the workspace here. If I double click on one of these slices I get to the button editor, right here, which is a convenient Fireworks feature that helps you build special interactive graphics for navigating websites. One of the most important Fireworks features are the powerful optimization tools to help you find the balance or the right balance between small file size and acceptable visual quality when exporting graphics to your web pages, you'll find these either in the Window optimize panel or in the File, Export Wizard where you'll go through a wizard to help you determine your export settings, then you'll get to this image preview which helps you optimize your graphics using Fireworks handy preview two-up or four-up view that I have here helps you to compare the quality and the size of the exported graphics so you can make sure that they load quickly but still look good, that's the four-up, two-up, and preview. So there you have a quick overview summary of Fireworks, now that you're a bit more familiar with what this application is and what it can do. Let me move on and describe some of the more important new features in this CS4 version of the application.
Tutorial Information
| Course: | Adobe Fireworks CS4 |
| Author: | James Gonzalez |
| SKU: | 33999 |
| ISBN: | 1-935320-47-5 |
| Release Date: | 2009-05-21 |
| Duration: | 8 hrs / 90 lessons |
| Work Files: |
Yes |
| Captions: | Available on CD and Online University |
| Compatibility: |
Vista/XP/2000, OS X, Linux QuickTime 7, Flash 8 |
VTC Sign up & Benefits
- Unlimited Access
- 81,350 Video Tutorials (20,800 free)
- Video Available as Flash or QuickTime
- Over 782 Courses
- $30 for One Month Access
- Multi-User Discounts Available
United States 