Overview of Flash
by Visualsoft UK Ltd

Since its introduction in 1996, Flash has grown in popularity to become widely regarded as a standard for high-end multimedia Web sites and presentations. Flash was derived from other Macromedia applications, particularly FutureSplash and Director. Macromedia Director has a longer history, but is primarily used for multimedia development for CD-ROMs, movies and television. However, the files created by Director are too large to port effectively over the Web.

Flash offers many of the dynamic features that Director offers, yet Flash compresses file sizes, making it possible to offer media-rich content and fast download times.

How does Flash work?

Flash combines four elements that define its functionality: vector graphics, streaming capability, a timeline, and layers.

Concepts and issues relevant to Flash

Vector graphics

Flash uses vector graphics, rather than bitmapped graphics such as GIF, JPG or PNG. Vector graphics perform more efficiently on the Web because they are based on mathematical computations, rather than the pixel-by-pixel information used by bitmaps.

As such, Flash graphics are scalable without affecting file size. For example, suppose that the two circles in Figure 23-l are separate vector graphics being displayed in a browser. Both images would have the same file size. The only difference between the two circles is the radius, which can be adjusted by a mathematical calculation. Vector graphics use mathematics in this way to manipulate images.



By contrast, if these images were bitmaps, the larger circle would have a significantly larger file size than the smaller one.

Streaming capability

In addition to using vector graphics, Flash offers another important feature that increases its Web compatibility: streaming capability. Streaming allows multimedia content to begin playing as soon as it reaches its destination-in this case, the client browser. For example, suppose a Flash file (also known as a Flash movie) has a total size of 100 KB. Using a standard 28.8-Kbps modem, a user must wait approximately 28 seconds for the entire file to download before the movie can begin to play. With streaming capability, the movie begins as soon as the initial information about the Flash file reaches the browser. This means that the user can begin watching the movie while the rest of the data continues to download.

Timeline

Flash uses the combination of vector graphics and streaming capability to deliver animation that is created using a timeline. The Flash Timeline can be thought of as a series of movie frames. As you develop more frames (or longer timelines), the movie begins to take action. Each Flash movie is a timeline consisting of a series of frames. Each frame contains vector graphics that are opened at a designated sequence and speed, creating the animation.

Layers

The final component of a Flash movie is layers. Each movie can have multiple layers, thus providing animation that is not only linear but also parallel: One animation sequence runs on top of another because each is on a different layer.

Flash and the browsers

Currently, Flash is not natively supported in browsers. Therefore, for a user to play Flash movies, his or her browser needs a plug-in. Because Flash does not rely on the browser, it is cross-platform capable, which is another advantage.

NOTE: IMPORTANTLY, MACROMEDIA IS WIDELY THOUGHT TO HAVE BEEN BANKING ON NATIVE SUPPORT IN BROWSERS, PARTICULARLY MICROSOFT. THIS HAS NOT HAPPENED AND IT FORMS THE BASIS OF THE QUESTION OF WHETHER FLASH WILL GAIN IN POPULARITY OR NOT. DISCUSS IN YOUR TUTORIAL WHETHER USERS ARE BECOMING ANY MORE INCLINED TO WANT TO DOWNLOAD PLAYERS TO READ WEB PAGES.

According to a study at the beginning of 2000, Flash had an installation base of 68 percent, or approximately 195 million users who have the Flash plug-in. There are two reasons for this. One is that many sites use Flash, and therefore many users have downloaded the plug-in. The second reason is that the 4.x versions of both Navigator and Internet Explorer include the Flash plug-in installed by default. AOL and WebTV also provide some Flash support in their browsers.

How Flash works with HTML

When you create a Flash movie, you have a file with the .fla file name extension (on the Windows platform). The FLA file format can then be converted and compressed into a SWF (pronounced "swiff"), which is then inserted into the HTML code using the <OBJECT> tag (for Internet Explorer) or the <EMBED> tag (for Navigator) to display in the browser. When the browser encounters the SWF file, the Flash plug-in is used to display the Flash movie in the browser.

Thus, the only HTML code on which Flash relies is the <OBJECT> and <EMBED> tags.

Some sites are created entirely with Flash, while others use Flash to provide simple animation such as navigation menus and rollover effects. Therefore, while Flash does not rely on HTML, the two technologies can co-exist and complement each other.

The Flash Interface and Components

The Flash interface uses palettes and toolbars for development.

To start Flash

Launch Flash by selecting Start > Programs > Macromedia Flash > Flash .

Note the following components of the Flash interface

Flash stage: the area in which you place elements, objects and graphics used in the movie.

Flash timeline: a sequenced ruler used to control the movie and how it plays the elements on the stage.

Flash layers: canvases used to control objects placed on the stage. Layers allow multiple objects to be positioned independently of each other.

Flash drawing tools: tools used to draw, colour, paint, move, resize, stretch and fill the objects on the stage.

Libraries

From the main menu, select Libraries. Notice the options for the available libraries.

Buttons Library

Select Buttons. These objects are available to place in Flash movies. If you click once on a button, you will see a preview in the top of the library.

Click the X to close the library.

Symbols

To insert a symbol

From the main menu, select Insert > New Symbol. The Symbol Properties dialog will appear. As you work with objects in Flash, you convert them to symbols based on how you want them to behave. Notice that you can name the symbol, then specify it as a graphic, button, or movie clip.

Click the Cancel button to close the Symbol Properties dialog.

NOTES ON SYMBOLS AND LIBRARY

Flash has the ability to define and reuse objects called symbols. A symbol is a graphic, a button or a movie clip that is stored in a Flash movie’s library. Symbols can be created after an object is imported into Flash. Flash automatically adds the file to the library for the current movie.

For example, suppose you import a graphic image. Flash will place the file in the library and name it. However, the graphic is not yet a symbol. To convert the graphic to a symbol, you must select the graphic, specify it as a graphic symbol, and give it a name. Once the file is a symbol, it can be inserted repeatedly throughout the Flash movie.

If you need to change the appearance of a symbol, you can edit it in Symbol Edit mode. After you make changes to the symbol file, all instances of the symbol used throughout the movie will reflect those changes. By contrast, if you left the file as the default graphic it was when you imported it, the changes you make later would not be reflected in other instances of the graphic.

Settings for Publishing

From the main menu, select File > Publish Settings. The Publish Settings dialog will appear. Note the tabs on the Publish Settings dialog:

• The Formats tab allows you to specify how you want Flash to publish a movie. By default, Flash creates a SWF file then generates an HTML page with the code necessary to view the movie in a browser.
• The Flash tab allows more advanced settings, such as loading preferences. You can specify how your movie loads in order to protect it from importing. (All SWF files can be opened in Flash, and you may not want someone else to download your Flash movie to see how it was made.) You can also specify the audio type used and the Flash version with which the movie must comply.
• The HTML tab allows you to specify the quality and position of the Flash movie in the HTML page that is generated.

For now, all the default settings are acceptable.

Click Cancel to close the Publish Settings dialog.

Flash Layers

Study the Flash Layers section and notice the icons: an eye, a lock, and a square. The Eye icon hides or displays the layer, similar to Dreamweaver. The Lock icon prevents a layer from being edited, which is helpful when working with many layers. The Square icon displays objects so that only the object outline is visible, hiding the fill.

Drawing Tools

Note the Flash Drawing Tools. You will learn to use each of them in the exercises in this course.

Notice also that the Flash main toolbar is similar to other Windows applications, enabling you to open, save, print, cut, copy, paste, undo and redo with the click of a button.

Developing with Flash

Flash is both a development tool and a testing tool. This means that you need not load the SWF file into an HTML page then a browser each time you want to test your work. As a development tool, objects and images can be created in Flash, eliminating some of the need to use other applications to create graphics and then import them. However, Flash does support the importation of GIF, JPG and PNG file formats.

Developing with Flash will be a different experience at first, due to the use of the timeline and layers. As you develop, you must think in different terms because you are no longer limited to linear constraints. If you have worked previously with an image application that supports layers, you will better understand the function of a layer and its significance to other layers on the page.

With Flash, you are limited only by your imagination. As you begin to develop files and gain an understanding of the application, you will find that it is a highly robust tool for multimedia.

Flash Pages

A question commonly asked about Flash is whether or not to create a site entirely with Flash. As with many questions about the Web, the answer depends on many factors.

While simple in terms of using its graphical interface for development, creating Flash movies can still be time-consuming. You must also consider the updating requirements of your content. While content updating with HTML is becoming more common in the workplace, updating Flash content still requires an advanced user. Therefore, if the site you are developing will require frequent content updates, or if inexperienced Flash developers will perform updates, then it is not advisable to develop a site entirely in Flash.

Common uses for Flash generally serve the purpose of rich multimedia design. For example, splash pages provide a quick movie introduction lasting from 10 to 30 seconds before refreshing automatically to the home page. When using the splash page technique, always provide a link for users to bypass the introduction.

Return visitors may not want to see the splash again. Flash can also provide effective navigation elements that offer an enhanced user experience while navigating the site.

DISCLAIMER: The content provided in this article is not warranted or guaranteed by Developer Shed, Inc. The content provided is intended for entertainment and/or educational purposes in order to introduce to the reader key ideas, concepts, and/or product reviews. As such it is incumbent upon the reader to employ real-world tactics for security and implementation of best practices. We are not liable for any negative consequences that may result from implementing any information covered in our articles or tutorials. If this is a hardware review, it is not recommended to open and/or modify your hardware.

More Web Development Articles
More By Developer Shed

 

developerWorks - FREE Tools!

NEW! Best Practices: The Integrated Project and Portfolio Management Platform. Hear how IBM Rational Project and Portfolio Management integrated solutions help teams put the right tools and processes in place to maximize the effectiveness and efficiency of project teams and ensure that the business vision is being executed correctly. Learn how to automate and integrate requirements prioritization, top-down project planning, communications and controls, and methodology deployment to keep your scope, costs, and schedules under control. Tackle with an end-to-end approach the management of scope and scope changes, usage of methodology to control and empower project teams, and optimization of resources to align activity costs with the overall project plan. FREE! Go There Now!

NEW! IBM – Taking Web 2.0 to Work David Barnes, Lead Evangelist for IBM Emerging Internet Technologies will discuss aspects of Web 2.0 that bring value to corporations, academia, and government. He'll also discuss IBM's vision around Web 2.0, including the importance of remixability and consumability. The discussion will culminate with examples of various IBM Software Group solutions you can use to get ahead of the Web 2.0 adoption curve. FREE! Go There Now!

NEW! Discovering the value of WebSphere Process Server WebSphere Process Server delivers a unique integration framework that simplifies existing IT resources. Often, as IT assets grow to support business demand, so too does their complexity and manageability. In this webcast, we’ll discuss how WebSphere Process Server helps deliver an SOA infrastructure that provides a common model to orchestrate, mediate, connect, map, and execute the underlying IT functions. Discover how WebSphere Process Server simplifies integration of business processes by leveraging existing IT assets as reusable services without the complexities of traditional integration methodologies. FREE! Go There Now!

NEW! Download a free trial of WebSphere Business Modeler Advanced V6.1.1 Visit IBM developerWorks to download a free trial version of WebSphere Business Modeler Advanced V6.1.1, IBM’s premier business process modeling and analysis tool for business users that offers process modeling, simulation, and analysis capabilities. IBM WebSphere Business Modeler helps you visualize, understand, and document business processes for continuous improvement. FREE! Go There Now!

NEW! Hello World: Learn how to install and use the Rational Asset Manager Eclipse client In this tutorial, you can learn how to install and configure the IBM Rational Asset Manager Eclipse client, explore the different views in the Asset Management perspective, learn various search techniques, work with existing assets, and submit a new asset. FREE! Go There Now!

NEW! Hello World: Monitor a simple business process using WebSphere Business Monitor V6.0.2 This tutorial shows new users of IBM WebSphere Business Monitor Version 6.0.2 how to perform the "Hello World" equivalent for monitoring business process applications. It is intended to help you get familiar with the capabilities of the product. FREE! Go There Now!

NEW! Rational Talks to You:Per Kroll on Rational Method Composer Plug-in customization Join this Rational Talks to You teleconference on December 11 at 1:00 pm ET to get tips on building your own plugins with Rational Method Composer. Get your questions answered! FREE! Go There Now!

NEW! The dirty dozen: preventing common application-level hack attacks As organizations have grown increasingly dependent on online software, the risk of malicious attacks has also become far more serious. Fortunately, well-governed organizations can protect their Web applications by injecting vulnerability assessments and ethical hacks into their software development and delivery processes. This paper describes 12 of the most common hacker attacks and provides basic rules that you can follow to help create more hack-resistant Web applications. FREE! Go There Now!

NEW! Trial download: IBM Rational Performance Tester V7.0.1 Get a free trial download of the latest version of IBM Rational Performance Tester V7.0.1, a load and performance testing solution for teams concerned about the scalability of their Web-based applications. Combining multiple ease-of-use features with granular detail, Rational Performance Tester simplifies the test-creation, load-generation and data-collection processes that help teams ensure the ability of their applications to accommodate required user loads. FREE! Go There Now!

NEW! Webcast: Eclipse: Empowering the universal platform The Eclipse community is constantly working to extend Eclipse's functionality. In this webcast, learn about some of the most important and feature-rich projects under development. From multi-language support to plug-in development, tune in to see what Eclipse is capable of now. FREE! Go There Now!

All FREE IBM® developerWorks Tools!