How We Created Milton Glaser's Slideshow in Flash Catalyst

This isn’t Where the Wild Things Are. And I’m not Spike Jonze. When I first got word that I would have the opportunity to convert the brochure from Milton Glaser’s new exhibit at the AIGA into an interactive project using Adobe’s Flash Catalyst, I was excited … and a bit daunted. Aside from the challenge of learning a brand new program, I had the task of considering the possibilities of interactivity while staying true to a piece of design I didn’t author. Unlike Jonze, I didn’t want to take many liberties in the translation. It had to be new, but also as faithful to the original as possible. The fact that I was working with material created by Milton Glaser surely affected this decision.

Flash Catalyst, Adobe’s newest piece of software aimed at easing this transition from print to digital, helped immensely. Within minutes of opening the program I had acquainted myself with the general contours of the interface and was converting vectors into interactive buttons with a single click. I had originally planned to import the InDesign file into Flash Catalyst, but due to size constraints, I broke it down into sections: The first section, “In Search of the Miraculous,” now contains four parts, and I put the other two sections on one slide each, for a total of six interactive slides.

THE PRINTED BROCHURE


THE FIRST SLIDE, TRANSLATED FROM LAYOUT ABOVE


USING CUSTOM COMPONENTS TO INCREASE IMAGE SIZE

The software can handle complex projects — you can build an entire website, including buttons, toggles, and scroll bars using Flash Catalyst — and in addition to images, it can handle video and audio just as easily. (One version of the slideshow contained a recording of Glaser walking the viewer through the slides, but the file ended up being too large to be usable.)

As with any 1.0 version of a program, there were a few bugs. When you import images from Illustrator, items only copy from within the artboard — an oversight that means you have to move anything you’re working on into the artboard before you can copy into Flash Catalyst. Additionally, the program doesn’t offer extensive z-axis control — meaning that buttons in their enlarged state would not display in front of the surrounding buttons. So if you have 60 layers in the program, your 30th layer will display ahead of the 30 below it but not in front of the 29 above. (We eventually created a workaround using Custom Components.)

These, however, are minor and few. Flash Catalyst is a very impressive new addition to the Creative Suite and one that a print designer like myself will be returning to soon. Big thanks to Ian Giblin, senior quality engineer at Adobe, who provided technical (and spiritual) support throughout the process.

View the slideshow
Once it’s loaded, click the button on right side of the presentation to go forward; the button on the left will take you back. Click the thumbnails to expand the images and click the image again to return the image to its original size. The scroll bar below takes you through Milton Glaser’s narrative and descriptions of each project.

Related Articles:

ADD A COMMENT

8 COMMENTS

  1. No problems here, Lazlo. Navigation is perfectly intuitive, no instructions needed. At least for some of us.
    And, wow. Who would have a limited budget or limited time. Not I.

  2. Conceptual, sound idea. But terrible execution & navigation. The fact that you needed to give me “directions” before I even clicked on the link & loaded the page should have told you how poor the information architecture was. Flash Catalyst is a joke of a piece of software that, nothing more, enables designers to quickly create “bad” interfaces with limited resources & budget. Give me one example of a well-designed interface with this software. Just one. Even the Markotos piece is terrible. Sorry David, it’s not your fault either. I can see through this superfical article as nothing more that some free advertising for Adobe. No doubt your project was created on a limited budget, and with limited time.

  3. On the first page of the slideshow, 2nd paragraph, 2nd line, “…a new tool for transforming artwork created in created in Adobe Photoshop or…”
     
    FYI

  4. Pingback: Flex learner | Blog | Imprint-The Online Community for Graphic Designers | How We ...