Mars Colony 01: A Journey Into JavaScript and Gamification

Launch the Mission: Mars Colony 01 Project: Play

Adobe Captivate 2019 incorporates a rich variety of accessible features and functions that allow developers to produce effective eLearning courses. However, whether the result of client requirements, or your own professional development goals, you may want to extend Captivate’s capabilities through the use of JavaScript or JQuery.

My interest in using JavaScript and JQuery was twofold. First, I wanted to brush up on my JavaScript skills, as I don’t specialize in JavaScript programming. I use JavaScript when a communication or training solution requires it, and sometimes its just not needed.

Second, I wanted to explore how JavaScript and JQuery worked within Captivate 2019. As I said, you may not need to use JavaScript, as Advanced Actions and Shared Actions within Captivate may get the job done quite nicely. However, there might be situations in the future when using JavaScript could work for me.

This showcase presents “Mission: Mars Colony 01”, a Captivate 2019 project created to explore using JavaScript to create simple Gamification functions. As my objectives were mainly professional development, I kept the style more on the “fun” side. Key feature highlights include a:

  1. Learner selected avatar and name
  2. System assigned performance “Level” based on quiz performance
  3. Timed perceptual speed task that includes automatic scoring

The main focus of the project was a perceptual speed task based on an ability test that measures how quickly a person can scan objects and detect similarities and differences. In this case, the user reads a pair of 6 digit numbers and must determine if they are the same or different. This section of the project required the most coding in order create the functions for the countdown timer, the toggle buttons used in the test and the calculation of test performance.

General Strategy

The general scripting strategy was, to the extent possible, to call all JavaScript and JQuery functions within an Advanced Action created for each slide. Back in the day, this was basically how we set up OpenScript within the Toolbook object hierarchy.

Once the Advanced Action is created and assigned to a slide for the “On Enter” event, the Advanced Action could be easily accessed, along with the JavaScript. This made updating and debugging the JavaScript code easier.

The bulk of the JavaScript was contained in the “my_java_code.js” file and linked to the Captivate “index.html” file via an include, as described by TLC Media Design. The .js file was written with Atom, with debugging accomplished with a combination of the Python Tutor and Developer Tools within Google. Note: I backed up my “index.html” file before altering it.

Avatars, Timers and Quizzes

It is worth noting that the coding for the project was based on the strategy or actual code for a number of Adobe Community contributors.

Selecting Avatars: To setup the avatars, avatar name and performance level, I used a method similar to that recommended by Paul Wilson that involved setting the state of a multi-state smart object based on a variable’s value. However, where Paul Wilson used advanced actions, I used a combination of advanced actions and JavaScript.

Countdown Timers: The script for the timers was based on Greg Stager’s 10-Second Timer 3000, with some modifications. First, since it was used to set a time limit for the perceptual speed task, some of the buttons weren’t needed. However, as I found out, the script for the “Cancel” task was essential for ensuring the timer was reset prior to continuing navigation. Second, in addition to the countdown clock, I included a countdown bar.

The Perceptual Speed Task: My original concept was to use radio buttons for the perceptual speed task, but I couldn’t find a solution. I did find a great article by Steven Warwick where he used JavaScript to create a custom true / false quiz using toggle buttons and this code did the trick. It is worth noting that Quiz slides contain very special objects that Captivate uses to communicate with the LMS. Its best to avoid deleting slides or objects, rather use the onboard options to hide objects or hide them within the screen using formatting or other objects.

Wrapping it Up

All in all I enjoyed creating the Mars Colony 01 project. I certainly brushed up on my JavaScript tools and learned a thing or two about JQuery in the process.

Files for Download

Captivate 2019 .cptx document: Mars Colony 01

JavaScript Code: my_java_code

References

TLCMediaDesign | Using External JavaScript libraries in Adobe Captivate

JavaScript.Info | Debugging in Chrome

Paul Wilson | Adobe Captivate – Allow Learners To Select Their Own Avatar

Greg Stager | Countdown Timer

Steven Warwick – Health Decisions | Building a fully custom quiz in Adobe Captivate using JavaScript

Graphics

BiZkettE1 – Freepik | Arabic Night Landscape 

Vectorpocket – Freepik | Set of Cartoon Spaceman Kid

Vectorpocket – Freepik | Set with Cartoon Astronaut Girl

Vectorpocket – Freepik | Cartoon Spaceman

Vectorpocket – Freepik | Spaceman Family with Space Ship

Vectorpouch – Freepik | Cartoon Solar System

NASA- JPL Caltech – MSSS | Telephoto Vista from Ridge in Mars’ Gale Crater

Sound

Mark DiAngelo | Wind Sound 

The post Mars Colony 01: A Journey Into JavaScript and Gamification appeared first on eLearning.

Adobe Captivate 2019 Features: PowerPoint in Responsive Mode and Import CSV Format File

In the earlier version of Adobe Captivate 2017, it has supported PowerPoint only in Blank Projects. Whereas in Adobe Captivate 2019 release, the PowerPoint is supported in Responsive Projects also. In this blog we will discuss the advancement of PowerPoint supporting in responsive mode and Importing of different types of quiz questions using CSV excel…

6 Key Benefits Of Mobile Learning

The right and successful implementation of mobile learning provides several benefits to organizations. In this article, I am covering 6 key benefits of mobile learning that I think organizations can see as quick wins.

The Key Benefits Of Mobile Learning You Should Know About

With mobile phones becoming more pervasive, it is no surprise that they are the most preferred way we consume content today. According to Ericsson’s forecast, 80% of the world’s population (6.4 billion people) are smartphone users. Given this trend, it is a natural progression for mobile phones to be extensively used for training, as well, in the future. Organizations are lapping up the key benefits of mobile learning, as well as the opportunity it offers.

In my article “Take Your Mobile Learning To The Next Level With Creative Design Strategies“, we explored the various creative design strategies to implement mobile learning. To make mobile learning more impactful, we use a responsive custom framework, authoring tools, and creative design strategies to align required assets (text, pictures, animations, and the interactions).

The Success Of Mobile Learning

Either we talk about Performance Support or collaborative eLearning environment, mobile learning is best suited for it. Why are learners more motivated and engaged in mobile learning courses?

Here are a few benefits of mobile learning:

1. Learn Anywhere, Anytime Leading To Better Course Completion Rates

Mobile learning allows for flexibility by eliminating the need for learning to happen at a particular time and place. Mobile learning takes learning flexibility to another level by making instructional content like videos, podcasts, and other multimedia formats available on smartphones and devices. Learners have an added advantage of accessing the content wherever and whenever they want. Mobile learning seamlessly integrates learning into the daily routine of the learner, which results in successful course completion and retention of knowledge.

2. Bite-Sized Delivery Leading To Faster Learning

The shift towards microlearning and creating learning that can be digested in bite-sized “chunks” has been heavily influenced by the adoption of mobiles as a mode of learning. Since the real estate is small, the content presented is crisp and concise. Information is more readily accessible when needed for on-the-job training. This helps in avoiding cognitive overload and increases learning.

3. Improves Knowledge Retention And Information Recall

Mobile learning leads to improved knowledge retention thanks to the fact that learners are more likely to remember crisp and concise data at the moment of need, which they find relevant and relatable. Thus, they will be able to recall information while at work and perform their job to the best of their ability, given that they have committed the subject matter to their long-term memory.

4. Personalization Leading To A Higher Rate Of Engagement

One of the widely known advantages of mobile learning is personalization. The tailor-made courses promote a higher rate of engagement and motivation for learners. Moreover, the fact that mobile learning is accessible at any time, any place helps learners stay on track with training.

5. Availability

When you adopt mobile learning in a digital training strategy, there is a unique advantage of 24×7 availability. Whenever an employee is about to perform a task, for example, or give a sales pitch about a recent product, they can quickly take out their phone and launch a short course that helps them brush up their key concepts. Such a just-in-time Performance Support lays a strong foundation for the employees.

6. Responsive Design Leading To Easy Adoption And Future Proofing The Content

We’ve all experienced how certain websites that look great on our PCs do not come across well on our smartphones. And same would be true for mobile learning if it weren’t for responsive design. Responsive design enables the interface to adapt to multiple device sizes, whether it’s desktop, laptop, smartphone, or tablet. Responsive design goes hand-in-hand with mobile learning. This shift has helped to “future-proof” the content and design, as mobile technology advances.

We have implemented several mobile courses taking advantage of the technologies and frameworks that are now available, such as HTML5. Let’s next have a look at a case study:

Coffee Manufacturer In Asia

This responsive microlearning course was developed using a custom HTML5 framework to help the employees in coffee manufacturer to understand the various aspects of production cost and other costs involved in coffee making. The course begins with a unique activity wherein the learner needs to select the financial advice of a manager. Upon selecting the financial advice, the learner needs to solve the issue and proceed. This was one of the unique activities which were created on a mobile platform. The sample screenshot of the course is given below:

6 Key Benefits Of Mobile Learning

Conclusion

Mobile learning is here to stay, and its benefits are proof that organizations will look for greater implementation of the same.

The post 6 Key Benefits Of Mobile Learning appeared first on eLearning.

6 Key Benefits Of Mobile Learning

The right and successful implementation of mobile learning provides several benefits to organizations. In this article, I am covering 6 key benefits of mobile learning that I think organizations can see as quick wins.

The Key Benefits Of Mobile Learning You Should Know About

With mobile phones becoming more pervasive, it is no surprise that they are the most preferred way we consume content today. According to Ericsson’s forecast, 80% of the world’s population (6.4 billion people) are smartphone users. Given this trend, it is a natural progression for mobile phones to be extensively used for training, as well, in the future. Organizations are lapping up the key benefits of mobile learning, as well as the opportunity it offers.

In my article “Take Your Mobile Learning To The Next Level With Creative Design Strategies“, we explored the various creative design strategies to implement mobile learning. To make mobile learning more impactful, we use a responsive custom framework, authoring tools, and creative design strategies to align required assets (text, pictures, animations, and the interactions).

The Success Of Mobile Learning

Either we talk about Performance Support or collaborative eLearning environment, mobile learning is best suited for it. Why are learners more motivated and engaged in mobile learning courses?

Here are a few benefits of mobile learning:

1. Learn Anywhere, Anytime Leading To Better Course Completion Rates

Mobile learning allows for flexibility by eliminating the need for learning to happen at a particular time and place. Mobile learning takes learning flexibility to another level by making instructional content like videos, podcasts, and other multimedia formats available on smartphones and devices. Learners have an added advantage of accessing the content wherever and whenever they want. Mobile learning seamlessly integrates learning into the daily routine of the learner, which results in successful course completion and retention of knowledge.

2. Bite-Sized Delivery Leading To Faster Learning

The shift towards microlearning and creating learning that can be digested in bite-sized “chunks” has been heavily influenced by the adoption of mobiles as a mode of learning. Since the real estate is small, the content presented is crisp and concise. Information is more readily accessible when needed for on-the-job training. This helps in avoiding cognitive overload and increases learning.

3. Improves Knowledge Retention And Information Recall

Mobile learning leads to improved knowledge retention thanks to the fact that learners are more likely to remember crisp and concise data at the moment of need, which they find relevant and relatable. Thus, they will be able to recall information while at work and perform their job to the best of their ability, given that they have committed the subject matter to their long-term memory.

4. Personalization Leading To A Higher Rate Of Engagement

One of the widely known advantages of mobile learning is personalization. The tailor-made courses promote a higher rate of engagement and motivation for learners. Moreover, the fact that mobile learning is accessible at any time, any place helps learners stay on track with training.

5. Availability

When you adopt mobile learning in a digital training strategy, there is a unique advantage of 24×7 availability. Whenever an employee is about to perform a task, for example, or give a sales pitch about a recent product, they can quickly take out their phone and launch a short course that helps them brush up their key concepts. Such a just-in-time Performance Support lays a strong foundation for the employees.

6. Responsive Design Leading To Easy Adoption And Future Proofing The Content

We’ve all experienced how certain websites that look great on our PCs do not come across well on our smartphones. And same would be true for mobile learning if it weren’t for responsive design. Responsive design enables the interface to adapt to multiple device sizes, whether it’s desktop, laptop, smartphone, or tablet. Responsive design goes hand-in-hand with mobile learning. This shift has helped to “future-proof” the content and design, as mobile technology advances.

We have implemented several mobile courses taking advantage of the technologies and frameworks that are now available, such as HTML5. Let’s next have a look at a case study:

Coffee Manufacturer In Asia

This responsive microlearning course was developed using a custom HTML5 framework to help the employees in coffee manufacturer to understand the various aspects of production cost and other costs involved in coffee making. The course begins with a unique activity wherein the learner needs to select the financial advice of a manager. Upon selecting the financial advice, the learner needs to solve the issue and proceed. This was one of the unique activities which were created on a mobile platform. The sample screenshot of the course is given below:

6 Key Benefits Of Mobile Learning

Conclusion

Mobile learning is here to stay, and its benefits are proof that organizations will look for greater implementation of the same.

The post 6 Key Benefits Of Mobile Learning appeared first on eLearning.

How to bring or use an external javascript library into captivate 2019

  1. I am trying to use the javascript library 3djs.

I created a map using html and the javascript 3djs library, but  when I bring it into captivate as a web object

it does not work. I try many different way to see if the map show up but nothing seems to work.

I know that Jquery and Bootstrap are integrated into captivate.

How to integrate the 3djs into captivate?

The post How to bring or use an external javascript library into captivate 2019 appeared first on eLearning.

Case Study – Conversion of Flash Courses to HTML5 using Articulate Storyline

In the recent times, the learning needs are changed and the technology has increased at its pace. This has transformed the traditional classroom training into e-learning. The courses that were developed in Adobe Flash or tools whose output is in SWF are now not compatible with the modern devices. Thus there is a need of…

A Financial Literacy Program Created with Captivate 2019

This showcase presents a module taken from a larger Financial Literacy program created for a client. The module was originally created in PowerPoint as a backdrop for a recorded video that would delivered as a self study course via the web.

All content has been “sanitized” but the general structure is similar. Specifically, each module was presented as a series of lessons with the first being an overview, the second exploring myths and the final consisting of a series of case studies.  An assessment lesson, along with checkpoint questions, was added in the Captivate 2019 version.

Click on one of the links below to view a lesson.

Lesson 01: Overview

Play

Click the Blue Arrow

Lesson 02: Myths

Play

Click the Blue Arrow

Lesson 03: Case Studies

Play

Click the Blue Arrow

Lesson 04: Assessment

Play

Click the Blue Arrow

Instead of converting the PowerPoint file, I recreated each lesson in Captivate 2017, and then converted to 2019 when it was available. I was able to duplicate most of the original functionality of the PowerPoint slides, although some of the animations are not the same as PowerPoint has a few more on-board animation options.

Graphics

Mimi Thian – Unsplash | Two Women Working

Stevepb | Financial Planning Picture

Aleksandr1982 | Couple

Stefan Stefancik  | Group Working Over Computer

Rawpixel – Unsplash | Aerial View of Laptop White Background

Ethan Robertson – Unsplash | Vintage Movie Camera

fernandozhiminaicela – Pixabay | Download Cube

The post A Financial Literacy Program Created with Captivate 2019 appeared first on eLearning.

Articulate Rise – Custom Fonts and Track Using Storyline Block

Here comes two cool features in Articulate Rise – Track completion with a Storyline Block and Custom fonts. Track completion with a Storyline Block: Usually you can track your course in LMS with quizzes, triggers and the number of slides viewed, but now you can track your completion of course with a storyline block. (The…

Adobe Captivate 2019: Convert Simple Videos Into Interactive Videos With Overlay Slides Feature

Adobe Captivate has made their upgradation move by releasing Captivate 2019 with all the new features. Overlay slides feature is an effective way to convert videos into interactive content. The traditional video might convey the right information, but doesn’t evaluate the learner performance. But, with this interactive video feature you can gauze the user understanding…

Don’t Miss Adobe Learning Summit 2018

Once again I will be speaking at the Adobe Learning Summit in Las Vegas, Nevada. This year’s conference is unique over past events in that the Learning Summit is no longer tied to another conference. Adobe has decided to take the training wheels off and go it alone. This gives Adobe the freedom to do what they have wanted to do for some time and offer the conference to attendees for absolutely free. The conference itself is from 8 AM until 5:15 PM on October 4th at the Hard Rock Hotel. Not only is registration free, but Adobe will be providing you breakfast, lunch, and even a post-conference cocktail reception as well.

Image of attendees enjoying their free lunch

In addition to the conference, Adobe is also running sessions of the Adobe Captivate Specialist Certification program on the day before (October 3rd). The specialist program is ideal for learning and development professionals who are just getting started designing and developing eLearning. It’s going to be a full day so don’t party in Vegas too much the night before. You are required to bring your own laptop with Adobe Captivate 2019 installed. You can get the trial edition here is you don’t already have it. After the days worth of hands-on training, there will be an online test that you must successfully complete in order to receive your Adobe Captivate Specialist certificate and badge the following day at the conference.

Attendees in great eLearning sessions

I will be one of the course facilitators for the Adobe Captivate Specialist Certification so if you’ve wanted a face to face session where I teach you Adobe Captivate this is it. Remember you must register and there is a cost for this pre-conference activity so make sure you follow the link I’ve included at the bottom of this article.

On the day of the conference I will be conducting a session in the afternoon at 2:30 PM. My session is called C102: Create your first responsive eLearning course with Adobe Captivate and it’s not to be missed. Especially if you want to get a jump start over your peers when it comes to responsive design. Now I know what some of you might be saying; “Yeah but Paul, less than 5 per cent of learners are accessing eLearning on mobile devices.”

A variety of devices with different screen sizes

This is true for right now, and I suspect that this is also partly due to our LMSs only being set up on closed networks. But I’ve begun to notice that more and more of the mobile workforce are using devices other than laptops and computers. The person who fixed my washing machine earlier this year searched for and ordered parts, wrote up an invoice, and completed the payment using an iPad with cellular connectivity. This same employee doesn’t want to come all the way back to the office to complete their mandatory compliance training. They want to do it at home or during a break at the coffee shop. I predict that within five years if you and I are not designing responsive design eLearning we will be losing jobs to our peers. Come to my session if you want to learn how to design for any screen out there.

Of course, I plan on attending many of the other sessions besides my own. You all know me from my YouTube videos, I would love to meet as many of you as I can. If there is a way that we can collaborate on an eLearning project or if you need me to provide you with some one-on-one training over and above what I will be providing at the conference, make sure we connect. I really enjoy meeting all of you at these live events. Many of my best clients started out as viewers of my YouTube channel.

Don’t forget to register. While the conference is free, you still need to reserve your spot. A cool feature of this years conference website is you can add each session to your own schedule and download it into your calendar when you’re done. I’ve already planned out all the sessions I will be attending. Also, don’t forget the Adobe Captivate Specialists Certification on the day before. You can purchase and register for that using the same site as well.

ADOBE LEARNING SUMMIT

The post Don’t Miss Adobe Learning Summit 2018 appeared first on eLearning.