Plymouth e-Learning Conference 2009
Thank you to all those who attended my session at this recent conference. Below are my slides which contain a link to the demonstrations activities I showed during my presentation.
Dragster help movie – defining target areas with zoom and keyboard controls
The updated Dragster 3 target area definition facility provides several ways to improve the accuracy and time taken to author element feedback. This help movie provides an overview of the new functionality provided and gives some tips to improve your target area authoring. Included are the use of new keyboard controls (summarised below) and how to zoom in and out during the authoring process (View the defining target areas movie).
Keyboard controls:
Arrow keys – accurately move the last target area point for the live target area.
D – deletes the last target area point on the live target area.
R – resets the target area for the live target area.
W – toggle the cursor and area points from grey to white and back again.
Dragster 3 results by element feedback graph
An additional feature has been added to the View results by element page which provides a graphical overview of the feedback provided on recorded results for each draggable element. This graph displays the relative proportions of correct, close, miss and undefined feedback displayed in the recorded activity results (element feedback is considered undefined if the element has not been moved on to the dropzone image).
These graphs allow the viewer to quickly identify which activity elements are most often positioned correctly and incorrectly. Clicking on the related View icon will then allow them to investigate the positioning of this element in more detail.
To see this in action view the Volcano activity results by element page.
Please Note – this feature was added on 16th April 2009 and only activities published after this date will display this facility.
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:
- 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).
- 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!





