The Role of Adobe Captivate in Creating HTML5 Friendly eLearning

The Role of Adobe Captivate in Creating HTML5 Friendly eLearning

The downward spiral of Flash began with the advent of mobile devices, introduction of a number of new web browsers, and the rise of HTML’s popularity. ‘Flash’ was the then Adobe’s Flagship product. But Adobe has gracefully faced the sudden changes and came up with updates, new product portfolio that supports HTML5. No one expected that. Adobe quickly aligned to the sudden technological changes and completely updated it’s eLearning authoring tool ‘Captivate’ to develop HTML5 friendly eLearning.

So, here’s how Adobe Captivate is helpful in creating HTML5 output for online courses and converting legacy courses to HTML5.

1. Publish E-learning to HTML5 in Captivate

After completing your eLearning project or online course in Adobe Captivate, you can publish it to multiple formats in a simple way.

You can choose the publish options from the Publish window. If you publish to SWF, i.e. Flash format, your learners can see and access the course on their desktops. If you select publish to HTML5 option, your learners can view the course on iPads and mobile devices. If you publish to both SWF and HTML5, the learners will be able to view the course on desktops, iPads, and mobile devices.

2. Publish eLearning Project as Apps

From Adobe Captivate 8.0.1 and above versions support publishing eLearning courses as mobile applications (Apps). This is possible with PhoneGap. You can publish eLearning courses to PhoneGap without using a separate App packager application. Publishing to Devices (app) menu item is integrated into Captivate.

3. HTML5 Tracker

This feature is very helpful in converting the Flash-based legacy courses to HTML5. Objects in the eLearning courses that are not supported in the HTML5 output get listed in the HTML5 Tracker automatically. If you delete or modify such objects in the courses, the tracker also gets updated.

These area few objects and slides that may not be published in HTML5 output:

  • Text and SWF animations
  • Mouse click animations
  • Slide transitions
  • Slide background if an SWF file is used
  • Audio attached to invisible objects

One exception here is, FLV files that are created using On2VP6 codec only are supported in the HTML5 output.

Object effects: The unsupported effects are marked with an asterisk (*) in the object effects list. The effects marked with double asterisks (**) are rendered differently in HTML5 output compared to an SWF output.

4. Host & Access HTML5 output on web servers for iPad/iPhones

Online courses developed with HTML5 output can be accessed on iPads/iPhones through web browsers. You have to upload the whole HTML5 output folder to a web server root folder and make the URL available to your learners. They can access the URL from their iPads/iPhones and view the course content that plays within the web browser.

Accessing HTML5 output from iPads/iPhones is supported only with iOS version 5 or later. The courses developed with HTML5 output are supported on the following browsers in Apple devices:

  • Internet Explorer 9 or later
  • Safari 5.1 or later
  • Google Chrome 17 or later

Tips to Create eLearning for iPads with Captivate

  • Use the recommended project resolutions (presets) for iPad to get better quality HTML5 output.
  • Avoid overlapping of audio in the eLearning project, if it’s to be used on iPads.
  • It’s better not to have too many overlapping media for videos that have to run on Apple devices.
  • Disable Scalable HTML Content in the Publish dialog box.

Hope the given features and tips are helpful to create HTML5 output for your eLearning projects and in Flash-based legacy courses conversion to HTML5.

Using HTML5 to Make Flash Courses Mobile-compatible