Overview of Adobe Creative Suite® 3 Web Premium and Design Premium

I always like to give a perspective to my reviews. I have reviewed Adobe CS and CS2 as well as various Macromedia suites, the latest being MX2004. I am a graphic artist, writer and photographer as well as I design web sites on a casual basis. I work alone and print my work on an Epson R2400.

This article will be both an overview and a basic analysis of Adobe's CS3 Web Premium and Design Premium packages. This will be followed by individual reviews of the products. Here I will discuss the products that comprise Design Premium and Web Premium and how they interact with each other. For this review, I will be using the products contained in the suites.

The products contained in CS3 Design Premium are:

The products contained in CS3 Web Premium are:

You will notice that the difference between the two suites is that the Web Premium contains Fireworks CS3 and Adobe Contribute CS3, and the Design Premium contains InDesign CS3. Otherwise the suites are the same.

The price of CS3 Web Premium US full is from $1,599.00, and upgrades are from US $499.00; the price for the CS3 Design Premium US is from $1,799.00, and upgrades are from US $599.00

The Design Premium Suite which is more expensive will offer the user the ability to produce both hard copy layout through InDesign CS3 to Web work through Dreamweaver CS3. The Web Premium Suite offers more advanced web options through Fireworks CS3 without the ability to produce layout design specific for hard copy. Of course, Adobe Acrobat 8 for producing PDFs is included in both suites. Both suites deal with mobile devices through Device Central CS3.

When any of the programs are introduced, the first item to be noticed is the interface or UI. The programs comprising both suites do not have the same UIs. The original Adobe products -Photoshop, Illustrator, and InDesign as well as Flash have new UIs that are the same. Both Fireworks and Dreamweaver have similar UI to the MX2004 version which is the latest that I know.

I use two monitors, and I was able to bring any panel or palette I wanted onto the second monitor to clear space on the first or to more easily access the panels so that they would not have to stack. As can be seen from the image below, palettes or panels can now be docked for easy accessibility. They can be expanded or contracted to show just the icon of the palette or panel or the name as well. The panels can be grouped together or docked singly. Below there are three groups of three panels. However, I could have had those panels arranged in any grouping.

CS3, as did CS2, allows all the programs to have the same color settings. In CS2, one could do it through the initial screen on the Bridge program. In CS3, one can do it through the Bridge, as well, but through Edit>Creative Suite Color Settings. I took a PSD file and opened it first in Photoshop CS3 in both Windows Vista Ultimate 32-bit and in XP Pro. It looked the same on both main monitors of both machines. Then I brought it into both Illustrator CS3 and InDesign CS3 to see if the colors as well as the black and white levels looked the same and the grays stayed gray and did not have color hue. The image looked the same in all programs. I, then, printed each file and they stayed true to their monitor image.

As I tested these programs for color accuracy, I used different methods to bring the images into the different programs. In InDesign CS3, I placed the image. And, then, I also, cut and pasted keeping both programs open. With Illustrator CS3, I just brought in the PSD image since now one can open AI images in Photoshop CS3 and PSD images directly into Illustrator CS3. In a similar fashion, one can take JPG, PNG, PSD. TIFF, etc .images from Photoshop and cut and paste them into Dreamweaver CS3 and optimize them directly in Dreamweaver CS3.

In CS3 Web Premium, the interaction and integration is built around creating web sites. Fireworks CS3 is featured as a prototype web creating tool while Illustrator CS3 and Photoshop CS3 are the tools for graphic creation. Flash CS3 creates interactive content allowing direct importation from Photoshop CS3 while retaining layers and importation from Illustrator CS3 while choosing in what form to import the layers.

Dreamweaver CS3 integrates with all these programs making the creation of multimedia and interactive content smoother than ever. Also, the management of CSS has been upgraded in this version making it easier to use. Adobe Contribute CS3 has been added so that others can easily work nondestructively on web sites and blogs. Also, integrated with Dreamweaver CS3 and the other programs that make up CS3 is Device Central CS3 whose purpose is to create content for mobile devices.

Adobe Acrobat 8 is not completely new in CS3. It is now more powerful than ever. It integrates more closely with Microsoft Word, PowerPoint, and Excel. It has many new features that simplify tasks such as document searching, PDF packaging, preflighting with automatic corrections, etc.

If one looks at CS3 Design Premium, one will see that both Dreamweaver CS3 and InDesign CS3 are part of the suite. InDesign CS3 will export a layout in XHTML format so that it can go right into Dreamweaver CS3. PSD images in InDesign can have effects applied to them in situ.

There are other features that some or all of the programs have in common. One is shared PDF presets. These built in presets are found in Photoshop CS3, Illustrator CS3, and InDesign CS3. Others can be accessed from Adobe Bridge and will be discussed later.

There is another little known feature, I presume, that I have found; it is addressed in the Adobe products list. If one, goes on the adobe web site to: http://www.adobe.com/products/ and clicks on the name of a product, one can immediately find out the Top Support Issues with that product. I did that with CS3 Web Premium. As can be seen, a lot more information can also be ascertained before the product is even purchased. Each product that is a part of Web Premium can be viewed separately.

Let's briefly look at some aspects of the programs. All of these programs will be reviewed in depth in separate articles.

Fireworks CS3 is very useful to create prototypes of web pages to show clients before they become a part of Dreamweaver CS3. It is absolutely intuitive; one just starts off with one page and keeps adding them and, then, saves them as a PNG file. The Common Library stores 3 types of symbols - graphic, animation, and buttons. These can be dropped and dragged to the canvas as instances and, then, modified using the Symbol Properties panel.

To illustrate the simple example above, I chose a label in the Common Library from the many choices available;

then, I brought an instance of it to my canvas. Using the Assets Panel, I could change features of the instance in the panel. For example, I could rename "label" to "check if OK."

Working with symbols and instances makes life very easy.

When a PSD file is brought into Fireworks CS3, it will retain its effects. In Fireworks, one can edit using Photoshop Live Effects. I created "Sunspot" effects from the Styles palette in Photoshop. Notice "Gradient Overlay" and "Satin." (The lettering was originally black until a style effect was used in Photoshop CS3.)

After I brought it into Fireworks CS3, I could edit it in Photoshop Live Effects. Notice how "Gradient Overlay" and "Satin" are checked. They were already checked when I opened the image. I could, then make changes.

Dreamweaver CS3 has made working with CSS even easier. There are many templates available. These templates don't just come in one form, but can be modified. Also, using the Properties Panel, one can change the style sheet on the fly. Below is an example from a book I am creating. The example is not of "how CSS should be" but of how it appears on the different panels. If I clicked on the black color square or #000000, a drop down menu would appear so I could change the color of the text. There are many other features which are useful such as checking a document for Browser Compatibility. Also, there is an external CSS advisory web site that is open to community members. However, the explanations in the "validator" itself were very useful in cleaning up mistakes.

Spry framework for Ajax has also been added to Dreamweaver CS3. To make life simple, one can add Spry Widgets. These let you add XML data into your HTML documents. This simplifies the creation of interactive web sites. One can go to Insert>Spry.

In past versions of Dreamweaver, one could easily edit images with Fireworks. With Dreamweaver CS3 one can copy and paste PSD files and then convert them to web ready files. One no longer has to do the save as web command in Photoshop. This improvement has been an incredible time saver. It has also allowed me to more easily place graphics as I go along rather than after I finish writing.

Now, if I need to edit it, I just click on the image, and then click on the Photoshop CS3 icon under Properties. I can also, sharpen it, change contrast, etc. right in Dreamweaver, which I could do in previous versions. If you want to bring in images from Fireworks CS3, you can edit them in Fireworks CS3 as well.

Contribute CS3 is an application that allow editing and publishing of content of existing web sites and blogs. This allows others to input information into specified areas. This can be done from a single based application, a web browser, or from within Microsoft Office applications. Contribute CS3 uses the same templates and rendering engine as does Dreamweaver CS3, so WYSIWYG. The style and feel of the original web site can never be compromised by using Contribute CS3. When installed, it is automatically placed on the tool bar in the browser window to add content from the web.


I easily connected to my own web site and brought it up to edit.

Flash CS3 is the program to use for building dynamic, interactive content for web pages. One can fully import AI and PSD files into it. Now one can draw with a new pen tool similar to the one in Illustrator CS3, work with ActionScript 3.0, and copy and paste text and symbols from Illustrator. The workflow has become more fluid and efficient than ever before, and one can harness the power of Flash CS3 to prepare content for web sites, applications, and mobile devices. Flash CS3 has been revamped so that imported Illustrator drawings maintain a high level of fidelity.

One can easily create an animation and save it as an ActionScript 3.0. I did one by just taking my web site logo and moving it across the screen. The Photoshop CS3 file consisted of just a layer (the logo) and a background.

Once I created the animation, I saved it as an ActionScript 3.0 and pasted it into the Action panel.

To incorporate video into a Flash project , it must be encoded into the Flash Video format (FLV). For a small amount of video, one can do this on the fly. Flash CS3 presents many choices on how to encode the FLV file.

Photoshop CS3 Extended has new tools, according to Adobe to extend Photoshop's reach into the film, broadcasting, manufacturing, architectural, engineering, healthcare, and science provenances.

One of its exciting new areas is in the inclusion of 3D. Below on the left is a 3D model from greenworks' XfrogPlants in 3ds file format opened directly in Photoshop CS3. In the lower center is that image rotated and on the right are the textures of the image modified.

Below is what the layer looked like. To access the 3D tools, one double-clicks the thumbnail of the 3D model in the layer. After modifying textures, one can apply them to the original 3D object.

Enhanced perspective-correct editing is another new advancement building on the concept of the vanishing point introduced in Photoshop CS2. The concept is to be able to deal with more than one vanishing point and keep the perspective correct.

Non-destructive editing has been expanded to include Smart filters. These Smart filters work on Smart Objects.

A new tool that has been added is the Quick Selection Tool which shares a spot with the Magic Wand. The image was selected rather quickly using a mouse and about a number 5 brush without using the refinement options that are available. Had I magnified the image, I could have also refined my work. But I was able to separate the green background from the green garment. Below are two images.

Other new assets are additional cloning capabilities, black and white conversion, expanded HDR 32-bit functionality and more.

Illustrator CS3 has new and exciting color features. The most publicized feature of this new version is what Adobe calls "Live Color." With Live Color using the Color Guide, Swatches, and the Color panels, you can match anything, change color families, decide on a base color for an image and build other colors around it, change a color image to three colors, for example, etc. Once color groups are created, they can be saved to the Swatches panel.

I created a series of shapes and colored them at random. Then, I selected the orange most shape and made it my base shape and created a series of color tints. Then I took the blue star and did the same with it. The Color Guide allows for an infinite number of combination from one color such as cool colors, warm colors, tints, etc.

Below are pictures of the Color Guide and the Swatches panels. On the later are folder icons on the left. When I clicked on the one, it showed web colors to go with my original group of colors. There is a lot more that can be discussed as it pertains to the new color implementations in Illustrator CS3. They are really exciting.

There are a number of new tools in Illustrator CS3. One of these involves the selection of anchor points. These will enlarge when the direct selection tool is moved near them. Also, under preferences is a "Selection and Anchor Display" category.

Another new tool is the eraser. One just erases the part of the Illustrator (AI) image one wants to remove and a new one is formed.

There are more new additions to Illustrator CS3 such as isolating a group so as to be able to more easily work on it, etc.

InDesign CS3 projects can be started by accessing Adobe Bridge and choosing a template for the project. For this review, I chose to create a short brochure to advertise my book. There are many new features in InDesign CS3 - too numerous for this overview. One of the expanded features is Quick Apply. One chooses text or a frame and accesses the mark on the control panel, (highlighted on the Quick Access panel by the rose colored square) and, then, types in the letter of what they hope to accomplish. I typed in "fitting" because I wanted to see the frame fitting options.

A really large feature new to InDesign CS3 is the ability to add styles to a table and to table cells. One no longer has to manually format tables and cells. One can format a table as one wishes and save that formatting as a style.

It is easier to manipulate elements in InDesign CS3 than ever. The Transform panel is an example.

Adding other pages has also gotten easier. All one has to do, it click on the icon on the bottom of the panel.

One can take a regular InDesign CS3 file and export it to other media such as Dreamweaver, Cross-media Export>XHTML Dreamweaver. To have it appear correctly, it must have proper CSS framework which can be done through creating appropriate style sheets for Dreamweaver. Styles can be mapped to external style sheets.

The creativity enhancements in InDesignCS3 are exciting.

As described earlier, it was easy to place PSD, PNG, AI, GIF, PDF, and JPG files. These are the ones that I tried.

Acrobat 8 was updated prior to CS3. It has a task based interface with the initial screen being "work flow" oriented.

As you click on each box, it gives you options of tasks to perform and instructions on how to accomplish them.

With Acrobat 8, one can perform a Preflight with automatic corrections. One can choose to check the compatibility not only with Acrobat documents but also with many other types of print documents such as magazines.

Of course, there are many other areas such as adding an embedded index to a PDF, creating a PDF package whereby PDF files and non-PDF files are put into a single package, working with Microsoft office products, and more.

Acrobat 8 has the capability to use the JDF-based workflow by integrating with InDesign CS3. Starting with Acrobat 7 and InDesign CS2, Adobe introduced JDF (Job Definition Forms) based workflow. The idea is to create for a service bureau an entire project in one "package." Or one can create a template if one is going to create many different projects all having the same attributes. The interaction between the two programs worked flawlessly.

Bridge CS3 has been revamped since CS2. I left this graphic extra large, so that the individual changes and enhancements can be gleaned from looking at the graphic.

If one clicks on any of the program icons on the top bar of the Bridge, a new Bridge page specific to that program will open giving valuable information. Once again, I have included a large graphic, so that the resources offered are visible. I believe that with CS3, Adobe has offered more resources to the general public than ever before.

Stock Photos, Version Cue CS3, etc. all can be accessed from Bridge. I did not download any pictures.

Version Cue CS3 can also be accessed from Adobe Bridge. Here teams can review projects together. Since I do not work with a team, I did not use this program.

Device Central CS3 lets the user test media content on different mobile devices such as phones. One can see the appearance (is it too light or dark?), how the media behaves, and how it generally looks. Below are some of the phones that are now available. Adobe states that they will keep adding mobile devices. One can sign up with Adobe to be notified when new devices are downloadable.

Once a phone is selected, an image of the phone appears and all sorts of specifications that are pertinent to the phone. In the Available Devices panel, information about each phone is also supplied such as what version of Flash Lite™ it uses, its display size, and its color depth.

If one is uses an image from Photoshop CS3, all one has to do is Save it for Web and Devices and, one can immediately open Device Central by clicking on the Device Central button in Photoshop CS3. The image will appear on the mobile device selected. One can, then, choose other devices to see how it will appear.

The system requirements for CS3 Design Premium and CS3 Web Premium are:



I am really excited about Adobe CS3 Design Premium and Adobe CS3 Web Premium. So many of the new features in the different programs are wonderful and it was hard choosing which to mention. From spending a moderate amount of time with each program, and working with the suites as a whole, I feel the upgrades are worth purchasing.The integration has really improved, and I found it excellent. I have discussed everything in brief. As with the new features, I will be discussing these, integration, and workflow as they relate to the individual programs in upcoming reviews. I worked with each program, unless otherwise specified, and worked with them as as they related to reach other. I am really impressed with these two new Adobe suites.

For information on Adobe go to: http://www.adobe.com

Look for these individual CS3 program reviews: