Overview - Macromedia Flex

One of the complaints heard in Macromedia Flash circles is that the pendulum in Flash development has swung much to much over to the developer side and away from the initial animation drawing and design which brought Flash all its success. And there is more than a small element of truth to that argument. If one looks in some of the recent books on Flash we read from respected Flash authors like Sham Bhangal that "Frame based drawn animation has both advantages and disadvantages. One of the key problems is that once an animation is made, there is very little room for variation without reanimating it, or creating several hundred animations. What if we wanted our circle to .. down a fraction every frame ? Well, we could go back and move its final keyframe down slightly or we could simply animate the whole movie using the concept of scripted motion. With scripted motion our entire movie only really has to be one frame long as we use ActionScript code to define all the details of the motion of our object[s].". Check any of our Flash book reviews and similar arguments are made there. Finally, take a look at what's new in Flash Pro Mx 2004 divided by primarily for developers/programmers versus for designers/graphic artists:

New and Primarily for Designers/Hand Animators
Timeline Effects - apply to any object on the Stage to quickly add transitions and animations such as fade-ins, fly-ins, blurs, and spins. This a welcome addition pioneered in Swishzone's SwishMax(see our review).
High-fidelity import - lets you import Adobe PDF and Adobe Illustrator 10 files and preserve accurate vector representation of your source files.
Video Import - is a new wizard which simplifies video encoding and offers encoding presets and clip editing.

New and Primarily for Developers/Scripters
Behaviors - invokes functionality that links to a website, loads sounds and graphics, controls playback of embedded videos, plays movie clips, and triggers data sources. Eases scripting for designers but essentially is scripting and requires other scripting for effective use.
Flash Player detection - You can detect if a user has a specified Flash Player version. You can configure your published files to direct users to alternate files if they don't have the specified Flash Player. All programming here.
Accessibility features and components - offer tab ordering, tab focus management, and improved support for third-party screen readers and closed-caption programs. Many benefits require programmatic support.
Enhanced globalization and Unicode support - allows multi-language authoring using any character set; again this implies a fair degree of programmatic support.
Security - the Flash Player 7 enforces a stricter security model than previous versions of the Flash Player. This again implies programmatic support.
ActionScript 2 is an object-oriented language that follows the ECMA script language specification and supports inheritance, strong typing, and the event model. This is the major update to Flash Pro by far with its numerous programming changes and half dozen new objects, new components, new programming interface plus the dozens of new properties and function/method calls. programming in Flash has had a major overhaul.

The bottom line is that Flash, of necessity, has become more of a programming environ in the past few revisions starting with Flash 4 and extending through Flash 7 or Mx2004.

The Necessity of Programming in Animation

There are several reason for using programming in animation. As Sham Bhangal points out in his book Flash Mx Designer's ActionScript Reference, there are a number of properties of animation objects (or sprites) such as position, rotation, scale, opacity, and coloring among others that are much more easily controlled programmatically when you want to change them. And of course animation is all about changing things. Second, the whole process of managing many actors on one or more timelines to be displayed on many possible devices from a movie widescreen down to mobile phone - animation publishing and control implies programming. Finally, bringing together all the rich elements that are used in animations including vector and bitmap images, sound, video, 3D models and so on - all of these rich elements are better integrated and controlled with programming support. Its not as if Macromedia did not try to minimize programming overload. The first 2-3 editions of Flash subsisted on gotoandPlay(), gotoandStop(), startSound(), stop() and other very basic control commands. But the inevitability of programming support and fortuitous choice of JavaScript as the base for ActionScript has been well rewarded with Flash becoming the standard that almost all professional graphics programs support and 98% of all browsers use.

Macromedia thinks of Flex as the Enterprise solution for rich media Internet applications. Macromedia starts with the premise that the Internet provides a good experience for search and browsing - essentially read-only operations over the Web. But for interactions and transactions, the Internet even using DHTML has too many page refresh transactions which are time consuming and fraught with potential operator error. The need is for intelligence to be available on the client desktop and in a cross platform manner. But as we have seen in the sidebar above, Microsoft is only prepared to offer client-server programming intelligence on the desktop on its terms - just so long as it runs on Windows desktops using Microsoft-enabled apps or at the least through Internet Explorer or other Microsoft mediated means.

But thanks also largely to Microsoft and Internet Explorer, the Flash Player runs on 98% of all browsers worldwide. Listen how Macromedia describe its ability to deliver RIA - Rich Internet Applications. "Macromedia is widely recognized as a leader in the emerging market for RIAs. The Macromedia Flash client is available now on 98% of browsers, so almost everyone can use RIAs based on Flash. The Flash
client has a lightweight, cross-platform, cross-device runtime that is neutral for both application server development and deployment platforms and for client operating systems (Windows, MacOS, and
Linux). Applications that target the Flash Player can run identically on all the major operating systems today, and are backward compatible with previous versions of Windows and the Macintosh OS.". In essence, Flash Player is the perfect vehicle for delivering the presentation layer over the Internet:
1)because it runs on all major desktop and new mobile operating systems;
2)because with its built in ActionScript programming language it can eliminate the need for to and from network page transaction required by most HTML;
3)because with its time-proven superior compression routines, Flash delivers rich content better;
4)because the Flash Player is a closed system with self contained security mechanisms, it can offer a richer access model than the strict HTTP/HTML closed sandlot model.
So by this logic the Flash Player is the perfect vehicle for delivering rich interactive presentations over the Web to all PC desktops and a broad range of mobile devices as well. All we have to do is empower the Flash Player with strong/diverse connections to popular J2EE server frameworks and/or .NET backend - and voila you have much better and richer Internet interactions and transactions. Ohh and Macromedia has a J2EE server framework, JRun with Cold Fusion Mx, which happens to need a client side scripting language and a Visual IDE. Hmmmm. How to deliver RIAs - Rich Internet Applications? Hmmmm.

Flex = JRun/Cold Fusion II + Flash

But lo and behold what does Macromedia already have ? Yes in Cold Fusion a template for how to deliver Internet Applications to the client. Why not deliver Flash SWF embedded in HTML as the primary presentation layer experience on the client desktop device? Use CFML-Cold Fusion Markup Language as a template but make it fully XML powered and also be more rich media and presentation layer aware ? Call it MXML. Why not add a full visual development and debugging environ, an IDE, for developing this MXML code ? Codename the IDE "Brady" for now and model it on the drag and drop ease of development available in Visual Basic or Borland JBuilder with their drag and drop visual and database connection components. This could be the visual IDE that Cold Fusion developers have been clamoring for over the years. Add to the environ the ability to make the latest SOAP/Web services calls and to work with other SOAP savvy environs such as Java's J2EE or Microsoft's .NET environ and you have a delivery vehicle for J2EE/Web Services that is

as robust as the big Microsoft Visual Studio or IBM WebSphere Studio in connecting to database and middleware services but also provides a leg up on ease of development and most importantly on delivering rich media - audio, video, vector and bitmap graphics to the desktop and mobile devices. In effect, marry your Flash and ActionScript and Cold Fusion technologies together and ride that troika to a potentially commanding position in the rapidly evolving 8A's market - Applications Able to deliver Access to Anyone Authorized Anytime, Anyplace, on Any device. So in effect Flex with Flash and MXML handles the front end of the 8A's Applications and lets BEA, IBM, Microsoft, Novell, Sybase and others fight over the back end delivery vehicle/application server.

Now Macromedia is not alone in wanting to deliver this Rich Internet Application. Microsoft is working on "Sparkle" which will use an enhanced Windows Media Player in a similar role, albeit for Windows desktops. And Adobe is hard at work bringing its successful Adobe Acrobat PDF cross platform document container up to snuff as an allpurpose fill-in-the-forms container for Enterprise workflows. The new Adobe tool will have an IDE for creating forms in XDP files that are a superset of PDF. The IDE will also use JavaScript as the programming glue. And portal vendors like Sybase, Plumtree, BEA all have IDEs with the more or less ability to deliver alternates for the HTML/HTTP to-and-fro experience. So Macromedia will not be alone.

But Macromedia does have the advantage of having tuned Cold Fusion through at least five versions for performance, reliability, scalability and security. So expect MXML to be reasonably fine-tuned right out of the gate. Likewise the Flash player has gone through 7 versions and really has yet to be matched for the breadth of media it delivers with such compactness over so many platforms and with good performance and relative security. Adobe PDF is starting to approach Flash SWF in terms of breadth of media and range of platforms; but I am from Missouri on performance and compactness of contents. Likewise MindAvenue and ViewPoint do have a wider number of 3D media supported but do not have the breadth of platforms or availability of their players and certainly not the range of experience integrating their players with a variety of data processing frameworks that Macromedia has. So Macromedia has certainly a good shot at becoming a major player in 8A's Application Development.

Some Flex Details

In order to see how well Flex has adopted to being the new Cold Fusion II+Flash its useful to look at some examples from the Macromedia website. These examples show the MXML markup language, some ActionScript 2 plus CSS usage in simple Flex applications. Most of the heavy work is being done back at the Flex server just as in a Cold Fusion or J2EE application.

The first example is the classic Hello World application in which the message is copied from the top text input field to the r on bottom one by clicking the Copy button in an IE browser session. Note the coding, like in CFML, is fairly compact. Note also the use of the XML namespace"mx:". This is important because by simply changing or adding name spaces one can add new functionality or new variants to the MXML coding available to users. Note all three form tags are self contained as indicated by the "/>" closing brace. But the overall <mx:Application> follows XML conventions and is closed by an </mx:Applications> closing tag. In short, the new MXML resembles CFML closely but has the added power of being an XML dialect - parsable, extendible including by namespaces, and operable by XML and XSLT tools. For this reason do expect to see third party extensions generating Flex components, effects, behaviors, and application programs. Components are just new Flash .SWC files that describe the workings GUI component like a button, a tree structure, or a tabular grid. Effects are predefined ActionScript 2 transformations that can be applied to any GUI component. And behaviors are ActionScript 2 code but that help

The next example shows a more sophisticated set of components including a Horizontal box, Vertical box, a DataGrid, a TextArea, a Tree structure(which is just for display it has not been wired up for usage). But the important point to note here is how containers can be contained within one another and Flex understands the XML containing or hierarchy relationship. Again this is a working example from the Flex beta that I have seen elaborated into much more detail with working ActionScript 2 code along with predefined behaviors and effects. Another important point to note for designers and developers is how quickly it is possible to generate a working UI prototype which can be demonstrated to users for quick feedback. In fact, the whole Flex architecture should work well in an agile modeling framework where shorter design cycles, team programming and up front testing are emphasized. Flex fits well because with the many predefined behaviors, components and effects its easier to glue and test parts together early and often in the process of development. Flex's version control aids teamwork

The next example shows the use of standard CSS to style components of the Flex interface. Flex has a good message regarding use of familiar standards. ActionScript 2 is a subset of ECMAScript 262 version 4 otherwise known as JavaScript 2. The server side of Flex is developed in Java and will support output of backend control processes in J2EE and .NET (deferred to a later version of Flex). The styling of Flash screens can be modified by CSS stylesheets which many Web developers will already be familiar with. Finally, MXML follows XML standards and will also be familiar to many developers. So Flex will not incur a large learning curve. The use of CSS is a good example. By using the mx:style tag users direct Flex to use a style file in a manner very similar to HTML usage. Then invoking the specific stylename is just an attribute in each of the different component tags as in the case of styleName="error". This is already a proven, fruitful styling mechanism thoughtfully carried through to Flex. Flex also supports skins so that the styling of whole screens can be rapidly changed by substituting skin files. Throughout Flex there is attention to separation of presentation and styling from programming and control functions. For example, transition effects like the appearance of a highlight with an error message until the

correct response/button is clicked or use of a glow highlight for the next field to get focus when filling out a complex form are readily programmed in Flex.The glowing field dims when the user starts entering values in the field. Likewise Flex allows delivering whole range of audio and visual cues or help by means of effects. In a later update review of Flex, we will examine Flex's effects, CSS stylesheets, components, in more detail. But the quick review shows that Flex is steeped in familiar forms and standards which should help to promote its adoption.

Summary

Flex is Macromedia's new Rich Internet Application development environ. It will not be alone with products from Adobe, BEA, IBM, Microsoft, Novell, Oracle, Sybase and others sure to challenge for a chance to deliver 8A's capable development environs. In short, Flex will be subject to tough competition and will succeed or fail on how well it meets users needs. But already it has met a number of internal Macromedia needs. First, Cold Fusion will get a real visually astute IDE as well as an XML up-to-date markup language. Macromedia will have differentiated its rich media plugin from the legion of 3D capable competitors from Adobe's Atmosphere through MindAvenue's Axel to Viewpoint's Viewpoint. Finally, with a full fledged data processing environ available for the Flash player, the Flash development tool may be able to swing a little more emphasis back to the drawing and design side of its key animation program. But overall, Flex certainly has some strong cards to play in the ease of development category because it, like PHP 5, reuses existing technologies - ActionScript/JavaScript, CSS, Flash, Java, J2EE, .NET in novel ways. This reviewer is still from Missouri on reliability, security, performance and compatibility with fast emerging portlet/portal and Web Services enablers, but Flex's pedigree demands developers attention over this year.

For more details see our Flash links and/or our Flash tutorials.