Wednesday, May 17, 2017

xAPI and recording clicks from an employee bulletin

Marketing departments routinely send out online “Employee bulletins” or “Newsletters” via MS Outlook. These information pieces tout upcoming events, highlight company accomplishments, or inform about the next mandatory compliance training (boo). My humble rendition of this Outlook-rendered company newsletter is in figure 1 below.

Fig1. - ABC Company's newsletter as it looks in MS Outlook.

These bulletins or newsletters contain links to other places where interested parties can go for more information. In private, marketing’s often-heard refrain is, “We have no idea how many people read this stuff or visit these links.” xAPI can change that.

How many people click a link?

When a reader clicks a link in the Outlook-rendered “Employee bulletin” what happens? Answer: The link takes them to a place for more information. Let’s say that other place is an HTML5 page on SharePoint or an html page on an internal web server. A diagram of that sequence is in figure 2 below.

Fig2. - Person clicks a link and is taken to a place for more information on that subject

Can xAPI record that click? Yes, but maybe not in the way you think. Think of the html page that the user is taken to. Let’s say it is the simple HTML5 page depicted in figure 3 below. I've removed all the graphics and informative text in order to keep things simple.


Fig3. - Simple HTML5 page

One of the tags that make up this html5 page is the body tag, specifically the open body tag. This tag can be given the javascript onload event.

<body onload="sendStatement()">

This means that when the page loads it executes the function specified from the "onload event." In this case it runs a function called “sendStatement.” Now we equip the sendStatement() function with the necessary code to send a statement to the Learning Record Store (LRS).

Somewhere in the body of the document we add this code:

<script>
function sendStatement(){

var stmt = new ADL.XAPIStatement(
new ADL.XAPIStatement.Agent(('mailto:sally.doe@earthlink.com'), 'Sally Doe'),
new ADL.XAPIStatement.Verb('http://adlnet.gov/expapi/verbs/launched', 'launched'),
new ADL.XAPIStatement.Activity('http://abccompany/company_picnic.html', 'Company Picnic Article')
);

ADL.XAPIWrapper.changeConfig({
'endpoint': 'https://lrs.adlnet.gov/xapi/',
'user': 'xapi-tools',
'password': 'xapi-tools',
});

ADL.XAPIWrapper.sendStatement(stmt);
}
</script>

So what does all this do? Think of this as the bare-bones code necessary to send a statement to an LRS. Let’s take it from the top.

<script>

This tells the browser that what follows is javascript code.

function sendStatement(){

This is the opening line of what is necessary to create a function. In this case we are creating a javascript function called “sendStatement()” that will contain the necessary commands to send an xAPI statement. The opening brace signals where the function’s code begins.

var stmt = new ADL.XAPIStatement(

Here you are creating a new statement and giving it a variable name of stmt.

new ADL.XAPIStatement.Agent(('mailto:sally.doe@earthlink.com'), 'Sally Doe’),

Within that new statement you are creating the actor part of the statement, in this case an individual denoted by her email address and her actual name. Note: Since we are just trying to capture clicks in this case, we are not concerned with an actual name and it might even be better to use something like 'user1@earthlink.com' and 'Earthlink User' rather than an actual name.

new ADL.XAPIStatement.Verb('http://adlnet.gov/expapi/verbs/launched', 'launched’),

This statement identifies the verb. In this case, we will use “launched” as the verb.

new ADL.XAPIStatement.Activity('http://abccompany/company_picnic.html', 'Company Picnic Article') );

This is the last part of our statement where we are defining the object (or activity). In this case the person is accessing information about an upcoming company picnic.

ADL.XAPIWrapper.changeConfig({
'endpoint': 'https://lrs.adlnet.gov/xapi/',
'user': 'xapi-tools',
'password': 'xapi-tools',
});

The next set of lines deal with credentials to access a particular LRS. In this case we want to send our statement to the ADL Public LRS. You will have a different set of credentials for your particular LRS. I use the RISC LRS therefore I have a set of credentials granted to me from the guys at RISC. Whatever credentials you are assigned, they will take the form of what is listed above.

ADL.XAPIWrapper.sendStatement(stmt);
}

This is the command that tells the special file called xapiwrapper.min.js to actually send the statement. The close curly brace signifies the end of the function.

</script>

This signifies the end of the script.

Another important thing is to include the special xapiwrapper.min.js file in at the top of your html file somewhere between the open and close head tag. Here is what the code looks like for my example.

<script src="xapiwrapper.min.js"></script>

Here's how the data looks in the LRS viewer.

The next step could be as simple as dumping the records to Excel and doing a simple "count."

Now marketing can get an idea of how many people are clicking their links.

John Menken is a learning professional excited about the boundless possibilities with xAPI. Email John if you would like to talk more about xAPI and what it could mean for your business.

 

No comments:

Post a Comment