Best Practices To Make Adobe Flash Courses Run Through Latest Browsers

Adobe declared that it would discontinue its support to Flash player from Dec, 2020. In connection to this, no prominent browsers such as Google Chrome, Microsoft Edge, Mozilla Firefox and Safari would support Adobe Flash player. In fact, much earlier to this, content developers have almost stopped using Flash for two primary reasons: the browsers were not fully compatible with the Flash courses; and the eLearning content developers wanted to run their training courses in multi devices – especially in smart phones.

If a Flash course is converted into HTML5, it enables the course to play device-independent so that learning can happen anytime and anywhere. Moreover, compared to Flash, HTML5 based authoring tools are ideal for localizing the content, which involves translation of the elearning course into multiple languages.

But, a new challenge emerged, as the legacy content which was earlier made in Flash, needs to be played in the browsers. HTML5 was identified as the best alternative, which is a potential web technology to enable the Flash courses to run on the new browsers. To play the Flash courses on browsers using HTML5, there is no need to install any additional plugins. As a result, most content developers started converting Flash into HTML5 courses.

To convert Flash to HTML5, there are certain practices we need to follow. As part of Flash to HTML5 conversion services, we need to understand these aspects. Let us look at them in detail.

1. 1. List out the Flash content assets which are to be converted into HTML5.

      You can use an Excel worksheet of ‘Flash Asset Details’ to list out all the Flash assets. As you may have number of Flash courses that need to be converted into HTML5, this sheet gives a clarity about your task. The asset details can be displayed by separating them with multiple columns such as:

      • liasset number;
      • asset title;
      • asset type such as video, animation, storyboard;
      • asset location;
      • availability of source files;
      • mode of conversion; and
      • additional notes, if any.

   2. Analyze the Flash content assets.

      After mapping all the Flash legacy content assets and identifying them, it’s now time to evaluate the assets. By analyzing the legacy content assets, you can understand the feasibility level of conversion. Your objective here is to identify the type of conversion that is needed.
      This analysis will also help you understand the scope of work and the required effort for conversion. You might observe that some assets may need simple and straight forward conversion while some assets may need extra revising effort and some assets may no longer be used as the content could be outdated.

   3. Categorize the conversion tasks.

      The “Flash Asset Details” sheet helps you end up with another ‘Flash conversion tasks’ document, where you can categorize the complete conversion status of the sorted-out Flash assets, such as:

      • Asset A – To Remove
      • Asset B – To Screen record
      • Asset C – To Recreate
      • Asset D – To just update
      • Asset E – To Redesign
      • Asset F – To Republish

   4. Determine the conversion plan.

      In fact, it all depends on the number of Flash assets to be converted into HTML5. If they are just a few of them, you can handle them easily. But, if the list is considerably long, you need a detailed plan for conversion. Begin the plan with identifying the priority of conversion based on the conversion requirements.
      For example, if some assets just need only the ‘republishing’ task, you can wrap them up without any delay, and you can prioritize certain assets based on higher priority from the clients. This activity of determining the conversion plan helps you prepare a schedule with the expected man hours for each task of conversion. At this level, you can also determine what tasks you can handle in-house and what tasks need to be outsourced to a vendor.

   5. The Flash to HTML5 conversion strategy.

      We have already discussed how the assets can be categorized in terms of conversion, such as which assets to be removed, recorded, recreated, redesigned, etc. We will learn more about it now.

      • If the source files of the Flash courses are not available, then you can screen-record the Flash course and save the videos files in MP4 format which is HTML5 compatible. If the Flash course does not have many interactive elements ‘or’ the course is teaching basic and self-explanatory concepts, this method best serves the purpose. Run the course slide by slide or play the video on your computer, and use a screen capturing tool (Ex: Camtasia) to screen-record the content.
      • If the Flash course needs only minor changes including a small amount of additional content and interactive slides and quizzes, then you can re-build the course instead of redesigning it fully. In fact, this approach requires less effort compared to redesigning as there won’t be any involvement of subject matter experts (SMEs) and instructional designers (IDs). A graphic designer can work on it to replicate the Flash content in HTML5 format with the aid of a rapid authoring tool, which supports HTML5 and SCORM.
      • The other option – which is revamping of the whole content – is redesigning, which involves all the developing activities of an eLearning module such as instructional design, content design, adding interactives etc. This approach is taken when the content is outdated, but will have its relevance if presented in an updated way. In this approach, as you create the content from scratch, you need resources from multiple expertise such as SMEs, IDs, graphic designers etc.

   6. Choose an appropriate rapid authoring tool.

      Many popular e Learning authoring tools are available in the market for Flash to HTML5 conversion. Some of the prominent tools include: Adobe Captivate, Articulate Storyline 360 and Lectora Inspire.
      You can choose the authoring tool according to your requirement. If the existing Flash course has a lot of simulations and animation, you can go for Adobe Captivate. Articulate Storyline is known for its ease of use and can make elearning course development process very simple. Its royalty-free images, characters and icons can also be used for different scenarios and case studies. In case, you think of localization of the course, you can opt for Lectora Inspire. Lectora’s interface allows the user to switch from one language to the other easily.

Case Study: Conversion of Legacy Flash courses to HTML5 for an Australian based company

About Our Client:

Our client is the world’s largest provider of commercial explosives and innovative blasting systems to the mining, quarrying, oil and gas and construction markets.

They also deal with the supply of sodium cyanide for gold extraction, and are a specialist providers of ground support services in mining and tunnelling.

Requirements:

Our client required the conversion of legacy Adobe Flash courses to HTML5 in 5 different languages for participants and facilitators. The training program need to be accessed by their employees on their mobile devices such as laptops, smartphones (Android and iPhone), and iPads.

The client requested thorough testing to ensure that the course was seamlessly accessible on multiple devices.

Challenges:

The legacy courses consisted of SWF animations which were very complicated to be replicated in Adobe Captivate.

Our Solutions:

We proposed conversion of the legacy flash course to HTML5 using the authoring tool, Adobe Captivate. As it is not possible to develop SWF reminiscent animations using Adobe Captivate, we have decided to record those animations using the tool ‘Camtasia’ and publish them as a MP4 video, which was later integrated into Adobe Captivate.

Project Delivery:

The project took 4 weeks to deliver 11 courses with a team of 3 developers, 1 QA and a project manager.

Our Services: Rapid eLearning, Translation and Localization, Flash to HTML5 Migration