gmg tutorials - reusable flash preloader

Yet another Flash MX loader

An in depth look at building a reusable preloader for Flash MX.

01 Introduction
02 What should the loader do?
03 How should the preloader work? / What should it look like?
04 Useful reading / Designing the loader movie
05 What have we got so far? / Getting it to stop and play its parent
06 Setting a preload amount / Sync the loader movie with the download amount / Adding text feedback
07 Setting a maximum loader play rate / Setting a maximum load rate
08 Using the loader
09 Conclusion / About the authors / Copyright

Previous << What should the loader do?

How should the preloader work?

We are going to create a runtime shared resource that we can link to from our other Flash MX movies. Movie reusability in Flash? You betcha!

This is a SWF file that has a loader movie resource containing load animations, a progress bar, and some custom smarts allowing us to quickly work out how our preload is going.

On this side we have the SWF files that require a loader. We will be dragging and dropping our loader from our resource library on to the frames where we want the loader to appear. We will then add some load and enterFrame clip event code to finish them off when we use them.

What should it look like?

Now, out with your crayons and butchers' paper and come up with something that looks good and will be a small file and animates well. Here's our design for the Western Australia: Land and People exhibition created for the Western Australian Museum:

Here we have used the loader after animating in the small elements (window, caption, title bar graphics, and text). This gives the user an entertaining build to the window (window elements stamp or fade in to place) leaving them with the text to read while the image downloads. Instead of leaving a blank window, the loader appears giving them an indication of how the download is progressing.

Here is the result, the wonderful life-size Carnotaurus sastrei on display in the Western Australian Museum's Perth exhibition site:

Next >> Useful reading / Designing the loader movie