Using Dragster with the eXe eLearning XHTML editor

UPDATE – see instructions on using Embed activity option

eXe the free eLearning XHTML editor is an increasingly popular tool for authoring e-learning content and it is very easy to embed Dragster activities into eXe resources. This is how you do it:

1. Publish and unzip your Dragster activity on your PC.
2. Open the eXe editor and at the appropriate point in your content, select the Flash with text iDevice.
3. Using the Select Flash Object button browse to your unzipped dragster activity folder and select the file called dragndrop.swf.
4. You will need to size the activity appropriately in the eXe iDevice using the dimensions below :
   Dragster 3 – Portrait 600 by 660 – Landscape 900 by 490
   Dragster 2 – 700 by 560
   Tip – you can scale the embedded activity by using smaller dimensions while keeping the height and width in the same proportions (e.g. Dragster 3 Landscape at a scale of 80% – 720 by 392).
5. Export your finished eXe resource (e.g. File > Export > Web site > Self-contained folder).
6. Once you have exported the eXe resource, you need to copy all the Dragster activity files EXCEPT the activity index.html file into the same folder as the other eXe exported files (if eXe exported a zip file, you will need to extract this zip file before copying these files).
7. To view the finished eXe resource open the index.html file within the eXe exported folder.
8. If necessary re-zip the eXe resources including the additional Dragster activity files for upload into a VLE.

View an example eXe resource with an embedded Dragster activity.

Trouble shooting:

If you have any problems with the activity displaying within the eXe resource it is probably because you haven’t copied the necessary Dragster activity files into the folder with the other exported eXe files.

Dragster help movie – using the dropzone image creator

The key to a successful Dragster drag and drop activities is the dropzone image on to which the draggable elements are to be placed. In August we launched the dropzone image creator to make the task of resizing existing images for Dragster activities much, much easier. Using this facility you can take your image and crop and resize it to the dimensions required by the version of Dragster you are using in seconds.
To illustrate this process we have put together this short help movie which includes the use of an image from Wikimedia Commons.

Youtube videos in Dragster activities – demo

For a while now I have been thinking about and working on integrating Dragster with Youtube to allow drag and drop activities to be based on video and animations rather than just static images. This approach is particularly appropriate where movement and context plays an important part in the recognition of parts of an image.

The key aspects of this integration are:

• The Youtube video is displayed as the activity dropzone image.
• The video is played and automatically stops at a specified point in the video.
• At this point the drag and drop activity is based on the static frame of the video being displayed.

To illustrate this I have put together a demonstrator activity which is based upon an animated MRI scan of a heart (view youtube demonstrator). In this example the identification of the structures of the heart is aided by observing their movements in the video. As this is a demonstrator I am very interested in feedback on this approach. Please feel free to contact me in the usual way.