Screenshot of the Digital Writer's Reference for Pearson Education. Applicatin shows a photo of a laptop and a notepad with a video play button. A sidebar shows the title of the video.

Pearson’s Digital Writer’s Reference

I designed a series of 125 animated videos and accompanying accessible HTML 5 video player for Pearson for the Pearson’s Digital Writer’s Reference (DWR) project. I designed the interface for the modules and had out instructional designer create the module content. We also created a custom HTML 5 video player that was completely designed to be 508 accessible. I assembled a team of designers and programmers to complete this project and take it from start to finish. Our tasks on this project were:

  • Designing the curriculum, scope and learning objectives of each video
  • Writing the video/ animation scripts
  • Designing the video content with color coded system for each category: writing, research and grammar
  • Casting voice talents for the voice overs
  • Designing the video interface
  • Programming the HTML 5 video with identical Flash fall back player
  • Animating all 125 videos to the script

This project was started with accessibility in mind, each script had a dedicated area for alt texts and image descriptions. The video player was designed to be completely accessible, with shortcuts for mobility impaired users, accessible scrubber and timeline stamps, audio and volume control and audio descriptions for the blind.

Screenshot of DWR Writing video in Pearson accessible HTML 5 video player. Shown here are the yellow shortcut overlays that alert a mobility impaired user of the available keyboard shortcuts.

This project was completed on time and well within Pearson’s original budget. We also made the template for the accessible video player available to all of Pearson’s departments saving several other internal projects on budget costs.

Screenshot of DWR Grammar video in Pearson accessible HTML 5 video player. Each section had its own identifying color and the colors in the video player matched those of the category.