Flex 3 Designer/Developer workflow

We held an event in London exclusively for digital agencies on Monday 25th February to coincide with the launch of Flex 3 and AIR – one of the sessions that I presented was ‘Flex 3 Designer/Developer workflow’.

The aim of the session was to overcome some of the perceptions that people have around Flex and highlight how designers can contribute to the production of a Flex-based application. I’ve uploaded the slides I presented to Adobe Share.

Some of the common myths that we hear in relation to Flex include:

• Flex is only used for ‘Enterprise’ applications – FALSE! Check out the Flex Showcase for inspiration
• Flex requires expensive server software – FALSE! Flex is free, open source and doesn’t require any particular server technology.
• Flex and Flash don’t work together – FALSE! Get the Flex Component Kit for Flash CS3 and use Flash to create content and components for Flex.
• Customising the default Flex look & feel is difficult – FALSE! Use CSS-based styling or Adobe CS3 tools to create visual skins
• Flex only has a fixed set of visual components – FALSE! There are lots of additional components or you can create your own!
• Flex applications are large – FALSE! Flash Player 9 (update 3) supports caching of the Flex Framework, reducing the size of your Flex applications dramatically.

Whilst some Flex applications will use the default look and feel (internal applications, data dashboards, etc) there are some great examples of Flex applications where designers and developers have collaborated to create rich, compelling and expressive visual experiences – take a look at Betfair, Volkswagen UK and Picnik.

In each of these cases the development teams were building applications that needed to be maintained and supported for years to come and hence building on top of the Flex framework provides them with significant advantages over using Flash CS3 (note: Flash CS3 is still the choice for creating expressive and interactive content, it’s just not the right tool for every job).

As a designer, you can now contribute to the development of a Flex 3 application in the following ways:

• Use Flex Builder’s design view to apply styling to Flex components
• Use Fireworks to create UI layouts based on the Flex components and generate code that a developer can then use
• Use templates in Fireworks or Photoshop to create bitmap-based graphical skins that replace default skins used in Flex components
• Use templates in Flash or Illustrator to create vector-based graphical skins that replace the default skins used in Flex components
• Use Flash to create components or containers that can be used in Flex projects

The links above reference articles, tutorials or video content on the Adobe Developer Connection site – before you get started though you’ll need the following updates for your CS3 products:

• Flex Design Skin Extension for CS3
• Flex Component Kit for Flash CS3

Quite rightly there has been a lot of buzz around Thermo, and having spent some time with the product team last week there is no doubt that this will change the way we build Rich Internet Applications in the future, but it’s important to note that with Flex 3 and CS3 designers have an important role to play today in creating RIAs.

Advertisement