Flash to HTML5 transition

Background

Until recently, Flash multimedia tool was the de facto standard for online video publishing offering infinite opportunities for creativity and interaction. However Flash is now facing various limitations such as accessibility issues in various devices, non-support from major browser vendors and security issues. These are just a few red flags that signal the necessity of migrating existing Flash content to industry-standard HTML5. This was also the main reason why a leading Norwegian publishing house using digital learning materials developed in Flash for a reading series at the primary level needed to make the transition to HTML5.

The scope of work involved analyzing the existing assets, extracting images, audio, and text and using them to create similar interactives in HTML5. Migrations provide the perfect background to come up new ideas and functionalities. Capitalizing on this opportunity, the client also wished to include other functionalities such as overall accessibility and keyboard navigation for drag-and-drop operations. The significant challenge was unavailability of all necessary resources in their existing archive.

diacriTech's approach

diacriTech team through extensive study of existing media assets and core use cases gained in-depth understanding and determined the best approach to implement the transition smoothly and effectively. The combination of HTML, CSS, and JavaScript was used to get the best of structure, style, and interactivity in creating fully functional HTML5 assets. The development of assets was carried out adhering to asset style guidelines, UX principles and Instructional Design principles.

The dynamic nature of JavaScript calls for a well-built unit test plan where runtime errors can be discerned at an early stage. And the same applies for system testing to catch all the additional visual rendering issues that arise between different browsers and devices. As a result, a test strategy that involved a combination of unit testing and system testing was adopted to cover everything ranging from button placement to user journeys, browser behaviors, device orientation etc. The testing was carried out at each stage with testers well versed in Quality Assurance (QA) concepts and a mind towards optimization for a compelling user experience (UX).

The result

Using standard methodologies, we succeeded in delivering the HTML5 digital learning materials following the WCAG 2.0-AA standard, ahead of the stipulated time. The client benefitted from learning materials not only catering to a wider audience on various reading platforms but also with additional features to increase user engagement. Following the work that diacriTech had done, the client provided additional products to be converted to HTML5.

Testimonial

We are very happy with all the work you have done with the boards!

diacriTech's digital engineering team possess in-depth expertise in Flash to HTML5 conversion and have helped several publishers adopt HTML5 in their e-learning projects. To ensure a seamless transition, they bring the right approach and best practices. If you're interested in finding out more, get in touch!