5 Tips for creating Portable eLearning Products

If you needed to convert your products to a new LMS tomorrow how prepared are you?

Having just finished working on a large scale conversion project (explaining the absence of posting) I feel that I have learned a lot regarding how we should develop our products to prepare for the future. Sometimes we make decisions to band aid problems, or to try and utilize every last functionality of an LMS, and while this is not always a bad thing, we must keep in mind the consequences they could have if we ever try and use our content in a different system.

For now here are 5 things to think about regarding developing portable eLearning products:

1. Don't use authorware specific to a Learning Management System
   
   There are fantastic Authorware products out there that can help you build courses not tied to any specific LMS, you may think you're saving time by using your LMS's page builder, but you could be trapping your content, and giving yourself unnecessary functionality constraints.
   
   
2. SCORM or other standards
   
   Always build products with a standard in mind. And don't just rely on publish settings, take a read through some resources online or take a small course to get yourself knowledgeable about what it means to create a SCORM package, or to have SCORM reporting.
   
   
3. Always test the import and export functionality
   
   Taking nothing for granted when it comes to this! SCORM packages are quite gentle and every LMS has it's own quirks, just go hang out in a thread 27 pages deep in a moodle forum to find that out. My advice to you, test your LMS export, take that package and try it out using something like Scorm Cloud.
   
   Shopping for a new system? Make sure you test your exported packages with their import functionality so you don't get stuck make small changes to xml files!
   
   
4. CSS!
   
   I like to do a little trick where all my SCORM packages point to two different CSS files, one hosted on my LMS and referenced by packages I import to hold style that brands the courses with the organization. And one in the package with some default styles (for H1 p a br etc.) so that the course would display well on it's own.
   
   This way if the organization needed to complete a system wide branding change, we could achieve this through all products by modifying one file.
   
   Is this completely against the idea of portable packages? maybe, ha! but I can still give share or move this course and have it display just as well with the css file included in the package.
   
   
5. Don't trap your assessments in the Learning Management System
   
   Most Learning Management Systems have Assessment tools, and some of them can build really great Exercises or Exams. However, if you want to be prepared to migrate your content between systems, you are way better off using an application that will publish SCORM based SCO's that are not confined to one LMS.
   

Have you had experience with course conversion? I would love to hear about other development strategies to keep in mind!

"no matter how you came about your knowledge, you should get credit for it."

Bill Gates on Online Education:

http://techcrunch.com/2010/08/06/bill-gates-education/

Computer Science getting the recognition it deserves?

Not so much a direct eLearning story, but related none the less:

http://blogs.edweek.org/edweek/DigitalEducation/2010/07/bill_to_combat_comp_science_cr.html

Load an Articulate Quizmaker Quiz into your Flash Object and Track Score

This is an update to a previous post in which I proposed a way for you to load a quizmaker quiz into your flash project and track the score. I have now worked on a second version of this that works with most browsers, as the original solution was only for IE 7+.

For the HTML part, simply use Articulates published html, and swap the name of the swf it is loading. (you will also need to change the width and height)

In your flash project, for the onLoadComplete of the quiz, you must set all these variables:


function onLoadComplete(mc:MovieClip)
{
mc.vHtmlContainer=_root.vHtmlContainer;
mc.vCaptureRC=_root.vCaptureRC;
mc.vUseFSCommand=_root.vUseFSCommand;
mc.vLMSPresent=_root.vLMSPresent;
mc.vAOSupport=_root.vAOSupport;
mc.vIE=_root.vIE;
mc.vResumeData=_root.vResumeData;
}

Basically these are all the initializing variables sent by the Javascript/HTML to the flash quiz to let it know if it's in an LMS and also what type of Browser is being used.

There is one small code change that I made to api.js, this was to get the solution working in IE6, For some reason the only way I could get scores tracking in my LMS on IE6 was to add an alert box to the DoOnClose function in quiz.js

function DoOnClose()
{
if (!g_bCloseExecuted)
{
if(IE6)
{
alert("");
}
g_bCloseExecuted = true;

if (g_bAOSupport)
{
PostResultsOnUnload()
}
}
}

SCORM Cloud

Fantastic and Free! Site that helps you test any SCORM courses you're working on. Have been using it to debug several issues, and it's been nothing short great to work with.

Check it out: cloud.scorm.com

Apple Infographic

Had this sent to me from onlinedegrees.org, I don't endorse or really have any feelings about their site or business since I am not familiar with it at all, and this is clearly just a means of promotion for them....that being said, I still thought the infographic was worth re posting, with the aforementioned disclaimer.

Using Handwritten Fonts

Notice anything awesome about this post?

I was inspired by Tom's post at his Word of Mouth blog on using Handwritten Fonts to add personality to your e-learning courses. I've been using his free font sets in several flash objects and captivate presentations and getting great feedback, but didn't even think about using handwritten fonts in HTML pages because of the issue of converting and embedding fonts.

Then today I read a fantastic post at Net Tuts which outlined Google's Font API which allows for easy embedding of any of Google's supplied fonts, and sure enough they have this fantastic Handwritten Font called "Reenie Beanie"

Now we can add a touch of hand written fonts to our html without having to worry about creating images of the text, or having the font not show up on the end users system.

Thanks Google!

Apple's thoughts on Flash

Very interesting posting by Apple.

http://www.apple.com/hotnews/thoughts-on-flash/

With the demise of the PC as we know it now looming in the future, we should pay a close eye on where technology is heading. I don’t read this as Flash will not be successful in the long run, but I do believe that Flash will need to respond through their own software releases. All in all we want to follow these things closely so that we can develop for the trend and not find ourselves converting because we chose beta when everyone else chose vhs.

One problem that I face in developing in HTML5 is that a lot of user base I run into in elearning would not have the browser support for that. Given that I field support issues from clients using IE 5.5, it may take some time before I can introduce an HTML5 based course into my development. However, to develop for mobile learning it does seem that HTML5 may have the upper hand based solely on the expanding consumer base of Apple devices.

Hide the Review Quiz button from an Articulate Quizmaker Quiz

Very similar to my earlier post on removing the Finish Button on an Quizmaker Quiz. The Review Quiz button can also be removed by creating our own swf in flash with some small actionscript that we will insert into the first slide/question of the Quiz.

So, in flash create a new fla and on frame one layer one just add the following actionscript:

_root.g_mcFrame.mcReviewQuiz.swapDepths(_root.getNextHighestDepth());
_root.g_mcFrame.mcReviewQuiz.removeMovieClip();

Publish this to a swf, then in quizmaker insert that swf onto your first question or slide, this code will make sure that review quiz button gets removed!

Enjoy!

Get Student Name on Print Results Page in Articulate Quizmaker using SCORM

Seems to be a couple requests for this one, but basically the problem is that by default there is no way to put the Students name on the Print Results page other than selecting the prompt student for name checkbox in quizmaker.

Well no worries, this is actually a simple fix, as long as you're publishing for your SCORM LMS.

Here's the code/solution:

In your quizzes published folder look for quiz_content/report.html

This is the html page that gets loaded.

Now, we need to add this code:

"window.opener.parent.GetStudentName()"

Where do we add it? well that depends on where you want it to show up!

For now just search for:

document.write("<P><H1>" + strTitle + "</H1></P>");

and replace with:

document.write("<P><H1>" + strTitle +"<br>"+window.opener.parent.GetStudentName()+ "</H1></P>");

This will put it just below the header! Test it out, and then try out moving it to different locations or adding formatting!

Hope this helps!

Load an Articulate Quiz into your Flash Project

I recently completed work on a new flash based course. Basically the course is made up of several captivate demos and a final articulate quiz that are all loaded and navigated through a main flash portal / shell. This main swf file loads all the other swfs including that quiz.swf file that Articulate Quizmaker produces.

I also used the SCORM HTML and javascript that Articulate publishes when you choose publish for LMS. In my case I just swapped out the body of the quiz.html and embedded my own swf portal. This way when I load the quiz it will still have access to all the JS it uses when it's by it self right?

well yes and no.

It seems that if the quiz.swf doesn't get the flashvars it needs when it first loads up, it shuts off all tracking calls, boo-urns!

Well the trick here seems to be in the actionscript, this works for IE I have not tested for other browsers:

function onLoadComplete(mc:MovieClip)
{
/*assuming mc is the quiz.swf, initiating these variables will turn on tracking*/
mc.vHtmlContainer=true;
mc.vCaptureRC=false;
mc.vIE=true;
}

Enjoy! and if you have a better way feel free to contact me!

One giant leap for serious games

Can gaming be a serious contender for a form of education?

It seems a pretty big employer is working with a pretty big gaming company to prove so.

Certainly not everything is suited for learning via gaming, but McDonalds is recognizing that their employers need to learn some pretty specific tasks that can be easily replicated within a gaming simulation on a format that their employees will already be familiar with.

I'm amazed this has taken this long to figure out considering Burger Time was released in 1982.

A couple things

1. Couple of comments on an old post about inserting a flash swf into an Articulate quiz to get the student name from SCORM. Given the interest in this technique I am looking into file hosting options to start to actually post sample files as opposed to just the code. So if you have suggestions for (free) file hosting I would love to hear them.

2. A very geekish article on using alternate grading to increase motivation, I think it's fantastic and could be applied without the heavy gaming overtones.


Should be posting regularly again, I'd give you my excuses, but it's my blog I can post if I want to.

Developing your own Captivate Playback Controller

Been working on a course that relies heavily on integrating Captivate demos into a large Flash based course environment. Was getting very frustrated at the limitations of the swf that Captivate exports and started wondering if there was a way to access variables within that swf file to control it's playback.

Sure enough thanks to an article at pipwerks about using Javascript to control captivate, I was then directed to the Captivate Giant Manual, which eventually gave me this list of variables that you can use to control a captivate swf if you load it into your flash movie:

rdcmndPrevious
set to 1 to go previous slide

rdcmndNextSlide
set to 1 to go to next slide

rdcmndPause
set to 1 to pause the project

rdcmndResume
set to 1 to resume showing a paused project

rdcmndRewindAndStop
set to 1 to rewind and stop the project

rdcmndRewindAndPlay
rset to 1 to rewind and play the project

rdcmndGotoFrame
go to a specific frame

rdcmndExit
set to 1 to exit

rdcmndInfo
display the information window

rdinfoFrameCount

total number of swf frames in the project (this is not the number of frames in the main Timeline, but the sum of
all slide frames)

rdinfoSlidesInProject
number of slides in the project (including hidden slides)

rdinfoCurrentFrame
current frame (goes from 1 to rdinfoFrameCount when you play the project)

rdinfoCurrentSlide
slide currently playing (zero based)

rdinfoSlideCount
number of slides in the project (not including hidden slides)

rdIsMainMovie
can be used to identify whether the SWF corresponds to the main Adobe Captivate project

Note: To control the project through the skin file, add the prefix cpSkinLoader_mc to the variables.

Internal or Offline Learner Tracking for Articulate Quizmaker

Based on a discussion at the eGuild, it seems there is a demand to setup Quizmaker for tracking users without using a LMS or any online solution.

The following is the beginning steps into creating your own custom tracking, this will show you how to extract users interactions from Quizmaker, from here you will need to use whatever technology (asp, php etc) to save the information.

I think that this solution is perfect for those who have no other option than to develop their own internal solution, and can not use third party web apps. For those who do not have this restriction, I highly recommend that you use Articulate Online. You can go swimming in JS and Server Side Languages all you want but you're not going to get as complete and detailed reports as Articulate Online can offer you.

Anyways, the solution:

1. Publish a Quiz for a LMS

2. In the main quiz folder remove everything except quiz.html, quiz.swf and the quiz_content folder.

3. Create a new javascript file named tracking.js

4. In that javascript write the following function:

function lms_DoFSCommand(command, args)
{
alert("command" + command);
alert("args" + args);
}


5. In quiz.html add this to the header:

<script LANGUAGE="JavaScript1.2" SRC="tracking.js" TYPE="text/javascript"></script>


You should now get Popups while you use the quiz, this shows you all the quiz interactions. From here you can parse and send this information to a flat file.

Can't set the adlcp:scormtype in Reload Editor

Reload Editor is a fantastic and free SCORM packaging tool. One problem I ran into with it however is that I can't seem to set the resource attribute 'adlcp:scormtype'. Since an undefined adlcp:scormtype will default to asset, my LMS won't show any Navigation!

So for now I have to manually add adlcp:scormtype="sco" to my resource nodes as a solution.

It looks as though this problem was addressed on the development site for Reload (see issue 873054), however the only compiled release is Version 1, so unless you're savvy enough to get the most recent source code and compile it yourself, you're likely to run into this problem as well.

Anyways hope this tidbit reaches someone wondering why their Reload package is not working in their LMS - your poor little adlcp:scormtype might just need setting!

Browser Focus Issue with Quizmaker

Ran into an issue with Quizmaker in which the Quiz essentially removes focus from the browser (in this case IE 7) and makes it so users need to click twice on any link to get it to work - once to set focus back to the web page, and once to select the link.

I must admit, I don't have a lot of experience with setting Browser focus, and the reasons behind it, but I know that having users trying to click the LMS next button and it not working is a major usability issue!

There is two solutions to this problem, the first one is just to re-write quiz.html and do a standard flash object/embed, replacing the Articulate published script. Now, I don't actually know what all that Articulate script is there to handle, so there is another way to handle this problem without removing all the script.

1. Open quiz_content/quiz.js

2. Search for "player.focus();"

3. Delete that line of code, or comment it out.

I have yet to test this on a Quiz that uses LMS tracking, so I have no idea if the focus is important to the communication, but certainly on a simple knowledge check removing this line will fix the usability bug.

Append Webex presentations (FLV)

Problem:

You have several different exported Webex presentations, and now you want to combine them all into one.

Solution:

A Webex export will give you 5 files for a presentation - index.html, presentation.swf, screen.flv, voip.flv and recording.xml.

The presentation.swf is actually just the 'controller', it's the two flv files that make up the actually video and audio content.

Lets say we want to combine 3 different exported presentations into one, here's how we do it:

1. Rename and Copy the flv files from the 2nd and 3rd presentations and put those files into the 1st presentations folder. You should have 6 flv files in there now.

2. Open the recording.xml file.

Look for this code


<video timestamp="1" name="screen.flv" width="1080" height="824" start="0" duration="7076" keyinterval="10"/>


Note: the timestamp and duration numbers are in seconds

All you need to do is cut and paste that line for each additional video you wish to append and edit the name, timestamp and duration fields. it would look something like this:


<video timestamp="1" name="screen1.flv" width="1080" height="824" start="0" duration="7076" keyinterval="10"/><video timestamp="7076" name="screen2.flv" width="1080" height="824" start="0" duration="5000" keyinterval="10"/><video timestamp="12076" name="screen3.flv" width="1080" height="824" start="0" duration="6000" keyinterval="10"/>


Notice how the timestamp value is the length of the previous videos?

Note: To know the duration of each flv you may want to open up the other presentations recording.xml files and make a note of that value.

So that handles the video, now we do the same for the audio! look for:

<video timestamp="1" name="voip.flv" duration="7076" />


Cut and paste that line just like before editing the name, timestamp, duration fields.

Ok almost done,

3. At the top of the xml file look for:

<recording topic="" number="" ... duration="7076">


You want to edit that duration so that it is the new total length of your demo.

Bingo Bango, an appended presentation without any video editing software necessary!

Improving the Quizmaker Matching Drag and Drop question type

Problem:

Articulate's Quizmaker only allows for Right to Left drag drop question types. Meaning the user must drag the rightmost items onto the leftmost. I personally have always felt that users are more comfortable and inclined to go the opposite direction.

Solution:

Unfortunetly there is no magic option in Articulate to solve this for us. So we write our own Actionscript to insert into the question in the form of a SWF file, this SWF file goes into the Quizmaker code and sets things straight.

Directions: (I am not hosting the swf file as of yet so you're gonna need to create it, hopefully I can get it online soon)

1. Create a new SWF 550 by 400 pixels and using Actionscript 2.0

2. The Code: Put this on frame one layer one


ddswitchObjects();

function ddfindObject()
{

var checkObj = this._parent._parent._parent;

for(i in checkObj)
{
trace(i);
if(checkObj[i]._x == 30)
return checkObj[i];
}
return null;
}

function ddswitchObjects()
{
var cur:MovieClip = ddfindObject();
cur.mcScrollContentMask._width = 1000;
cur = cur.mcScrollContent;

for(var i in cur)
{
trace(i + " " + cur[i]._x);
if(cur[i]._x == 16)
{
cur[i]._x = 212;
}
else if(cur[i]._x >= 200)
{
cur[i]._x = 16;
cur[i].startingY = cur[i]._y;
cur[i].onEnterFrame = function()
{
if(this._x == 212){
this._x = 16;
this._y = this.startingY;
}
}
}
}
}



3. Publish your swf!

4. Create a new quiz and a new matching question type.

5. In form view (NOT slide view) select Media -> Flash Movie -> and insert your published swf.

6. Publish Quiz

NOTES:

Obviously there is a flicker problem, meaning when the question loads, first the options are all in their original Quizmaker position before being switched around by our code, this is because of how the Quiz loads the question before the external swf we make, still thinking of a way to fix this...

There is also limitations on the size of the text you can enter for now. My testing and developing has all been done with small words, and the location of the drag items are hardcoded in my code which means to hack the Quizmaker I look specifically for items in certain positions, meaning if the items were longer or bigger than Quizmaker's defaults this code would fail (although I'm working on improving this as well)

That's all, hope someone else uses this, cause i'm putting into a course today!

Understanding a learners motivation and percieved importance of the content in designing course navigation.

A major discussion at the e-learning guild linkedin group has been around hiding a 'next' button with the intention of making the user complete some activity before being allowed to move on. The idea here is that users will be forced into focusing on the material rather than skipping through.

Lots of ideas for this have been brought up such as multiple choice questions, true / false, a timer, drag drop, and so on. Obviously whatever learning exercise that fits the content best will work in getting the user to stop for a second and take in the content. Do we need to do this? My opinion is that this technique should be used when we perceive our target learners motivation for the content to be low.

What situations fit this scenario:

• Internal Training for new company policies.
  
• Courses with no certification, or penalty for incompletion BUT the user is being forced to take.
  
• Online courses with multiple attempts at assessments where a user is more likely to attempt trial and error to get the completion. (I call this the 'Mastermind Learner')
  
• Courses with dry content that fail to engage the user
  

What situations do not fit:

• Courses that the user has willingly enrolled in
  
• Courses with a high cost/penalty to the user
  
• Courses that have been written and developed to engage the user through audio, video, animation, and well written content.
  

Not all courses have exciting topics, not all courses will have users that wanted to take them, and not all courses will be full of multimedia. It is the development teams responsibility understand a learner's motivation and more importantly their "Perceived Importance of the Content", and then implement a navigation strategy that fits the users willingness to absorb the material.