際際滷

際際滷Share a Scribd company logo
Taking Accessibility
to the Next Dimension:
Thoughts About
Canvas 3D
@kliehm
HTML WG & HTML Accessibility Task Force.
Accessibility in Canvas 3D
Accessibility in Canvas 3D
http://www.bluishcoder.co.nz/2008/09/javascript-space-invaders-emulator.html
http://flickr.com/photos/tais/2411643409/http://flickr.com/photos/energeticspell/2332820792/
https://bespin.mozillalabs.com
<canvas id="canvas" width="500" height="350">
<img src=/slideshow/accessibility-in-canvas-3d/5651553/"fallback.jpg" width="500"
height="350" alt="Pulp Fiction Minifigs"/>
</canvas>
http://www.flickr.com/photos/minifig/72091618/
 fallback: shadow DOM
 always exposed to AT
 keyboard accessible
 focus ring in canvas
 caret position
http://blog.largeanimal.com/demo/
http://www.youtube.com/watch?v=uofWfXOzX-g
http://code.google.com/apis/o3d/
http://blog.largeanimal.com/
http://flic.kr/p/3XZgXW
 audio cues
 earcons
 sound radar
 tactile feedback
 speech synthesis
 hardware acceleration
http://goo.gl/olWUL
 user generated content
 40% of objects in SL
dont have alt text
 summarize objects
 filter nearby objects
 screen-reader support
Accessibility in Canvas 3D
http://blog.largeanimal.com/demo/
http://www.youtube.com/watch?v=uofWfXOzX-g
http://code.google.com/apis/o3d/
http://www.sci.utah.edu/cibc/software/41-imagevis3d.html
Accessibility in Canvas 3D
Accessibility in Canvas 3D
Bolt-on
accessibility
http://flic.kr/p/8H1Q
Inclusive design
http://flic.kr/p/55Sh6D
http://flic.kr/p/8W93u
Thanks.
twitter: @kliehm
際際滷s: http://slidesha.re/a0QuR2
Contact: http://klie.hm/profile

More Related Content

Accessibility in Canvas 3D

Editor's Notes

  1. Originally people thought canvas was just about painting boring images on a bitmap...
  2. ... or for adding wet floor effects for photos.
  3. Then people started getting creative, for example in this emulator written in JavaScript for the original Space Invaders engine that you can now play in your browser.
  4. The lesson learned: given the tools people will do anything with a canvas!
  5. Like building a rich text editor in canvas: Bespin was published by Mozilla and is now part of the Jetpack code editor.
  6. Therefore it is important that there is fallback content.
  7. Fallback content, aka. the shadow DOM, is always exposed to assistive technologies, unlike other fallback content thats only displayed if the browser doesnt support the element. Shadow DOM elements must be keyboard accessible, and the corresponding part of the bitmap must be highlighted with a focus ring, probably a caret position as well in the case of editable content.
  8. In a 3D context one of the strongest use cases is in games. This is a demo of the 3D jump & run game Infinite Journey created in WebGL that runs in your browser (if you are lucky enough to have the right chipset).
  9. In games the interaction is limited to a small number of objects, mainly player and non-player characters as well as items. They are in control of players or the game vendors and are well defined.
  10. However, the main challenge in games is reaction time. Games for blind people feature several mechanics to support this, like audio cues, earcons (similar to icons), a sound radar to spot enemies and friends, sometimes tactile feedback is used (vibration) to identify objects, and there is speech synthesis for announcing the names of objects. There is a problem with hardware acceleration because it goes directly to the GPU, bypassing the accessibility API.
  11. In 3D social worlds like Second Life the challenges are different.
  12. There is user generated content. A lot of it! About 40% of the objects dont have alternative or descriptive texts, on some islands as high as 85%. To prevent clutter, users get summaries of the number of people and objects present. Also only objects within a 10-20 meter range are announced. Screen-reader support is crucial because users heavily customize their software.
  13. Eelke Folmer did a lot of research on the topic of accessibility in 3D worlds. Also IBM published games for blind and vision impaired people. Id like to encourage you to contact them.
  14. But it doesnt stop at games and social worlds. For example there are medical applications. A CT scan of a hand has about 20-30 MB, a full body scan about 700 MB. I can imagine tools to process this information in the browser.
  15. And of course architects use 3D models, among others.
  16. Therefore my plea would be to reach out to the Khronos Working Group and vice versa.
  17. Because bolt-on accessibility is ugly,
  18. Whereas inclusive, integrated accessibility is beautiful
  19. and good for your health.