|
|
|
|
||
        |
|
 |
||||||||||||||||||||||||||||||
 |
 |
||||||||||||||||||||||||||||||
|
5 Smileys - 1 Smiley Poor, 5 Smileys Excellent
Platforms: Mac OS, Windows 95/98/2000/NT
Introduction Fireworks has grown up a lot since its first introduction to the Mac market, going from another option to a major player and leader in its graphic niche. With every release, Macromedia improves its product to such a degree, that it becomes almost necessary to get the update. This remains true with Fireworks 4. With the latest round of updates, Macromedia's commitment to the Internet is obvious with the integration of web elements in all of its applications. This is true also in Fireworks 4, which is designed to work well with Dreamweaver and Flash. As such, we have chosen to look at Fireworks 4 from two viewpoints, the graphic artist, who will want to use the traditional aspects of a graphical application, and the web designer, who will want to use a graphical application in conjunction with web applications and site design.
I use Fireworks constantly, but strangely enough, not for web graphics. Sure, Fireworks was designed from the ground-up for web design (and it does this superbly) but in the line of work that I do it still does a tremendous job of usurping the hallowed roles of Photoshop and Freehand when it comes to rapid graphics design. When I got my hands on Fireworks 4, I was surprised at how smooth the transition was from what I was expecting (or dreading). It's Fireworks 3 combined with the versatility of Photoshop, with its layer and color and text tools, and vector-based programs like Freehand and Illustrator, and (admittedly I haven't explored this part much yet) increased web design ability of Dreamweaver. I can't get enough of this program and I still haven't found all the goodies to this little beauty yet. For the most part, I tend to look at Fireworks not from a web-design standpoint but from just 2D graphics creation. For my job, the main requirement for any graphics program I use is can be summed up in one 5-letter word: SPEED. My job is to create the visuals for educational programs for the Internet and CD-ROMs, each one having to be ready in a very short amount of time. I need something that can give me a prototype to show the bosses, and then will allow me to dive right back into it to make the finished product. I can't do that as easily with Photoshop, and I don't want to do that with Illustrator or Freehand, they are a little too specialized for my needs. I need something simple and quick. Fireworks provides the tools to do that, and without getting specialized, version 4 has made those tools a whole lot better.
Oh Hallelujah for Layers! These are the features that really caught my eye when I first started using Fireworks 4 at home. Version 4 has added what I consider the single most convenient upgrade: Sub-layers. How many times have you created dozens and dozens of images or duplicates within a layer and found there's no way to select them out of the work area? And there was no way of telling what layer an object was on - save by hiding that layer and seeing what disappeared, or by selecting the image and looking for that little blue square to appear in the Layers panel. Say good-bye to those frustrations. The new layers palette provides that beautiful thumbnail view from Photoshop so I can see exactly which object is positioned where. Not only that, but you don't have to go into the Objects palette to alter transparency, you can fade out an object directly from Layers.
Textures Palette Version 4 has also increased its palette of textures. There are the usual fills of parchment, onyx, metal, and wood, but now the more unusual patterns of diagonal, horizontal, vertical, and hatch lines are available.
One thing that frustrated me with Fireworks was the lack of arrow and line tools that Freehand had. Web Designers don't use arrow or dashed line tools much but for what I do, I'm forced to either create arrows out of vectors or create them in Freehand or Photoshop and import them later. I don't want to do that. The textures palette, whether it was designed to do this or not, does let me created dotted and dashed lines fairly easily.
Quick Prototyping Fireworks is my link between Photoshop, Flash, and Dreamweaver when I work. I've all but stopped using other vector-based programs and use Photoshop only to work with images. The improved import/export functions are smooth and layer masking is much easier to pull over from Photoshop. The selective JPEG compression is a really neat item too. Suppose you have an image with complex color patterns in one corner but pretty one-tone in the others, you can select the busy segment and increase/decrease the compression in that area only. Sweet! I can throw together a prototype, like the first one below, in about 5 minutes. Give me 15 minutes more and I can have a fully functional site ready to export to Dreamweaver, complete with rollovers, pop-up menus, animated gifs, sounds, you name it.
And I love the launcher bar at the bottom of the work area. This really speeds up my work. The improved docking functions for the menus are a big help too. You can turn snapping on and off and save and share your most useful menu layouts.
I tend to use Fireworks as a substitute to using Photoshop, when it comes to images or optimizing images for our web-based programs. A lot of the familiar tools for Photoshop are included in Version 4 that I loved in Version 3. Blur, Sharpen, Hue, Saturation, Brightness, Contrast, Optimize, and you can add most third party Photoshop filters, including Eye Candy to Fireworks as well. The best part about this is that the effects are "live," you can change them in real-time without having to dip into your history panel all the time. My team recently created a Flash animation by first creating it in Fireworks and then copying and pasting it into Flash. We finished the project in just under a week. Version 4 is still well integrated with Flash, if not more so now. I can export graphic elements directly into Flash and it will keep the text and objects exactly as I first created them. I was able to throw together a prototype presentation window in a couple of minutes, tweak the buttons, export it as SWF, and then finish the animations and website in Flash. It was awesome!
Gripes? Not Many In their endeavor to standardize with other Macromedia products, namely Dreamweaver and Flash, Fireworks has changed their keyboard shortcuts around. This has been dubbed, appropriately, Macromedia User Interface. You can still group with Command-G to combine objects, but you can't ungroup them hitting the same shortcut like before. You have to hit Command-Shift-G now. And to send an object back, it's Command-Shift-Down Arrow now. Being a bit lazy, I'm suddenly motivated to use the tool bar icons. Thankfully, you can customize your own shortcuts and set them up so you won't go into seizures (for those of you who prefer the Shift-Option-Command-P-R-I-N-T shortcut to printing). Besides, the current interface really does make sense, and the transition to the new shortcut system isn't bumpy, especially if you're more familiar with the Dreamweaver and Flash hot keys -- Version 4 and 5, respectively. There is one thing that irritates me, not too much, but it's on my Christmas wish list. You still can't alter text without using the text editor window. I still have to double-click or activate the editor, and then change the text. And some of the normal text shortcuts from PhotoShop and Word Processors aren't carried through. With the text selected I can italicize it directly on the screen by hitting Command-I. I can bold it with Command-B. OK, so far so good. Now I hit Command-U to underline and… I get a preference menu? After a brief pause of confusion I open up my Dreamweaver and Flash. Yup, just as I thought, Command-U opens the preference menu on those too. Now I have to go up into the menu bar to find out what to push or -- gasp! -- look it up in the manual. On second thought, it's better to just go customize a new shortcut for it. These minor transition difficulties are definitely where the toolbar icons come in handy (although I still find it quicker to use the shortcuts). Thankfully the icons haven't changed much and I can still flip, scale, and move things around without getting too frustrated at my pathetic learning curve. It's really similar enough to the previous version that you can jump right into Version 4 with little problems.
Of course, one of the major strengths of Fireworks 4 is that it was designed to work seamlessly with other Macromedia products like Dreamweaver and the Internet in general. While always known as a great tool for interface design and rapid graphics development, it now is even easier to go straight from web site concept to web site creation with Fireworks built in HTML tools. This is great news for both graphic artist and web designers, as the process of site development can now be a single fluid task instead of two distinct parts.
Web Options Technically, you could create an entire website from within Fireworks, but the real strength is in exporting your design into HTML so that another application, like Dreamweaver can manipulate it from there. Some of the features for making your design experience easier are: Swap Image: also referred to as Rollovers or Mouseovers, Rollovers change the graphic displayed when your cursor rolls over a point on the screen. Mac OS Journal uses rollovers for the site menu and table of contents bars just above this review's title graphic. With Fireworks, you can create the "on" and "off" state graphics, identify a link, specify whether the "on" graphic should be preloaded with the page or not until rolled on, whether to restore the "off" graphic once the cursor has rolled off the point. When you export this graphic, Fireworks creates the HTML page with the graphic placement, a JavaScript document with the necessary code to perform the action, and the images. Dreamweaver has a "Fireworks Media" option in the Insert -> Interactive Media menu that will take all of these pieces and make them work in your existing web document.
Status Bar: a rather "simple" feature in HTML, this allows you to change the text that will appear in the status bar of the web browser when the image is rolled over. Designers use this option to suppress link information, give description, or just to make things more interesting. This feature also exports an HTML file that can be or viewed standalone imported into Dreamweaver. Note: I personally have seen this done with much less code. Web designers may prefer to do this one by hand outside of Fireworks.
Pop-ups: very complex JavaScript code makes this feature possible. It allows you to create a menu which will popup when you hover over the main graphic, similar to the way the File menu works when you click on it on your Mac. Click here to see a quick example of a Pop-up menu. Once you select a hotspot on your graphic and choose insert popup menu, you are taken trough a series of windows: first to identify the menu options and where they link to and then to the design window which allows you to set font and size, pattern and color for the menu. Also, the location of the menu is customizable and can be changed within the main window after the menu is created. The only true downside to this feature is that it's much more difficult to actually use than it first appears. While creating the menu is simple, actually integrating it into an existing page is not. However, the counter to that is that a web interface initially designed entirely in Fireworks and then exported can be customized before it becomes HTML code -- allowing the "graphics people" to not have to become "web people" any more than they already have to. Slicing: Slicing is a common technique of cutting up a large image into smaller pieces. This has many uses, from allowing for other effects to be added to one part of an image, so that other elements (text, video, animation) can be integrated into an image to make it look as one, and even to increase download performance (there are many arguments regarding the theory that many small files will download faster than a single large one). Within Fireworks, there is a slicing tool and it works much like the cropping tool. You select a rectangular part of your image and that becomes a slice. You can slice up your entire image and export the entire thing to separate images and an HTML page holding them in place, or you can export a single slice (great if you are making changes to an existing sliced image and have no need for the entire page to be created). Mac OS Journal uses such a technique with many images placed together (using a table to preserve positioning) to give a unified look. Animation: If you are used to the traditional way to create animation (what you would find in Photoshop w/ImageReady), then you may be a bit surprised with how Fireworks handles it. Unlike Photoshop, that utilizes selecting and deselecting layers to move from frame to frame, Fireworks uses an object metaphor which has the advantage of allowing you to identify actions to an object rather than creating each frame yourself. You can control the number of frames, movement (how many pixels the object moves each frame), direction, scaling (from 0 to 250%) from start to finish, opacity from start to finish, rotation and direction of rotation.
Of course, you can still create traditional animated gifs by adding or removing layers to each frame. And once your animation is complete, you also have the option to export your image as a Flash .swf file if that format is better for your project or if you need to work with the file further in Flash. Buttons: With an "insert button" menu option, Fireworks has integrated several different web features into a single process. When selected, you are able to design the look of a button in several event stages: normal state, when the cursor rolls over, depressed state, and when the cursor rolls over the depressed button. It then works like the rollover feature above, but with the added "click" events added in. It also allows you to assign a link to the button for when it is pressed.
Conclusion Version 4 is a great upgrade, and if you don't have Fireworks, get it. Aside from the swapped hot keys, there is no reason not to fall in love with this program. And that's just from a regular graphics perspective. When you look at its web-design abilities, Fireworks beats out ImageReady any day with its simplified rollover, swap, and behavior functions. Designers, or anyone who can get their hands on Fireworks for that matter, can create a functional web design in minutes. When teamed with Dreamweaver (see details on the Fireworks/Dreamweaver packages in the Dreamweaver 4 review), you can't go wrong. Combining speed, simplicity, and standard functions across all Macromedia products, ensures that these programs will stay at the head of the pack. Now, if only they'd beef up Fireworks with the powerful drawing and painting tools from Photoshop 6, I won't have to switch between programs all the time. Macrodobe FireShop anyone?
|
|||||||||||||||||||||||||||||||
|
 |
||||||||||||||||||||||||||||||
Title
Austin McDowall - 
