Using SWFs as dropzone images in Dragster

One of the more advanced ways of building drag and drop activities with Dragster 3 is to use SWF files (flash movie files) as the drop zone image for your activity.

Why use SWF files?

There are two reasons you may wish to do this:

1. Avoiding distortion on scaling - When you are scaling your activity to fill the browser, the dropzone image can appear pixelated with JPG or GIF files. This is particularly a problem when the dropzone image includes text which can become distorted and difficult to read when scaled. Using a SWF file in these cases means that the dropzone image will scale without distortion (View the Gapminder World Chart activity - try right clicking and using Zoom In to observe how the use of a SWF dropzone retains clarity).
   
   
   
2. Animation and interactivity - Using a SWF as the dropzone allows enormous flexibility in adding interactivity and animation. For example using video in an activity dropzone as demonstrated in this running gait analysis activity.
   
   

How to create SWF files

Now the difficult bit.  Creating SWF files (flash movies) can be quite involved depending on the complexity of the interactions required and will require the use of particular software.  Here are a few tips based on my experience to date:

Without Flash software - When creating non-interactive SWF dropzone images I have made some use of Adobe Fireworks to draw the image and then used the Save as > Flash SWF option. However this approach is not perfect and you may find that fonts, colour gradients, drop shadows etc are lost in the conversion.

With Flash software - Adobe Flash is expensive and complex software but its use offers almost unlimited possibilities. I begin by creating a movie of dimensions 600 by 450 pixels and then draw directly onto the movie stage.  Keep each drawn element on a separate layer and convert elements that you wish to add dropshadow filters into movieclips.

Hopefully this post has demonstrated some of the possibilities offered by using SWF files as dropzone images in Dragster 3 activities. Unfortunately creating SWF files is not simple but hopefully I have shown it can be worth the effort!