Don’t have an LMS? Need more detailed reports than an LMS could provide? Want to track your course data in both an LMS and an external reporting service? Perhaps you find the xAPI too complex to implement? And/or maybe you need more data than the xAPI can provide?
The web development industry has seen a huge demand for more analytics. Those numbers and reports are used to improve sites, drive more traffic, and push users through goals (eCommerce, time on site, page views, etc).
As detailed analytics and customizable robust reportage becomes more common in the web development world we are seeing more and more demand for detailed data and reports in the eLearning industry. It’s not enough to know that Johnny passed the course; we need to know how many times Johnny viewed slide 3. With that level of detail we can identify what works (and doesn’t) in our courses and make improvements.
In this short blog post (and video), I will give a brief overview of how to use Adobe Captivate’s built-in JavaScript interface to gather data and send it to our data collection service. In this example I will be using Firebase to hold and display the data in real time.
If you are not familiar with Captivate’s JavaScript interface you can learn more about it here (or at my upcoming Learning DevCamp session). Essentially, Adobe has a created an API that standardizes the way we communicate with Captivate. The cool thing about Adobe’s solution is that it fires Events and we can tell our code to keep an ear out for those events. This means that for many Javascript solutions we do not need to add any code into the course itself. We can wait and add it post-publish. This helps to enable us to create solutions that are easily re-usable.
For this demo, I will also be using Firebase. If you follow me on social media or read my blog posts, then you know I love Firebase. While it is really intended to ease and automate mobile development tasks, it also works great for many HTML5 projects. Firebase enables you setup and use a live database with just a few lines of code. It automatically pushes data changes and events to all clients connected to your database. And their free level offers quite a bit of functionality.
I believe you’ll find this example to be pretty cool. It’s fun to watch the events load live into the page. I can think of plenty of uses for this type of solution; live leaderboards, competitions, etc. But this solution does not implement much in the way of analytics or reporting. One way to accomplish robust analytics and reporting is to send all this data to Google Analytics. To learn more about using the Captivate JavaScript interface and Google Analytics check out my Learning DevCamp 2017 session in Salt Lake City on June 7th.
Before you watch the video below about how I built the demo, you should probably play with the demo. Click the button below to launch the Live Results page. Then click button in the upper right to launch the course. As you move through the course observe the results in the main page.
You might want to keep that demo course open and play with it as you watch the video:
https://www.youtube.com/watch?v=z1XyLh256tE
Download the JavaScript here to read along.
James Kingsley has worked in the eLearning Industry for over 15 years. He has won several awards for combining technologies to produce better eLearning. He is an Articulate MVP. James is the Senior Technology Architect for eLearning Brothers and the Co-Founder of ReviewMyElearning.com. You can follow him on Twitter or connect with him on LinkedIn for additional tips and examples.
