Home
Subscribe
KSDD.com
13 Favorites in Adobe’s Creative Suite 3 Web Premium
Spanning the suite to find a baker's dozen of cool things for Web and multimedia pros
Unless you've been living under a rock (or perhaps in a spacious yet private cave), you very likely have heard the news by now that Adobe has announced approximately 4,927 new versions of the Creative Suite 3 line of products. For our purposes here today, however, I want to focus on two things: the word "Web" and the number 13. That is, we're gunning for the CS3 Web Premium bundle and 13 of the things I keep coming back to as neat-o new features.
Now, some of these features are the "big ones" (e.g., the ones you'll read about in the Adobe-provided sales pitches and countless other write-ups), and some are smaller ones, but there's one thing they all have in common for me: I have little doubt at this point that I'm going to use them, and use them often. So, with all that properly prefaced, and in no particular order, here are my favorite things (so far, anyway) present in Adobe's Creative Suite 3 Web Premium.
1) The CS3 interface.
Many of you have had the opportunity to see the CS3 interface in action, as Adobe has had it "in the wild" since last December in the form of the Photoshop CS3 Public Beta. But now Illustrator and Flash also have it, and if you haven't used it yet, it's a thing to behold. The tear-off tabbed palette paradigm is still going strong, only now it's joined by a docking metaphor that simply has to be used to be appreciated (fig. 1). For someone like myself who is constantly bouncing between a smallish laptop screen to a dual monitor setup, the way the docks allow me to efficiently use available screen real estate is nothing short of a revelation. I only wish Dreamweaver and Fireworks were in on the fun, but that's a discussion for another time.
Figure 1
2) Flash's Photoshop/Illustrator import improvements.
The former Macromedia Flash never worked as well as it could have with Adobe's PS/AI tag team, yet that didn't stop legions of us from using the latter to prepare elements for the former. Now that all three are part of one big, happy family, Flash slickly imports such content with complete facility (fig. 2). Text in either program can be imported as editable Flash text, colors from Illustrator documents no longer shift, blend modes and filters are converted to their Flash equivalents (where possible, of course), and individual layers can be combined into named Movie Clips during the import process.
Figure 2
3) FLV Previews in Bridge.
I'll readily cop to the fact that I'm not a fan of Bridge, but I'll also readily concede that whether or not you use/like Bridge is largely a product of personal workflow habits. However, this one feature may be the Trojan Horse, as it were, that gets me to ultimately use Bridge more than I do now. As Adobe still didn't see fit to provide a convenient way to play back Flash Video (FLV) clips, either in a dedicated player or through something like an official QuickTime codec, know that Bridge can fill the bill immediately (fig. 3). Incidentally, Perian (Mac) and VLC (Mac/Win/etc.) will play back FLV files, but if you already use Bridge, it's a hassle-free way to preview FLV-based clips.
Figure 3
4) Video support in Photoshop CS3 Extended.
Finally, finally, finally, Photoshop allows you to open and manipulate actual, honest-to-goodness, video clips. Of course, you'll need the new Extended version, but we won't let silly things like additional cost ruin the good mood. You can open, say, a QuickTime movie directly in Photoshop (fig. 4) and have access to the full range of Photoshop's tools to manipulate the clip—brushes, blend modes, healing tools, you name it. This enables all kinds of possibilities, from simple watermarking to heavy-duty rotoscoping. You can even add additional layers, animate layers (albeit crudely), and save out your source as either a native Photoshop document or export it to a video format. Say sayonara to filmstrips forever!
Figure 4
5) Flash's new component architecture.
For those of use who actually found it easier to build things like scrollbars from scratch rather than attempt to skin Flash's tired old Halo-themed widgets, the new video and interface Components are a breath of fresh air. Adobe has made skinning said elements dead simple (fig. 5) by providing nested, fully editable, and clearly labeled Movie Clips that are simple to tear into and tweak. Finally, the best of both worlds—ready-made, functional widgets that are easy to theme.
Figure 5
6) Flash-style Symbols in Illustrator.
Since I've historically used Illustrator to prepare vector drawings for use in Flash, it's fantastic to see that I can now make objects into Symbols right in Illustrator the exact same way I would in Flash. Of course, this opens up excellent organizational possibilities even if I never leave the cozy confines of Illustrator, but the best part is that I can name my Symbol, specify its type and registration point, give it an instance name, and even enable 9-slice scaling right in Illustrator (fig. 6). Then, when I import the artwork into Flash, all of those things will already be done for me—the Symbol will be correctly named in the Library, it will already have an instance name on the Stage, and 9-slice guides will be on and ready to go.
Figure 6
7) Zoomify export in Photoshop.
Zoomify is a neat way to make large format images usable on the Web, and now that Photoshop CS3 has Zoomify export built-in, I find I'm using it a lot (mostly to post full-resolution stills from HD animation sequences). Just open the image in Photoshop CS3, export it for Zoomify, and Photoshop will build an interactive, Flash-based version of your image that's perfect for viewing in a Web browser (fig. 7).
Figure 7
8) Dreamweaver's vast library of CSS templates (with verbose commenting)
If you're new to CSS-based design, or even if you're familiar with it but hate dealing with all the various browser idiosyncracies necessary to make things work everywhere, you'll likely find Dreamweaver's template library to be just what the doctor ordered. Not only is there an incredibly inclusive library of common layouts (each coming in several flavors of fluidity), but each one is meticulously commented to explain precisely what is happening and why (fig. 8). Not only will the templates save you time and some of your sanity, but they're also valuable learning tools for beginners and seasoned pros alike.
Figure 8
9) Live Scale-9 previews in Flash
If you've used 9-slice scaling (AKA Scale-9) in Flash before, you know how cool it is for building scalable interface elements. Problem is, while working in the Flash environment you didn't get a live preview of resized Symbols that had Scale-9 enabled. Until now (fig. 9). There's not much more to say about that, other than my "Test Movie" trigger finger may not get used as often when working on such projects.
Figure 9
10) Illustrator's Color Guide.
We all need a litle inspiration from time to time, especially when it comes to picking just the right combination of colors. Sure, there's no shortage of Web-based resources to do this, including Adobe's own Kuler site, but there's nothing like a quick and easy palette that accomplishes this task in a program you likely already have open all the time. Simply pick a base color, head for the Color Guide, and Illustrator provides myriad options for pleasing color palettes (fig. 10). Of course, you can go on from there and use the shortcut to Illustrator's equally awesome Live Color tool for further tweaking, but for quick and painless inspiration, the Color Guide palette delivers.
Figure 10
11) Spry Framework integration in Dreamweaver.
I know (X)HTML and CSS fairly well by now, and I know just enough ActionScript and JavaScript to be dangerous, but man, is it hard to wrap your brain around Ajax when you're a "mere" designer by training. Adobe's Spry Framework for Ajax has been in development for a while and aims to change how designers approach Ajax-based development, but it's the integration of the Spry Framework into Dreamweaver CS3 that truly has the potential to deliver on that promise. Dreamweaver makes it fairly easy to add JavaScript-based widgets (fig. 11) and effects to your Web pages, and even provides simple methods for adding, parsing, and displaying XML-based data in interactive fashion. This is definitely one feature to keep an eye on.
Figure 11
12) Illustrator's Document Profiles.
I've actually rarely used Illustrator for print work, mostly because I know next to nothing about print. I have, however, used Illustrator a lot to do things like lay out titles for video or prepare logos for 3D or After Effects use or create artwork for Flash, and Adobe has apparently realized that there are at least a few other people doing that sort of thing in Illustrator as well. So, we now have a pretty good set of default templates to choose from, all neatly organized in various profile categories (fig. 12). From video to Web to mobile devices to (of course) print, you'll find custom templates (complete with guides for safe areas, in the case of video) for just about every need.
Figure 12
13) Rich symbols in Fireworks.
Fireworks has been reborn as a prototyping tool, and with the new focus comes new features to support it. To be perfectly honest, I'm a little down on Fireworks, but one area of real promise is the inclusion of rich symbols. The most visible example of these come in the form of the included interface widget library, which covers items like scrollbars, buttons, and text areas and which make use of JavaScript to allow you to quickly and easily change the appearance of said widgets to reflect things like custom labels and activity states and other things you need widgets to do (fig. 13). For Web designers and interface developers, this library alone is a huge timesaver. Of course, the framework allows you to roll your own rich symbols, so hopefully the community will eventually deliver additional libraries over time.
Figure 13
So there you go. One man's hugely unimportant yet quite self-indulgent take on what's good about the Adobe CS3 Web Premium bundle. There's cool stuff to be had across the suite, and hopefully this will whet your appetite until the actual product starts hitting the street. Adobe CS3 Web Premium is slated to ship in April, and will set you back $1599 for a new copy, with upgrades running either $499 or $1399 depending on ownership of previous Adobe/Macromedia products. Anyway, be sure to visit Adobe's Creative Suite page for full pricing and upgrade information.
Got Feedback? to send an email. I'll do my best to answer. Really.