310.684.3047

The State of Flash Platform Design Workflows

In the prior post, I wrote about Adobe’s effort to clarify the role of the individual tools that comprise much of the Flash Platform. And, as I argued, Adobe has made significant progress on that front, making it easier for new users of the Flash technology to understand which tool to use, when, for what purpose.

But working within the Flash Platform is only one aspect of how Adobe has improved the production workflow of the Flash Platform. Working between Flash and other content creation tools (like Photoshop, Illustrator and After Effects) is a core component of any contemporary professional production workflow.

Back in the days of Macromedia, it was challenging to get content between Adobe’s Photoshop and Illustrator tools, and Macromedia’s Flash Professional. There were three basic methods to get content from your design tool into Flash:

1) You could try to export a SWF from Photoshop/Illustrator;

2) You could try to import a PSD or AI file into Flash; or

3) You could try to copy from Photoshop/Illustrator and paste into Flash.

No method worked well — for example, sometimes your gradients would be lost when copying, and sometimes your fonts would be lost when importing. And you could never get some objects (like your gorgeous gradient mesh in Illustrator) into Flash, meaning that you would have to recreate them by hand in Flash.

As a result, it was quite painful and time-consuming to execute designs in Flash — and it was very, very easy to implement designs imperfectly (with certain content off by a few pixels, or colors not matching designs, or fonts not quite the right size). This both increased the cost, and decreased the quality of working in Flash, which I think contributed to the market perception of Flash as ‘sloppy’ and ‘weak’. It was almost impossible to ‘implement’ a design in Flash; instead, you had to rebuild it from scratch in Flash, and hope to match the source.

With the release of Adobe CS3, we had the first version of Adobe’s famed Creative Suite that included Flash out-of-the-box. But, because of how little time had transpired between Adobe’s acquisition of Macromedia, and the release of CS3, there wasn’t much Adobe could add in that release, in terms of improving the workflow from the design tools into Flash.

With CS4, we saw the introduction of the Photoshop and Illustrator importers into Flash. This, for the first time, gave users of Flash Professional the ability to import designs and content from Photoshop and Illustrator, with precision and intent, rapidly and conveniently. No longer was implementing a design a haphazard and draining experience — instead it became rapid and seamless.

I think it is easy to understate the importance of this improved workflow. As Flash, over the past several years, has endured “attacks” (for lack of a better word) from contenders like Microsoft Silverlight and Apple XCode, it is often quite easy for industry observers to overlook the production workflow required to translate a design into a functioning, interactive application or experience. There are no “Microsoft” or “Apple” design tools. Almost all digital designers in the world (outside of 3D) utilize Adobe products. Period. Creating easy and powerful production channels from those Adobe design tools, into Adobe’s Flash Platform production tools, gives Adobe a massive advantage, before you even get into questions like platform capabilities and player install-base. In short, how are you going to translate that beautiful Adobe Photoshop PSD into a Silverlight experience or an iPhone app? It’s damn annoying! But to turn your PSD into a Flash app? It’s virtually one-click.

So, with CS4, we had the first real improvements on the design workflow from Adobe’s CS tools into Flash — a process that was greatly enhanced with the release of CS5, and the introduction of Adobe Flash Catalyst CS5. As I described in my previous post on the Flash Platform tools, Flash Catalyst is a new tool, introduced with the release of CS5. While Adobe has marketed Catalyst primarily as a rapid-prototyping tool (enabling you to convert your static designs into prototype interfaces, with data and interactivity), at Almer/Blank we have deeply integrated Flash Catalyst into our production workflow. By ensuring that certain design standards (for example, layer naming, and asset groupings) are adhered to, we can now rapidly convert a Photoshop or Illustrator design, into a componentized Flash interface ready for our engineering team to integrate into the application. For those looking to improve their Flash production workflows for design assets, look into Flash Catalyst! It has enabled us to complete rewrite the process of turning designs into applications, reducing the amount of time, and the number of resulting errors in the interfaces.

The next major production workflow hurdle for Adobe to confront is round-tripping between the tools that comprise the Flash Platform (Builder, Professional and Catalyst). One major workflow benefit that Microsoft Silverlight has is that there is powerful, live round-tripping between their ‘design-ish’ tool (Expression Blend, akin to Flash Professional) and their coding tool (Visual Studio, akin to Flash Builder). Microsoft’s tools allow you to work on the same project, at the same time. That would be like having the same Flash project open in Flash Builder and Flash Professional at the same time, to accelerate the process of working with the logic and the assets simultaneously. Right now, you can’t even open a Builder project in Professional and vice-versa — they just don’t understand each other enough. Adding round-tripping ability between Builder and Professional would be an amazing addition to the Flash Platform workflows. But this is more of a limitation of code and production workflow, rather than anything concerning design.

When it comes to getting designs and content into the Platform tools, nothing beats the options that the Flash Platform provides.

So, as we stand here in 2011, I can say with great confidence that it has never been easier or faster to implement designs in Flash, nor has it been possible to do so with higher accuracy, than it is today; similarly, there is no other programming environment (with which you can make applications for desktop, web or mobile devices) that has a better workflow for integrating designs and content. In short, the Flash design workflow has never been stronger, and far exceeds that available with any other alternative technologies.

Next up… Flash and Devices (yum).

Until then, share and enjoy!

-r

Category: General Posts

Tagged:

5 Responses

  1. [...] And, along those lines, the next article in this series will be about Flash Platform Design Workflows. [...]

  2. [...] My third installment in my series on the "State of the Flash" is posted on A/B Labs. Entitled "Flash Platform Design Workflows", my conclusion is: So, as we stand here in 2011, I can say with great confidence that it has never been easier or faster to implement designs in Flash, nor has it been possible to do so with higher accuracy, than it is today; similarly, there is no other programming environment (with which you can make applications for desktop, web or mobile devices) that has a better workflow for integrating designs and content. In short, the Flash design workflow has never been stronger, and far exceeds that available with any other alternative technologies. [...]

  3. [...] This post was mentioned on Twitter by Almer/Blank, leslie wintner and RichMediaInstitute, R Blank. R Blank said: What's the state of Flash Platform design workflows? http://is.gd/BTTgon 3rd article in the series on the state of the flash [...]

  4. DaveW says:

    I'm enjoying this series, but two things in this post I must address:

    1. Flash CS3 introduced the Photoshop and Illustrator importers.

    2. Expression Blend also has Photoshop and Illustrator importers. I haven't tried the Illustrator importer, but the Photoshop importer works well and it's easier to update your changes. As long as the layer name stays the same, you can re-import the psd and the old layers are overwritten with the new layers. I wish Flash could do that! There isn't an option to make grouped layers into user controls though (the wpf/silverlight equivalent of movie clip), which really sucks.

Leave a Reply