We’re hearing this more and more from our clients: “We’ve always delivered e-learning in Flash, but now our training needs to work on the iPad as well!” It’s become an increasingly common concern for Learning and Development, but the solution is straight forward: HTML5. When Apple’s Steve Jobs declared that the iPad’s operating system wouldn’t support Flash, many developers gulped. But his reasoning is quite clear, and HTML5, along with CSS and JavaScript, has become the way forward for the development of tablet training.
There are a number of things to consider as you move toward HTML5-based e-learning. We’ve come up with a list of questions to guide you.
What development tool will you be using?
There are a number of rapid e-learning tools that are supporting or moving toward supporting HTML5 functionality, including Lectora, Raptivity, Captivate with HTML5 output (not yet released), Articulate Storyline (not yet released) and Flash CS6 with HTML5 output (yep, not yet released). It’s important to research the various HTML5 interactions available with each tool and understand the customizations you may have to make to integrate it into your LMS.
You can also create your content using custom HTML5 to gain the most flexibility.
Which browsers need to be supported?
It’s important to determine which browsers your audience will be using because not all HTML5 functionality is supported in every browser. For instance, if you know that all of your learners will be taking their training using Chrome, Firefox or Safari, you’ll have almost all of the HTML5 interaction options at your fingertips. A more likely reality, however, is that your learners will be accessing the training from many browsers, in which case Flash-like interactions will require the creative use of HTML, CSS, JavaScript and MP4 video.
How can I get Flash-like animation with HTML5?
HTML5 doesn’t offer quite yet the smooth animations that we’ve come to expect from Flash. Two ways that you can achieve better movement are by using JavaScript commands or by importing MP4 videos. We often build a brief mobile-friendly content video, then pause the frame, overlay buttons and ask the learner to make a choice. Once they make a selection, the video restarts, jumping to a specific section based on their choices.
How will the instructional design process change?
Instructional designers need to learn which types of interactions can be created. This depends largely on the tool you are using. It’s helpful to look at HTML5 examples. I personally like some of the interactions designed using Apple’s iBook Author as well as Raptivity’s HTML5 Turbopack. We have also created custom interactions, adding in functionality like the ability to add comments at any point within a module.
What should I do with all of my existing Flash content?
It’s not necessary to convert of all of your existing Flash content. Applications like iSwifter allow app users to view Flash content on an iPad. As for conversions, complex interactions can be converted manually to either a native app or to HTML5. If your existing Flash training has very simple interactions, it can be converted to HTML5 using technologies such as Adobe’s Wallaby or Google’s Swiffy. Just beware that converters like these were designed primarily to convert simple Flash-based banner display ads, so they’re fairly rudimentary.
HTML5 allows us to reach all learners, regardless of device. Once you learn which interactions are supported, it’s fun to think creatively about how to use HTML5 in designing your next course.


{ 0 comments… add one now }