Improved Dragster 3 – Articulate integration

Until recently the only way to embed a Dragster 3 activity in an Articulate presentation was to use the Web Object option (see previous related post). This approach suffers from a couple of drawbacks in that Articulate player elements (e.g. pop-up windows for notes and attachments) would disappear behind the Dragster activity and also the authoring process wasn’t straight forward as you would have to publish the dragster activity on-line and independently of the articulate presentation.  With recent updates to Dragster 3 you can now use the Flash Movie option to embed a Dragster activity which avoid these drawbacks.

The steps involved in embedding a Dragster 3 activity are:

  1. Author your Dragster 3 activity in the usual way (Tip – use the landscape layout option as this fits best into an articulate presentation)
  2. Publish your Dragster 3 activity using the Embed activity zip download option
    Embed activity zip download option
  3. Unzip the downloaded activity files. You will see they consist of a single flash SWF file with a name like dragndrop1023.swf and a similarly named folder which contains the rest of the activity related files.Files in the activity embed zip download folder
  4. In Powerpoint click the Articulate, Insert Flash Movie button. Browse to the SWF file for your published Dragster activity and click Open.
  5. In the Flash Movie settings change the Advance to the next slide option to When user clicks next and Synchronisation option to Movie displays independently of slide. Click OK to finish inserting the Flash movie.Insert flash movie settings
  6. The embedded Dragster activity will be displayed as a blank rectangle which will extend beyond the edges of the powerpoint slide.  Resize this activity by dragging the handles at the sides and corners of this rectangle for a more appropriate fit (Tip – hold down the shift key when resizing to maintain the aspect ratio of the activity).  NB – if you set this slide’s articulate Slide properties to Change view to the No sidebar display option you don’t have to resize the embedded Dragster activity!
  7. Repeat the activity and publishing process described above for each activity you wish to add to the Articulate presentation.
  8. Publish the completed Articulate presentation.
  9. Copy the folders of the dragster activity related files into the root folder of the published Articulate presentation.Adding the activity files folder to a published articulate presentation
  10. Finally view your Articulate presentation (example presentation).

Example activity embedded in an Articulate presentation

Hopefully this new approach will make it even easier to create rich interactive resources using Articulate and Dragster 3!

Other tips

Use the Dragster 3 transparent skin option to seamlessly blend your activity into the articulate presentation.

Articulate custom skins – bespoke development and development training

Articulate logoWebducate is pleased announce the availability of Articulate Presenter custom skin training and bespoke development services.  Articulate Presenter custom skins allow e-learning resources created with the popular Articulate authoring system to be delivered within a customised player.  This player can be designed to include branding and functionality not available within the default Articulate player helping to meet a target audiences’ specific needs and providing a unique learning experience.

Webducate offers two distinct services relating to the creation of Articulate presenter custom skins:

  1. Training - If you are an experienced Flash developer and want to get started creating your own skins, Webdcuate offers intensive hands on training with related Flash source files provided to get you up and running as fast as possible.
  2. Bespoke development - If you would like to use a custom skin but lack the time and/or skills required then Webducate can develop a skin to meet your needs.

If you are interested in either of these two services please see our related page and/or get in touch…

Example Articulate presentation with a custom skin

Embedding Dragster activities in Lectora projects

Lectora is a comprehensive e-learning authoring tool offered by Trivantis. In this post I review the steps used to embed a Dragster activity into a Lectora project.
Go to the Lectora project page you want to add the activity to and select in the menu:

Add > Object > Animation

lectora1

In the Animation Properties panel click the Import button and Choose From file
lectora2
Navigate to and select the dragndrop.swf of your published dragster activity. Click Apply

Now the activity will appear on the page. You will probably want to reposition and resize it to fit into the page content area. (Tip – press the shift key while dragging the resize frame to maintain the proportions of the activity display).

lectora3
Publish the Lectora project

When you have finished publishing, copy the other dragster activity files EXCEPT the index.html file into the folder containing the publishedLectora project (this will usually be two files, dragndrop.xml and the dropzone image file).

View the published Lectora project and you should see a working dragster activity on the page where it was added.

Multiple activities in one Lectora project

If you intend to add more than one Dragster activity to the same Lectora resource there are some additional steps you need to complete.

For each of the published Dragster activities you are using in your lectora project rename the dragndrop.xml file to include a number so that they don’t overwrite each other when copied into the published Lectora project folder. (e.g. dragndrop1.xml dragndrop2.xml dragndrop3.xml etc)

Then for each dragster activity in the lectora project in the related Animation Properties click on the Parameters tab.

Click the Add button.

In the pop-up select flashvars from the list for Name.

In the Value entry add:

XMLfilename=dragndrop1.xml

lectora4

Where the number in the xml filename relates to the appropriate dragster activity xml filename as you amended earlier.

Click OK and Apply

Do this for each of the dragster activities then publish the lectora project.

Copy the files from all of your published dragster activities into the folder of the published lectora project (not the dragster activity index.html files!)

View the project.

Science Learning Hub – a social network for science educators

In the winter of 2009 the Science Learning Centres approached Webducate for assistance in setting up, theming and using an Elgg community. This community called the Science Learning Hub, was created to offer the Science Learning Centres an on-line social network to support its programme of face-to-face courses for science educators in the UK. Following a review of the intended use of this community, Webducate offered advice on the appropriate plugin’s to provide within the system (e.g. blogs, message boards, groups etc) and proposed learning activities designed to promote the development of a sustained community of users.

Working closely with the Science Learning Centres support staff, Webducate then created a theme to apply a standard branded look and feel to the community site that matched the Science Learning Centres own website. Finally Webducate scripted and authored a series of six help movies which provide a narrated overview of the community and walk throughs of key scenarios of use such as “Creating a blog post” and “Uploading and sharing files”.

This SimpleViewer gallery requires Macromedia Flash. Please open this post in your browser or get Macromedia Flash here.
This is a WPSimpleViewerGallery