Home :: Insights :: Flash To HTML5 Migration – 7 Tips To Step Up The Learning Experience

Flash To HTML5 Migration – 7 Tips To Step Up The Learning Experience

July 18, 2017 | By - Asha Pandey

SHARE

Flash To HTML5 Migration - 7 Tips To Step Up The Learning Experience - EI Design

7 Tips For Successful Flash To HTML5 Migration

The need and the challenge: The use of mLearning or mobile learning for corporate training has seen a significant increase in adoption in the last 5-6 years globally and if numbers are anything to go by, its usage is only going to increase.

Check this out:

  • Google has confirmed in a report that there are more mobile users now compared to desktop users.
  • Gartner has reported that on average, a mobile user will use more than three personal devices by the end of 2018.
  • Internet usage on mobile devices (per day) has increased from 0.4 hours to 2.8 hours between 2010 and 2015.
  • Tablet sales have seen a sevenfold increase in the last 4 years.
  • According to a report from Ambient Insight, the percentage of learners using mobile devices for learning is 74%.
  • 70% of the people who were surveyed said mobile learning motivated them.

This surge in mobile learning has, however, rendered courses built using Flash useless as they are not compatible with mobile devices. Organizations are realizing the need to provide learners with the flexibility to learn anytime, anywhere and on the device of their choice and Legacy/Flash courses will not serve this purpose.

The solution: With HTML5 coming into the picture, it has now become easier to provide learners with the same course seamlessly on multiple devices (including desktops, laptops, tablets, and smartphones). Not only this, today, most browsers support it.

What Are The Tips You Can Use To Create An Effective Strategy To Migrate Your Legacy/Flash/SWF Courses To HTML5?

At EI, Flash to HTML5 migration is a mature practice (we’ve been doing it for the last 5 years) with over 1000 hours of Flash content migrated to HTML5 already. With technology updates come associated challenges. We’ve faced a few of those ourselves over a period of time and have created a Toolkit to ensure we convert Flash to HTML5 right every single time.

I now share a few tips and best practices that you can use to offset these challenges and go about your Flash to HTML5 migration with a greater impact.

Tip 1 On Pre-Requisites: What You Should Watch Out For

1. Multi-Device Support

While mLearning or mobile learning is certainly gaining momentum, desktops and laptops are not done and dusted yet. You need to deliver courses to learners that are compatible with desktops and laptops as well as mobile devices, so that they can learn on the device of their choice. A key thing to keep in mind here though is the non-compatibility of older browser versions with HTML5. You need to factor for browser upgrade and associated costs as part of your strategy to make your migrated courses desktop/laptop-friendly.

2. Learning Management System Support

You need to check if your LMS is mobile-friendly. While most LMS providers offer mobile learning support today, there are a few who don’t. If your LMS does not support mobile learning, you will have to either upgrade your LMS or start using an LMS that offers mobile-compatibility. In both these cases, there are costs involved and you will have to consider this aspect as you plan to convert Flash to HTML5.

3. Security Concerns

Organizations today are encouraging the BYOD (Bring Your Own Device) concept. While it does offer more flexibility to learners to learn on the device of their choice, it also provides room for security issues. You need to have security measures and policies firmly in place to keep security threats at bay. There are associated costs and efforts that you need to factor for here as well.

Tip 2 On The Essentials: How You Should Begin The Migration Plan

1. Identify The Need (Technology Update Vs. Complete Redesign)

First, you need to have clarity on the scope of your migration requirement. You need to decide whether you want a mere technology update or a complete redesign. You can make a decision on this by considering these two aspects:

  1. Recent courses: Most of your recent courses would already have been created with enhanced Instructional and Visual Design inputs and in such a case, mere technology uplift (conversion to HTML5) will suffice.
  2. Legacy courses: Here, you may require a complete overhaul of your course in terms of Instructional and Visual Design enhancements. The advantage you have here is you would have the content layered already and the enhancements can build upon it quickly.

2. Identify What More You Want To Achieve As You Craft Your mLearning Or Mobile Learning Strategy

Offering learners with the option to learn on the device of their choice notwithstanding, you need to consider other factors such as user and learning experience, higher recall and retention, performance gain, and so on.

3. Understand The Pros And Cons (The Trade-Off Between The Punch Of Learning Design Capability That Flash Offered And What HTML5 Can Offer

To be able to make your Flash to HTML5 migration effective, you need to be aware of the pros and cons of both Flash and HTML5, their benefits and limitations, whether you can recreate the learning impact of your Flash course with HTML5, factor for the difference in the learner experience in specific frames, and so on when you convert Flash to HTML5.

Tip 3 On Planning: Draw Up An Effective Action Plan For Successful Migration

You can chalk out an effective migration plan using these simple steps:

Step 1: Zero-In On The Approach For Migration

Choose between Adaptive and Responsive designs: You can opt for Adaptive designs if you’re looking to create multi-device custom mobile learning material for Desktops, Laptops, and Tablets. With Responsive designs, you get the added advantage of Smartphone support as well.

Select the right authoring tool: Today, there are a number of authoring tools that you can choose from and you need to select one that suits your requirement the most. While they can be looked at broadly from an Adaptive vs. Responsive perspective, you can narrow down your selection further in terms of authoring tools for rapid development (such as Articulate Studio, iSpring, Adapt, and so on) and authoring tools for mobile learning development (such as Adobe CS6 with CreateJS, Adobe Captivate, Trivantis Lectora, Articulate Storyline, and so on).

Step 2: Draw Up A Checklist Of Pre-Requisites

There are a few aspects that you need to be sure of before you get going with your Flash to HTML5 migration. To make sure you are on the right track, you need to take care of these aspects:

  1. Ensure readiness of supporting aspects.
    You need to make sure if your LMS and browsers are compatible with HTML5. You also need to ensure that you have updated your security policy so that you are prepared to mitigate risks associated with approaches like BYOD.
  2. Prioritize the courses to be converted from Flash to HTML5.
    You can create a master plan and start migration of a small number of courses to begin with.
  3. Validate that all assets and pre-requisites are in place.
    Keep your assets ready to avoid delays after the pilot phase. Not paying attention to this can have an impact on the migration timeline.

Step 3:  Pilot And Plan For Sampling To Test User Experience

It’s always better if you do a sampling to get a sense of whether the migration approach that you have taken will indeed fetch you the desired benefits. A good way to do this would be to obtain feedback from learners as to whether they experienced any change or was there a different impact because of the migration exercise/change. Their inputs will give you cues as to whether your strategy is working or otherwise and you can take the next steps accordingly.

Step 4: You Are Ready For Migration Process – Go For It!

EI InfoGraphic-Flash_to_HTML5-Essential Toolkit for a Successful Migration

 

 

How Can You Use This Migration Opportunity To Step Up The Learning Experience?

More than just a technology upgrade, the opportunity of Flash to HTML5 migration opens doors to embrace the current and trending trends and step up your learning strategy.

Here is my list of 7 tips that you can use to step up the learning experience:

  1. Evaluate and enhance the Learnability or learning effectiveness.
    We, at EI offer a unique service that allows you to evaluate and measure the learnability or learning effectiveness of your existing course and recommend a strategy that will help you create a predictive and much higher learning experience.
  2. Use more immersive learning strategies.
    Use learning strategies such as Gamification, Storytorials, scenario-based learning and so on that create more immersive learning experiences.
  3. Pick learning approaches that adapt well to mLearning or mobile learning.
    These include microlearning and social learning and see the impact on learners soar.
  4. Use high impact, rich media formats.
    These include formats like Interactive videos and mobile apps for learning that map better to mLearning or mobile learning.
  5. Evaluate emerging techniques like personalization of learning.
    This may be a good idea for some of your significant programs.
  6. Take this opportunity to look at specific designs that would appeal to your millennial work-force.
  7. Enhance the support of primary training by:
    1. Taking the learners through a “learning path” or “learning journey” based approach.
    2. Introducing Performance Support Tools or PSTs to push the knowledge acquisition to application.

I hope this article provides you with practical insights that you can use to create an effective Flash to HTML5 migration strategy. More specifically, it gives you pointers on how you can use this opportunity to re-evaluate your learning strategy and enrich it through the new, more engaging, and highly immersive approaches. If you have any queries, do contact me at apandey@eidesign.net.

7 Tips to Enhance the Learning Experience During Flash to HTML5 Migration Info Graphic

 

Also Read:


Related Insights