Flash Strikes Back: Creating Powerful Web Applications

Flash is a powerful tool that offers developers huge capabilities. Until recently, developers mostly utilized Flash’s strengths to create complex animations or fast-loading movies. However, the most recent versions of Flash offer developers power that’s far beyond the tool’s original scope.

With the advent of Flash MX, we’ve seen that developers have the power to create web applications with more sophisticated client- and server-side interactivity. When integrated with sophisticated server-side software like ColdFusion Server and JRun, Flash delivers the power and flexibility to become a serious contender in the web application space.

Recently, we’ve been studying web applications that truly highlight Flash’s benefits over traditional HTML-based applications. Web applications often involve users completing a process, or a series of steps to get something done. Among Flash’s greatest strengths, we’ve seen that it offers users the ability to view all of the steps in the process in one visual display. Flash also enables users to attack the application steps in their own order. These strengths dramatically enhance the user experience by giving users control and understanding of an application that’s not possible with traditional HTML.

Displaying the Big Picture

In our research, we’ve seen that Flash is a great tool for displaying a web application’s user workflow. With HTML, users typically must access multiple screens to complete a web application process, with little to no control over the order of these steps. With Flash, developers can display all of the users’ necessary steps on a single screen, giving users a “big picture” view of their workflow.

To illustrate, Volkswagen’s web site lets users configure their own car using the Build Your Own Car function implemented in HTML. Users can specify the type of engine, the color of the car’s exterior and interior, and optional features.

To configure a car, the interface requires users to click through five different screens. The problem is that users can’t see how many steps are ahead of them. Users also don’t know if they can easily go back and change their specifications. Choosing an interior trim that costs extra might be acceptable early in the process, but when a more preferable option comes later, users may want to change their interior again to reduce costs.

With the HTML application, users cannot tell if changing preferences will be a simple process or not, thus adding an element of uncertainty to the experience and increasing their chances that they will not complete the transaction.

In contrast, the developers of Volkswagen’s Asia Pacific application created a car configurator implemented in Flash. The configurator matches the functionality of the HTML implementation, but it lets users choose all specifications on one screen. As a result, users can drag and drop their specifications into a template to immediately see the results of their actions.

(We do recognize that VW’s Flash-based application is not perfect. If we tested this application, we would expect to see some users exhibit problems with the design’s novel interface. However, Volkswagen’s Asia Pacific application does a good job of demonstrating Flash’s ability to display an entire user workflow on one screen, something not possible in HTML.)

In addition to the entire process being accessible on one screen, users get immediate responses to their specifications, without having to wait for new pages to load.

The Order of Things

Having a flexible application workflow also allows users to zoom into the features that are most important to them first.

Imagine you want to revise your life insurance policy, but only want to change your beneficiary information. In an HTML form, you may not be able to access the beneficiary data until five screens into the process. Using Macromedia Flash, developers can easily build flexible applications that let users attack the process in their own order.

To illustrate, Moen Design Center’s application lets users build their own product on one screen. Users can design their own kitchen by choosing the type of faucet and the colors of the sink, countertop, cabinets, walls and windows.

In addition to viewing the entire workflow on one screen, users have control over the order they specify preferences, something not easy to implement in HTML. As soon as users specify the criteria, the visual display reflects their choices.

While there are ways to create the Moen implementation with JavaScript and HTML, it’s very clumsy and involves a great deal of download time. It would require a JavaScript function that replaces one image, or choice, with another, based on the colors selected. For Moen’s developers to do this with JavaScript, they would need a separate picture of the kitchen with every possible color/sink combination. This becomes very difficult for developers to manage.

Similarly, Timbuk2’s application lets customers build their own messenger bag with control over the workflow. Users can specify the size, material, color, and other features they want in a custom-made messenger bag.

When buying a messenger bag, not all content is equal to users. For example, some people who are price sensitive may want to jump across criteria, changing the size and color of the messenger bag to make quick cost comparisons. Flash enables designs to have a flexible workflow, allowing users to zoom into the features that are most important to them first.

This article just scratches the surface of what is now possible using Flash to create web applications. Flash’s leading-edge capabilities for creating powerful interfaces and graphical displays are the first components in a new wave of web applications. We’re confident that with the use of Flash, it will be possible for developers to move far beyond the functionality possible with traditional HTML-based applications.