Dragster – Using the embed activity publish option with Wimba Create, eXe and CourseLab

In March 2010 a new publish option was provided for Dragster 3 activities called the Embed activity option. The format of the activity files published via this option have been specifically designed to facilitate the integration of the published Dragster 3 activity into e-learning resources created with other common authoring software.  The steps by which an embed activity can be integrated into an Articulate Presenter presentation have been described in a previous blog post.  This post will review how this publish option can be used to quickly and easily add Dragster 3 activities to resources created using other authoring software such as Wimba Create, Exe and CourseLab.

To publish a Dragster 3 activity using the Embed activity option click on the Embed activity link on the publish dragster activity page as shown below:

Extract the downloaded zip file to view the files making up an activity published in this format.  These consist of a SWF file and a folder containing all other related activity files that have the same name (see below). These file and folder names are important and should not be changed.

In general terms the steps involved in adding a Dragster 3 activity published in this format to your e-learning resource or course are:

1. To embed the activity into your e-learning resource you should use the normal options available for inserting a flash movie according to the software involved (see below for specific details).
2. If you have multiple Dragster activities, insert each related activity SWF file at the appropriate point in the resource.
3. Publish the resource.
4. Copy all the embedded Dragster activity folders into the published resource files (usually at the root level).
5. View the resource.

Wimba Create (Coursegenie)

1. At the appropriate point in your MS Word document select the Interaction > Media options in the Wimba Create menu.
2. In the related pop-up:
   • select the Flash option
   • for File browse to the published Dragster 3 activity SWF file
   • define the Display as Width 600 and Height 660 for portrait activities Width 900 and Height 490 for landscape activities.
   • Check the Autostart option (leave the Loop option unchecked).
   • the accessibility tab allows the entry of a long textual description of the activity and for the addition of a link to download a flash player.
   • click OK to embed the activity.
3. Repeat the previous steps to insert other activity files at appropriate points.
4. Publish the course files using the Generate Course menu option.
5. Copy all the Dragster activity SWF files into the Wimba Create published media folder.
6. Copy all the published Dragster activity folders into the root folder of the published Wimba Create course.
7. View the Wimba Create course by opening its index.html file in your browser.

eXe – e-learing XHTML editor

1. Open the eXe editor and at the appropriate point in your content, select the Flash with text iDevice.
2. Using the Select Flash Object button browse to your unzipped dragster activity folder and select the SWF file.
3. 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).
4. Repeat steps 1 to 3 to insert multiple Dragster activities.
5. Export your finished eXe resource (e.g. File > Export > Web site > Self-contained folder).
6. Copy all the published Dragster activity folders 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.

CourseLab

1. On the appropriate CourseLab slide use the menus to select Insert > Object and expand the Media section and drag a Flash object on to the slide.
2. Resize this flash object to make it as large as possible.
3. Right click on the Flash object and select properties.
4. For the file option, select the SWF file for your published Dragster activity.
5. Repeat steps 1 to 4 to add multiple Dragster activities to your CourseLab course.
6. Publish your completed Courselab course on to your PC and extract the published zip file.
7. Copy the published Dragster activity folders into the folder called 1 (you should see a file called start.html within this folder). Now test the course by opening start.html inside the folder called 1.
8. Re-zip the course for upload in your VLE.

Embedding a Dragster activity in a CourseLab course

UPDATE – see instructions on using Embed activity option

CourseLab is a powerful free e-learning content authoring package which uses a familiar authoring interface modeled on Powerpoint. Here are a set of instructions for integrating a Dragster drag and drop activity within a CourseLab course:

1. Author and publish your dragster activity.
2. Unzip the published dragster activity to view all the activity files.
3. Now go to your courselab course. On the slide use the menus to select Insert > Object and expand the Media section and drag a Flash object on to the slide.
4. Resize this flash object to make it as large as possible.
5. Right click on the Flash object and select properties.
6. For the file option, select the dragndrop.swf file in your published Dragster activity.
7. Publish your completed Courselab course on to your PC.
8. You now need to copy some additional dragster activity files into your CourseLab course to make the dragster activity work. These files are dragndrop.xml and any image files within the published dragster activity folder. So select all these files and copy them (Ctrl-C).
9. Now unzip your published courselab course.
10. Open the unzipped course folder
    paste the dragster activity files into the folder called 1 (you should see a file called start.html within this folder).

    

    

11. Now test the course by opening start.html inside the folder called 1.
12. Re-zip the course for upload in your VLE.

Any problems encountered are most likely to be due to copying the extra dragster files into the incorrect folder in the published CourseLab course.
(Note – the dragster activity will not work when using the View module preview in rthe CourseLab authoring system unless you also copy these extra dragster activity files into the folder called 1 inside the folder used to save the course during its development)

There is an alternative simpler integration method that uses Insert > Object > External and the Iframe option. This requires that the dragster activity already be available on the Internet and also that it scales with the browser size (a setting only available in Dragster 3). This approach doesn’t require you to copy the extra activity files as the working dragster activity is being imported “live” from the web using the iframe rather than running inside the courselab course.

View an example created using these 2 approaches

Note - CourseLab itself incorporates drag and drop functionality which allows simple drag and drop activities to be authored within courses without using Dragster. However in Webducate’s opinion creating an activity as rich as an average Dragster drag and drop activity within CourseLab would be extremely difficult  if not impossible (but feel free to give it a go!).