Viewers: in countries Watching now:
In Fireworks CS5 Essential Training, author Jim Babbage gives a detailed overview of Fireworks CS5, Adobe's software for creating and optimizing web graphics and interactive prototypes. This course includes a detailed tour of the interface, the enhanced PNG format, and the image editing toolset in Fireworks. Critical concepts, such as prototyping for HTML applications and working with symbols, the heart of an efficient workflow in Fireworks, are covered in detail. Exercise files are included with this course.
Sometimes when you scale a Vector object, your original nicely-defined hard- edged vector shape ends up getting a little bit blurry. Now fortunately, Fireworks can help out with this. We've got an example right here, this little divider graphic that would have been used, for example, on a Web page. It's been stretched a little bit, and you'll notice that we have all these anti-aliased pixel edges. It's not very attractive. It looks kind of blurry. So what we're going to do is we're going to use a really cool command to fix this problem. I'm going to go up to Modify > Snap To Pixel.
As soon as I do that, you see that the edges of the shape, along the outer edges, and also on the inside, snap to the nearest pixel, and we get nice crisp lines again. Now just to give you an example of this happening in action, I'm going to go ahead and Scale this object. I'm going to drag it up a little higher. As soon as I do that again, notice that Fireworks has tried to blend the edges, and it doesn't really look the way I like it to look. So once again, I can go into Modify > Snap To Pixel, and get a much crisper result.
We'll take a look at one more example here using the same object. I'm going to apply a Stroke. I'm going to apply - oh let's go with a nice bright green stroke, something that's easy to see. As soon as I applied that, you'll notice that we got this, again this Anti-aliased Edge here. So Modify > Snap to Pixel cleans up the Stroke, very, very defined now. If I go ahead and alter the Size of the Stroke, let's go from 1 to - Oh, let's say 2 pixels. Notice, again, what happens to the edges of the Stroke. We're getting that anti-aliasing. So once again, Modify > Snap To Pixel.
Now, granted, I am fairly zoomed in on this at about 400%, but let's take a look at this. I'll Undo that last change. Press Ctrl+Z or Command+Z. Let's go out to 100% and see what this looks like at 100%. We're getting a bit of edge softness. We don't see the same kind of banding that we saw earlier, but it's definitely not a crisp vector graphic. So even at 100%, the problem is noticeable. If I go up to my Modify > Snap To Pixel, you can see that the edges of the image become noticeably sharper, even when they're seen at regular magnification.
So Snap To Pixel is a really nice feature inside of Fireworks. If you're working with Vector graphics, especially rectangles with strokes, I think you'll find this tool coming in very handy.
There are currently no FAQs about Fireworks CS5 Essential Training.
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.