Flash Catalyst CS5 is a new program from Adobe. It is a part of most CS5 suites. It was created specially for designers who do not know or want to spend the time learning code to create interactive components or websites. You can create interactive websites, widgets, components, etc. directly from an Illustrator, Photoshop or Fireworks file. When you bring one of these into Flash Catalyst CS5, it will have all the attributes it did in the native program. Flash Catalyst CS5 is a a "feature-rich interaction design tool you can successfully use to publish SWF files without writing code." The fact that you can design in Photoshop or Illustrator and bring these designs or photos into Flash Catalyst and turn them into interactive components is the focus of Flash Catalyst CS5. You can, also, create simple designs in Flash Catalyst with the shape tools that are available, but you can easily work with more design rich images since they can be so easily used as part of your interactive project.

It's top features are:

Let's take a look at Flash Catalyst CS5 and see how it works. The artboard is at the center of the screen. This is the design workspace. You can always switch to the Code workspace, should you desire to look at the code generated.

The Wireframe Component's panel is the place to go when creating components directly in Flash Catalyst. The tools in the toolbar allow for basic creation and manipulation.

It is incredibly easy to create such items as horizontal sliders. One could almost say that it can be done with a click of a button. You use the Heads Up Display (HUD) to setup your component.

What you see above are the basic steps to create this component. The easiest way to do that is to create the design in either Illustrator or Photoshop.

Roundtrip editing is another great plus for this program. If you are editing using Illustrator, all you do is right click and choose "Edit in Illustrator." If you are using Photoshop, you need to download the extension for Photoshop from Adobe Labs. If you have both version of Photoshop, 32-bit and 64-bit, you need to download the correct extension. However, when editing using Photoshop, Flash Catalyst CS5 defers to the 64-bit version of Photoshop.

To build an interactive user experience in Flash Catalyst CS5, you use the concept of pages and states. Here is how this works. It is so easy to create and edit buttons, for example,

and add interactivity. The drop down menus are easily displayed and the steps are intuitively clear. On the left image, I already had selected a command for Mouse Down. On the right image, are a list of different commands possible for Mouse Up.

You can add pages to your project and label them by clicking Duplicate State. These will be reflected in the Timeline.

Below is an example of the project I did to create a gallery of some fog images created in Vue 8 Infinite. There is one page for each action. When I hover over a thumbnail, a larger image will appear.

Below is a screenshot of part of the timeline that was generated automatically. I could have changed or modified the transitions.

Once you have finished your project, you can publish it for multiple uses. Notice the number of choices including building an AIR application.

Flash Builder 4 and Flash Catalyst CS5 work hand-in-hand. Flash Catalyst files can be handed over to a developer who can further build on them in Flash Builder since Flash Catalyst files are expressed in MXML, the language of the Flex framework. Once you bring into Flash Builder 4 a file created in Flash Catalyst CS5, you will see that you can run it and it will appear exactly the same as it did in Flash Catalyst.

Flash Catalyst comes automatically in all the CS5 suites other than Standard. Flash Builder 4 is a part of the Web Premium and Master Collection.

The system requirements are:

Windows

  • Intel® Pentium® 4 or AMD Athlon® 64 processor
  • Microsoft® Windows® XP with Service Pack 2; Windows Vista® Home Premium, Business, Ultimate, or Enterprise with Service Pack 1; or Windows 7
  • 1GB of RAM (2GB recommended)
  • 1GB of available hard-disk space for installation; additional free space required during installation (cannot install on removable flash-based storage devices)
  • 1024x768 display (1280x800 recommended) with 16-bit video card
  • DVD-ROM drive
  • Java™ Runtime Environment 1.5 (32 bit) or 1.6
  • Broadband Internet connection required for online services

Mac OS

  • Intel processor
  • Mac OS X v10.5.7 or v10.6
  • 1GB of RAM (2GB recommended)
  • 1GB of available hard-disk space for installation; additional free space required during installation (cannot install on a volume that uses a case-sensitive file system or on removable flash-based storage devices)
  • 1024x768 display (1280x800 recommended) with 16-bit video card
  • DVD-ROM drive
  • Java Runtime Environment 1.5 or 1.6
  • Broadband Internet connection required for online services

The cost of Flash Catalyst CS5 is US $399.00. If you plan to use Flash Builder 4, the cost for it is $699.00 with an upgrade price of $299. However, I am not discussing it in this review other than to mention it in terms of integration with Flash Catalyst CS5. As a further note, there are a lot of books available from Amazon.com as well as other sites on Flash Catalyst CS5 as well as a number to be published in the near future.

What I have explored for this review are some of the basic uses for Flash Catalyst - creating components and web pages with simple interactivity. I have tried to highlight some of the top new features. Adobe TV presents many programs on Flash Catalyst. To see the list of different programs, click on more episodes for this show. There are a number of different places on the Adobe website for learning Flash Catalyst CS5: http://www.adobe.com/support/flashcatalyst/gettingstarted/index.html is one and http://www.adobe.com/products/flashcatalyst/ is another. And the Adobe Developer Center has even more. Download the demo and look at some of the tutorials. You should be up and running very soon.

I have always wanted to easily create an art gallery where I could hover over an image and that image would appear larger. I took some images I already had and in less than 1 hour created this gallery. Even though I had never used the program until recently, this was a snap. It showed me how Flash Catalyst CS5 was capable of simplifying and creating a dynamic page. I am now very excited to experiment further and create other projects. While I have used Flash Professional and over the years Director, I do not create animations nor dynamic media very much. I found Flash Catalyst CS5 easy to learn and I was able to get results very quickly for creating components and simple dynamic projects such as the Fog Gallery. The concepts are straight forward. If you are a designer and want to enliven presentations, put forth easy to look at and interesting portfolios, as well as create microsites and components for web sites, you will find that Flash Catalyst CS5 has the tools to accomplish this without having to write code. One of the big pluses for me was having the ability to create these components from my own artwork. This makes it easier to meld together both artwork, text, and components.