Multimedia Tutorial for Blackboard using E-book technology

1. Multimedia Tutorial for Blackboard using E-book technology SirishBathina William Hinderman Monica Czarny

2. Goals • Create an accessible set of video tutorials for the Blackboard Learning system implementing a custom video framework built upon HTML5's <video> and <audio> tags • Implement a timed text format • Implement a audio description track, putting audio cues in spotsto pause main video • Build the media player framework with buttons to toggle CC and AD display • Hadi identified a previous resource from Blackboard • Liam Moran - ATLAS Group has made accessible video demo (Flash encoded) • http://media01.atlas.uiuc.edu/atlas/test/CWV.html • Structure to define the elements of the multimedia file to be sent to player • The project needs to be extensible

3. Demonstration

4. Key technologies • Gabby and Hadi create the video script to cover Login, myCourse, Homepage • Sirish worked with them to create the video using Camtasia • Bill created the framework for the video player • Buttons Turn on/off audio descriptions - if on, video pauses, plays audio, then un-pauses • Time-elapsed, time-remaining, and jump to certain time (ARIA progress bar or slider) • Access key shortcuts

5. Key technologies • HTML5 <video> tag • Prior to HTML5, there was no standards-based way to embed a video in a web page • Set up a video container, used with attributes

6. Key technologies • Closed captions are a solved problem for HTML5, the jQueryJavascriptlibrary includes a set of functions for handling them pretty easily • Use SRT format to add captions, audio track, and chapters • Each line gets timestamp, additional information extracted from .srt file • SRT files allow project to be customizable and easily edited jquery.srt

7. Further improvements • Added chapters to navigate to topics with additional SRT file • Removed Audio Description chapters to reduce clutter • Attempted ARIA slider for more accessible time display • High contrast mode for visual impairments • Stylized buttons added • ARIA compatible button

8. challenges • Compatibility with different video formats • Issues with having the video pause while having only one audio description play • Solved using Booleans surrounding play functions • Want to attach video sources and text for captioning in a way that is not hard-coded into the web page • Solved using widely used .srt format and jquery • No resources for best practices on audio descriptions • How we solved having to create new audio object each time a new source is extracted from the .srt file for audio description • ARIA slider implementation

9. Discussion on Impact • Accessibility for web video and audio is the need of extending content with functionality that allows people with varying degrees and types of disabilities to access content on the Web • Functionalities implemented in the project are not only usable for disabled people • Audio descriptions useful for those who are multitasking • Subtitles useful for those who are in loud environments or internationalisation • Overall project was an enormous success • Successfully generalized a framework for attaching additional information such as CC, AD, chapters • Able to incorporate all concepts learned into final product • Project is extensible