Essential Toolkit For Successful Migration From Flash To HTML5
Before we discuss the migration from Flash to HTML5, let us share some background information:
The need and the challenge: With every passing decade, the world is getting more technology-savvy. According to a Bloomberg report, an average U.S household today has 5 connected devices and the scenario is not too different with the rest of the world. The drive among people today to own multiple devices is only increasing.
However, courses built using Flash (which used to be a rage not too long ago) are a no-no when it comes to mobile-compatibility. To be able to provide the flexibility to learners to learn “on-the-go” on the device of their choice, it is imperative that you migrate the legacy/Flash/SWF courses to a platform that supports multiple devices.
The solution: HTML5 has become the “go-to” solution when it comes to migration of legacy/Flash/SWF courses on account of its multi-device support and the flexibility that it offers. This platform enables you to run the same course seamlessly on desktops, laptops, tablets, and smartphones. Besides, a majority of the latest browsers are compatible with HTML5.
Seems quite straight-forward, so where is the catch?
Over the last 5 years, we have worked with organizations globally to convert their legacy/Flash/SWF courses to HTML5. We have created nearly 1000 hours of mLearning or mobile learning courses. During the journey, we identified several factors that have helped us craft a successful and effective migration plan for our customers.
I am converting the essence of what we have learned, what works, what does not, what you should watch out for, and so on into an Essential Toolkit for Successful Migration.
I have layered this into 3 steps:
- What you should watch out for (pre-requisites).
- How you should begin the migration plan.
- How to draw up an effective action plan for successful migration.
You can also refer to an infographic on the Flash to HTML5 Essential Toolkit for a Successful Migration at the end of the article.
What Should You Watch Out For To Assess Your Organization’s Readiness To Adopt HTML5?
There are 3 important pre-requisites:
1. Multi-Device Support.
While mobile learning is fetching great results in terms of providing learners with the flexibility of “anytime, anywhere” learning, organizations do need to make sure that the courses they build are compatible with desktops and laptops as well. However, if they use older browser versions, the courses may not run on desktops/laptops. The decision to upgrade the browser version for HTML5 support across all desktops/laptops in the organization could be a tough one on account of the costs involved.
2. Learning Management System Support.
If your Learning Management System is not mobile-friendly, you need to factor for this as well. Today, mobile learning support is offered by most Learning Management System providers (but not all of them do so). Therefore, you need to factor for either upgrading your Learning Management System for mobile learning compatibility or switch to a Learning Management System that offers mobile learning support. Either way, you will have to account for the costs involved and plan to move your existing courses to the new platform.
3. Security Concerns.
The learning delivery patterns today have also undergone a sea change. The learning delivery approaches today factor for the Bring Your Own Device or BYOD aspect, which allows learners to take courses on their own device (tablets/smartphones). In the process, they keep the door open enough for security threats to creep in. Organizations need to be wary of this aspect and have adequate security policies and measures in place before they start implementing these approaches. Here too, the time and cost factors need to be considered.
What Aspects Should You Take Care Of As You Begin The Migration Of Legacy/Flash/SWF Courses To HTML5?
Once you have nailed the pre-requisites, you need to evaluate the next set of options. Particularly relevant are the following three aspects that have a direct bearing on the success of your implementation plan:
1. Identify The Need (Technology Update Vs. Complete Redesign).
You need to be sure as to what your requirement is. Your migration exercise should be based on the need you have identified. Ask yourself if it’s just a technology update that you’re looking at or if you’re going for a complete redesign. A great way to identify this is to look at these aspects:
- Recent courses.
In this case, the requirement would be of mere technology uplift (conversion to HTML5) and you may not have to bother about Instructional and Visual Design enhancements. - Compliance courses.
For compliance courses you may have to factor for Instructional and Visual Design enhancements as part of your migration cycle. - Legacy courses.
With these, you need to go for a complete re-design with Instructional and Visual Design enhancements although you can use the existing content to build upon.
2. Identify What More Do You Want To Achieve As You Craft Your Mobile Learning Strategy.
Providing learners with the flexibility to learn on the device of their choice is just one aspect of it all. There are other aspects that you need to consider too, such as user and learning experience, higher recall and retention, performance gain, and so on.
3. Understand The Pros And Cons.
Meaning, the trade-off between the punch of learning design capability that Flash offers and what HTML5 can offer. You need to be aware of the learning design impact that Flash and HTML5 carry, understand the benefits and limitations of both, ascertain whether what you achieved with Flash is possible with HTML5 or not, account for the difference in the learner experience in specific frames, and so on when you migrate your legacy/Flash/SWF content to HTML5.
How Can You Draw Up An Effective Action Plan For Successful Migration?
You can chalk out an effective migration plan using these steps:
Step 1: Zero-In On The Approach For Migration.
Adaptive or Responsive designs? What’s your requirement? Adaptive designs are a good fit for multi-device custom mobile learning material for desktops, laptops, and tablets. Responsive designs also support these devices but they are a great fit for smartphones as well.
Select the right authoring tool: There are several authoring tools at your disposal today and you need to get your selection of the authoring tool bang on. While you can look at them broadly from the Adaptive vs. Responsive perspective, you can also drill deeper in terms of authoring tools for rapid development (such as Articulate Studio 13, 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.
A lot of thought needs to go in at the pre-planning stage before you hit the floor with your migration exercise. You can consider these aspects to ensure you’re moving in the right direction:
- Ensure readiness of supporting aspects.
Check if your security policy has been updated to ensure that you’re not at risk when embracing approaches like BYOD. Also, check if your Learning Management System and browsers are ready for HTML5. - Prioritize the courses to be converted from Flash to HTML5.
A good way to go about this would be to create a master plan but begin with the migration of a small number of courses. - Validate that all assets and pre-requisites are in place.
Make sure that all your assets are ready so that there is no room for any delay after the pilot phase. This is very important as it can have an impact on the schedule drawn up for the migration process.
Step 3: Pilot And Plan For Sampling To Test User Experience.
Don’t miss out on this one – you’re about to start something afresh so you would want to be sure that you have everything in place.
Make sure that you do a sampling to confirm if the approach that you have taken will indeed fetch you the desired benefits.
Seek feedback from the learners as to whether the migration exercise/change had any impact on their learning experience and check if it fetched the results you were eyeing. Accordingly, take the next steps.
Step 4: You Are Ready For Migration Process – Go For It!
Once you nail the pre-requisites, identify the parameters that will impact your migration process, and create your action plan, you are ready for the migration exercise.
This toolkit has helped us successfully migrate from Flash to HTML5. In the process, we have created significantly better learning experiences (achieving higher engagement, better retention and recall, and higher completion rates). I hope that this toolkit will help you go about your migration exercise effectively and create a positive ROI on your training budget. Do contact me if you have any questions.
