The Open University's Institute of Educational Technology

Multi-media AccessibilityMALT Wiki and services, alpha

Nick Freear, Web DeveloperWendy Porch, Research Fellow

Institute of Educational TechnologyCoffee morning, 9 December 2009

I have a stammer• Ask me to repeat if you miss something.

 • And please ask questions!

stammering.org

Agenda• What problems are we trying to solve?

• Existing research and issues

• How can we solve the existing problems?

• Outline of project proposal

• Key project principles

• Some initial evaluations

• Examples/demonstrations

• Round-up, next steps & discussion

Definitions• Captions

oAlso known as "sub-titles" in UKoText synchronised with video, timed text oPrefer styling to indicate speaker - position, colouroFor deaf/hard of hearing

• Closed captionso"Captioning you have to turn on", broadcast

• TranscriptoText, often without synchronisation

Definitions (2)

• Audio descriptionoDescriptions of the video inserted into spaces in the

audio track i.e. what’s happening on screen?oFor blind/ low vision people oCan get it for some TV programs, videos, DVDs, live

eventsoHard to find for online videos

Context

"Basic web accessibility is a known commodity now... But nearly ten years after specifications first required it,

online captioning still pretty much does not exist." Joe Clark, A List Apart, November 2008.

More context!

( Gratuitous logos )

iTunes U

Doesn’t YouTube do Captions?

Yes, captions and annotations, since August 2008. However:• Only the video owner can upload/ author• No editor• (Not portable/ embeddable)• Captions can not be styled • Not open content

Only approximately 0.5% of YouTube videos are captioned (automated analysis on small corpus of 34 words - more work).

What's the state of play?At the Open University:

• Course media is routinely transcribed (OU/iTunes U 95%)• It is not routinely captioned or audio described.

 W3C Web Content Accessibility Guidelines:

• WCAG 1.0, 1999 - 1.4: Level A - transcript is sufficient.• WCAG 2.0, Dec 2008 - Level A requires captions, not audio

description. Vimler: annotation.Moodle et al:

• No easy way to integrate captions

Some R&D projects are looking at content personalisation in E-Learning

Accessible Multimedia in E-Learning (1)TILE Project: Adaptive Technology Resource Centre, University of

Toronto (http://inclusivelearning.ca)

• Early implementation of content personalisation standards that map user preferences to content served.

• Not held in a learning management system

• Reusable Learning Object Repository for Educators 

• Videos provided with captions and audio descriptions

Accessible Multimedia in E-Learning (2)• EU4ALL Project. UKOU, UNED, Atos Origin, York

University (amongst many others!) • www.eu4all-project.eu•  Content personalisation based on evolved standards

related to user preferences. i.e. I'd prefer the video with the audio descriptions please!

• Process for providing matching developed for dotLRN and Moodle learning environments

• Alternatives for videos in the standards include captions, audio description, sign language interpretations, transcripts

Moodle video with Audio Description

(http://eu4all.open.ac.uk/eu4all/mod/resource/view.php?id=75)

Here & there• OU/ Steven Price/ Disabled Students Services - HTML5

<video> + Javascript captions.

• MIT/ Brandon Muramatsu/ Jim Glass/ SpokenLecturehttp://web.sls.csail.mit.edu/lectures/

• Project Possibility …

Tools for Adding Captions and/or Audio Descriptions

CapScribe: capscribe.snow.utoronto.ca NCAM's Magpie ncam.wgbh.org/webaccess/magpie LiveDescribe: www.livedescribe.com MovCaptioner: www.synchrimedia.com YouTube CC: www.youtubecc.com CaptionTube: captiontube.appspot.com

Accessify's YouTube Caption Creator: accessify.com/tools-and-wizards/... – http://is.gd/1yiVU

DotSub: dotsub.com

How can we address the lack of captions & audio descriptions online?

Multimedia Alternatives

the MALT Wiki Project

Collaborative production of alternative content

Web services

Big Principles

• Accessibility/usability • Data portability/ content as a service/ connections• Quality & learning design *• Open content *• Software as a service• Free (open-source) software • Social production/ co-creation/ crowd-sourcing• Perpetual beta, hacking the Web, agile

Media player evaluation

dotSUB.com - transcribing

Social production• Wikipedia, Geocaching, Open street map, Project

Gutenberg, Librivox, talking newspapers, open source …– What motivates? User scenarios ...

• Preece, Jennifer & Shneiderman, Ben (2009)

"The Reader-to-Leader Framework: Motivating Technology-Mediated Social Participation"

View 'in-situ' - client-side

View 'in-situ' - server-side

Web service - multilayered<a rel=”embed” href=”http://youtube.comb/watch…”>..</a><a rel=”embed” href=”http://youtube.comb/watch…”>..</a>

Moodle, WordPress … module/filterMoodle, WordPress … module/filter

( jquery.oembed.js )( jquery.oembed.js )

oEmbed: YouTube, Slideshare, Flickr...oEmbed: YouTube, Slideshare, Flickr...

……

Player: <object> + HTML + JavascriptPlayer: <object> + HTML + Javascript

A new player – uses oEmbed, HTML/ Javascript

MALT Wiki features• Flowplayer/Javascript-based player, with captions

• Supports YouTube currently

• Meta-data & personalization panel

• Player available in 4 languages

• User Javascript, for YouTube

• oEmbed web service – integrated with:• Moodle, Drupal, WordPress, CodeIgniter / jQuery

• Wordpress – oEmbed native in 2.9 Beta. wp-config 1 line! wp_oembed_add_provider( '#http://(www\.)?youtube.com/watch.*#i’, 'http://maltwiki.org/oembed’, TRUE);

oEmbed + jQuery code

<script …src="http://ajax.googleapis.com/…/jquery.min.js"></script><script …src="http://maltwiki.org/scripts/jquery.oembed.js"></script><script type="text/javascript"> $(document).ready(function() { $("a.embed").oembed().removeAttr("href"); });</script>

<a class="embed" href=“http://youtube.com/watch?v=VesKht_8HCo”>…</a>

<a class="embed" href="http://cohere.open.ac.uk/node.php?nodeid=137…#conn-neighbour">Cohere…</a>

Flickr, Slideshare, Vimeo, Blip…

Flash 'wmode' is harmful

• wmode = 'window' (default) - OK.

<object data="player.swf"> <param name="wmode" value="window" /> ...

• wmode = 'opaque' or 'transparent' – inaccessible.

<param name="wmode" value="opaque" />

• Answer - don't set wmode.

Next Steps• Explore internal/ external funding• Conversations• Work on player + personalisation• Caption/ AD editing/ discovery functions• A workshop ("Scripting Enabled") 

Build a community – please help!  

N.D.Freear@open.ac.uk @nfreear

W.Porch@open.ac.uk @wendyporch

maltwiki.org

We didn't have time for...

YT player modified – user Javascript

Other Accessible Multimedia Fun!Stretch Project (ATRC, University of Toronto)

http://stretch.atrc.utoronto.ca

• Project 'stretched' perceptions of artists & art students to be more inclusive of people with disabilities 

• Participants produced numerous examples of cultural works that include multiple sensory modalities & a gallery of works on the theme of inclusion

• Provided tools to new media artists for adding descriptions, captions & alternative video

Mars Rover Mission VideoAudio Descriptions provide an overview of the onscreen action,

particularly that which is not mentioned in the narrative of the video.

(insert Mars rover example here)

dotSUB.com  "any video any language"

• + Transcription/ translation can be collaborative - Wiki-like• + Captions are portable (W3C TT XML, Subrip SRT)• +  Ajax-based editor or import captions• +  Powerful search, including in RSS• +  Rich meta-data, including caption attribution• +  Creative Commons licenses are encouraged

• -  Uploader must be owner/ permission of owner of video *• -  Connections with eg. YouTube not explicit• -  Captions don't indicate person - TT styling - retrofit?• -  Meta-data not exposed in RSS search or TT - YET• -  No comments, rating, user profile - not "social" YET

Next steps detailRoadmap: no money, no timescale! Testing - <iframe>, screen readers, high contrast... "Complete" the MALT/Flow player - volume, progress bars,

theme, language (research Flow controlbar custom.) Do MALT/YouTube/JS player - matching UI. Personalization demo, Plug-ins: Wordpress, Moodle, Drupal... Audio Description - CapScribe, Java Web Start/JNLP? Captioning – online/ desktop/ import/ export Developer documentation. Translation/ Localization, player - French, Chinese... Wiki features, community building, talk talk...?

Wordle - project  keywords