By David Karlins Macworld.com | on May 04, 2010
Price: £357 plus VAT
Pros: Prototypes mesh smoothly with Flash Builder. Portability from Photoshop and Illustrator. Designers can create Flash interfaces. Programmers can add coding via Flash Builder.
Cons: Built-in actions are limited. Projects can't be moved to Flash Professional. No animation or scripting tools. Limited drawing tools.
Bringing graphic elements to life with Actions
When a new project is launched in Flash Catalyst, the opening dialog provides the option of opening a new project from a design file in Illustrator or Photoshop. Oddly, while you can have multiple design artboards open in a single file, you can have only one Catalyst project or file open at a time.
Support for Illustrator effects and Photoshop filters is extensive, limited only by features not supported in Flash Player 10. Flash projects are (mainly) based on scalable vector artwork. Unlike bitmap/raster artwork (best used to digitally represent photos), scalable vectors lose no resolution or quality when a viewer or an application zooms in.
Scalable vectors do not increase in file size as they change size on the screen. Both Illustrator and Flash (including Catalyst) are vector-based, and Catalyst’s ability to animate and activate Illustrator objects is a significant change in Illustrator CS5 as well.
Combined with finely synchronized support for Illustrator and Photoshop artwork, the essential magic of Catalyst is that it can convert that artwork to interactive components. For example, you can draw a form input field in Illustrator or Photoshop, but you can make that form field accept data in Catalyst (processing actual data requires handing the project off to a Flash Builder coder).
You can do the same with other form input fields: radio buttons, text input, or check boxes. And you can use Catalyst to convert other Illustrator or Photoshop artwork to sliders or scrollbars. You can also add immersive content or interactive video created with Flash Professional to your Flash Catalyst projects in order to provide a more compelling user experience.
Designing a customized scrollbar for a Flash application is as easy as copying and pasting a horizontal or vertical bar from Illustrator or Photoshop, along with artwork to use as a thumb, an up arrow, and a down arrow. A simple popup menu assigns a scrollbar part to any selected graphical element. The concept is exciting. The biggest shortcoming is that the set of available actions is quite limited. They are:
- Play, pause, or stop video
- Go to a URL
- Play, pause, and stop SWF files or go to a specific frame
- Change a component's state
- Change or fade opacity
- Add a sound effect
- Move, resize, and rotate objects
- Rotate an object in 3D space
Catalyst also generates a number of form elements, but I found gaps when I tried to design accessible forms. The set of form fields also does not include popup boxes.
Similarly, the video player controls were truncated in their ability to convert a graphic element to a Start, Stop, or Pause button. There’s no option to assign a mute button or volume control.
Wireframing and prototyping
Catalyst includes a set of symbols for wireframing (creating a sketch of what an interactive page should look like). Here too, I found the tool set limited to the basics. You can insert form fields and scrollbars, add formatted text, and draw shapes. On the other hand, this set of wireframe symbols and actions matches Catalyst’s set of actions (the list above)—thus allowing a designer to prototype an interactive page that is all set for the coder's handiwork.
If a wireframe layout for a Flash project is copied into Catalyst from Illustrator, some elements of that layout can be activated, meaning they can have actions applied to them.