Case study on conversion of Flash based eLearning content to HTML5

Based in Australia, the client offers eLearning modules for various specialized courses such as Data Sciences, Machine Learning etc. The courses are illustrative in nature and help instructors teach, assess, and certify learners based on command developed by them on key skills.

The client offered courses in Flash modules to promote interactive and personalized learning as well as to present the outcomes of research that were conducted in different domains in an easy-to-understand manner for students. The teaching modules served as instruction aid for teachers and helped them in delivering more intense learning experience.

The challenge was that the teaching material was in legacy Flash file format. As the support for these files is continuously being discontinued by browsers and Flash is being superseded by HTML5, the entire content had to be migrated to HTML5. The Flash-based animated courses were complex in nature. The underlying codes had to be analyzed extensively and various conversion options had to be evaluated to facilitate seamless transition of codes. This would facilitate us to convert interactive swf to HTML5 as per the expectations and specifications of the client.

The project required our flash to HTML5 conversion services to make the learning modules consistent with mobile devices for optimum viewing. All embedded Flash animations had to be transformed into HTML5 animations and the corresponding audio had to complement the animation.

The primary roadblock was the fact that Flash-based web applications could not run on iPad and other handheld devices operating on Android. The conversion of flash-based eLearning content to HTML5 required handling of numerous long drawn complex animations, audio synchronization with animated sequences to enable pausing and playing, and ensuring that modules loaded intuitively at the start of page.

Further, the transition effects of Flash had to be replicated and it was needed to ensure that the animations along with the audio-video were consistent with Internet Explorer 8.

A systematic implementation plan was devised. The process started with exhaustive checking and analyzing of various coding options available for conversion. By leveraging jQuery, HTML5 and CSS3, the eLearning modules were optimized for mobile. Text templates were recreated with CSS styling and HTML tags whereas JavaScript libraries were used for recreating animations. Within the HTML5 app, enhanced images and CSS sprites were used for boosting performance. HTML5 applications were integrated using backend powered by Ruby on Rails.

WinBizSolutionsIndia succeeded in delivering mobile-friendly HTML5 applications within the lowest turnaround time. The transformed mobile-based elearning app enabled the client to cater to a wider teaching community. The applications were found to be more agile and engaging compared to Flash. The client was very happy with our performance and recommended us to his professional acquaintances.