Flex Builder 3 review

Filed under:

Adobe Flex Builder 3
VERDICT Flex steps up a gear with improved CS3 integration and data connection and new desktop capabilities.
Flash began life as a way for web designers to add simple vector animations to their web pages. In the twelve years since it has grafted on impressive content handling, interactivity and programmability and become the one must-have browser plug-in. In the process, and almost unnoticed, Flash has turned itself into an online computing platform with Flash content viewable by almost all internet users. Now Adobe is determined to fully capitalize on this platform by unleashing Flash’s ability to create full-blown, self-contained Rich Internet Applications (RIAs) – and to take the same power to the desktop (see AIR boxout).

However there’s a problem. To unlock Flash’s full potential as a computing platform Adobe needs to rebuild its technology and applications to appeal not to the designer but to the developer. Which is where Flex comes in. Flex is a radical reworking of Flash built around two major languages. The first is MXML (Macromedia eXtensible Markup Language) which is a declarative language for describing Flash-based application interfaces. The second is ActionScript 3 which is a reworking of Flash’s longstanding procedural scripting language rewritten to today’s more exacting programming standards. Put the two together - presentation and logic - and compile the results to the binary Flash SWF movie format and the resulting RIA is immediately viewable by anyone with the Flash Player 9 installed which, according to Adobe, means around 95% of the total internet audience.
Adobe is keen to spread the use of Flex as quickly as possible hence its recent decision to make the Flex 3 SDK (Software Development Kit) open source (www.flex.org). This means that you can create your own Flex apps for free in any code editor, but the majority of serious users will be happy to pay something for a dedicated solution. This is where Flex Builder comes in, providing a dedicated IDE (Integrated Development Environment) for working with MXML and ActionScript 3.
Rather than reinventing the wheel, Adobe makes much of the benefits of working with existing open standards and so Flex Builder is based on the open source, cross-platform Eclipse IDE. The Eclipse environment is based around a central Application window which can be switched between Design and Source view for designing visually or coding directly. Surrounding this are various panels with which you can navigate your project, drag on controls, set properties, view errors and so on. It’s all pretty logical, but the open source origins are clear in the less-than-attractive look-and-feel and the number of rough edges such as the lack of a split view and inability to filter files by type when importing. Developers should feel reasonably comfortable and productive but it’s ironic that an application whose whole purpose is to produce sophisticated design-rich applications should itself feel so unpolished and barebones.
Once you’ve come to terms with Flex Builder’s interface, the easiest way to start creating the interface for your own application is by switching to Design view and dragging and dropping controls from the Components panel. By default these are categorized into three groups: the Layout controls such as Canvas, Form and Grid which act as containers for all others; the Navigator controls such as Accordion, TabBar and ViewStack which are used for navigating between alternative child controls; and the general Controls, such as Button, TextArea, and ComboBox which act as the front-end for your application’s user-interface.
These three control categories are always available but there are two other context-sensitive collections. If you buy the Professional Edition of Flex Builder (£349 exc VAT) then the major difference – apart from some additional profiling and debugging tools – is the inclusion of a collection of Chart controls which make it simple to include area, bar, line, pie and other charts for visualizing numeric data. Connect these controls to server-held data – a process made easier in this release by the addition of wizards to help connect to Web Services and to back-ends based on PHP, ASP.NET, ColdFusion and Java – and you can include live graphics in your RIAs, for example graphing real time share price movements, just as you include live XML-based text.
Alternatively, if when you first create your project you choose the new option of creating a Desktop rather than Web application, then you’ll find another category of components available: AIR controls. Most of these such as FileSystemTree and FileSystemList are used to enable local file handling, but the HTML control is even more important. Essentially it allows AIR applications, which operate outside the browser, to provide their own embedded browser based on the WebKit open source project. WebKit’s support for HTML/CSS/Ajax means that it’s relatively simple to rework an existing website for offline delivery and this is likely to be a major use for AIR.
By default all Flex controls share similar styling based on the Halo theme which is fine but a bit dull. To create a custom look for your application you can change parameters such as colour, font size, border colour, corner radius and so on in the Properties panel with all changes now reflected immediately in Design view. Another interesting use of existing technology is the way that Flex takes advantage of CSS for such styling meaning that the look-and-feel of your application can be efficiently, consistently and centrally managed.
Such CSS handling has advantages but it’s hardly the state-of-the-art for rich design so, by default, Flex applications actually look pretty dull and rudimentary. To fully stamp your brand onto your application you need to move from styling to skinning. Skins define the appearance of the various states of your controls and they can be based on bitmaps or, for full scalability, vectors. Disappointingly this isn’t possible within Flex Builder but, once you’ve installed new Skin Design Extensions, you can prepare your skins for import with the latest CS3 versions of Photoshop, Fireworks, Illustrator and Flash. The closest connection naturally is with Flash and, if you install the Flex Component Kit for Flash CS3 Professional, you can create interactive animated content that can then be imported as a ready-to-use Flex Builder component. It’s workable but presumably with CS4 the integration will be tightened up considerably.
So far we’ve been designing visually but Flex Builder 3’s real power becomes available when you switch to Source view and begin coding. Here you can directly edit the MXML mark-up that you’ve built up complete with colour-coded syntax, code assist, auto completion and so on. It’s here too that you add behaviours and effects, for example to make buttons blur or spin - though why this can’t be done in Design view is mysterious.
Most importantly it’s in Source view that you add the logic to your application using ActionScript 3. Flex Builder allows ActionScript to be handled locally or via separate code-behind files and provides exactly the same coding support as it does for MXML. Based as it is on Javascript, ActionScript is relatively easy to get to grips with and provides a similar platform for scripting both player and browser. Moreover, in its latest object-oriented, ECMAScript incarnation, it is more efficient and powerful than many people realise. However for advanced jobs ActionScript is unlikely to be able to compete with Microsoft’s support for .NET languages such as C# and IronRuby through its upcoming Silverlight 2.0 technology.
Microsoft is the elephant in the room when it comes to discussing to the success or otherwise of Flex Builder. Compared to the supremely professional Expression Blend authoring environment, with its deep integration with the other Expression Studio apps and with Visual Studio and its dedicated and powerful XAML and .NET presentation and logic technologies, Flex Builder, with its associated CS3 extensions and use of existing standards and binary delivery, can suddenly appear dated, cobbled together and underpowered. It’s possible that when Expression/Silverlight 2.0 arrives to enable RIA as well as desktop application authoring then Flex will get blown away.
On the other hand, the full potential of the RIA space is so enormous that there should be plenty of room for more than one solution especially as multiple players should happily co-exist in the same browser. Moreover Flex Builder has a lot going for it when compared to Expression Studio. In particular Adobe’s all-in-one approach to handling both presentation and logic is simpler and cheaper than Microsoft’s and better suited to the average independent designer-cum-developer who will also benefit greatly by familiarity with underlying technologies such as CSS, ActionScript/Javascript, HTML/Ajax and so on. More to the point, until the Silverlight 2.0 player arrives and takes off, Microsoft’s not even in the race while Flex is up-and-running and able to deliver a cross-platform RIA platform that is immediately accessible by 95% of internet users.
In other words, with Flex, Adobe effectively owns today’s online RIA platform. Moreover with Flex 3’s new AIR technology it can reinforce that dominance and hit Microsoft where it hurts the most – on the desktop.

EASE OF USE 3/6
FEATURES 5/6
VALUE FOR MONEY 6/6
OVERALL 5/6

AIR

Flex Builder 3’s most significant new capability is its support for Adobe’s new AIR platform. AIR stands for Adobe Integrated Runtime and is designed to allow cross-platform Rich Internet Applications (RIAs) based upon Flash/Flex to move out from the browser and onto the desktop.
Adobe AIR application
From the developer perspective, AIR offers the same simple cross-platform development and deployment model as for online apps but opens up a whole new level of application branding and, more importantly, new functionality. In particular AIR applications aren’t as restricted by the browser security sandbox so can take advantage of local file access and storage. Most importantly, the AIR-based application no longer needs to be connected and online to operate.
From the end user perspective, while the AIR runtime is a significant 11MB this only needs to be downloaded once. From then on it’s simple to download the typically lightweight AIR files and these are installed, uninstalled and run just like other desktop applications. Unlike most desktop applications, however, AIR apps are almost certain to follow the free online pricing model.
The potential is enormous most obviously for AIR applications that extend existing web brands, such as online banks and photo hosts, by offering new functionality and offline access. Now we just have to sit back and see what the developers can come up with.

Recommended Further Reading

Below is further reading on the subject, as recommended by amazon.com users.

Click here to find similar recommendations from amazon.co.uk

To search directly please use these links: amazon.com and amazon.co.uk



Filed under:

Tom ArahTom Arah is the webmaster of designer-info.com. He has been a professional designer working with computer software since 1987. He also offers training and consultancy and since 1997 has been the contributing editor covering design issues for PC Pro, the UK's biggest-selling (and best) computer monthly.

Home | Web Design | Publishing | Bitmap (Photo) | Vector Drawing | 3D
Site Info | Site Map | Search | Contact | Guestbook |

For older content (over 300 reviews and articles) please click here

To support the site please shop via these links: Amazon.com & Amazon.co.uk