[opinion suggested] keyboard control for the videoPlayer

Valles, Heidi hvalles at ocad.ca
Thu Aug 4 14:10:45 UTC 2011


Charly and I also chatted in the channel about considering the shortcuts used by the accessible JW Player Controls from Ohio State University: http://wac.osu.edu/examples/jwpc/

Scroll to the player and click the 'help' icon to see the shortcut list:

  *   Alt + Control + P Toggle play and pause
  *   Alt + Control + S Stop
  *   Alt + Control + F Jump forward
  *   Alt + Control + B Jump back
  *   Alt + Control + D Decrease volume
  *   Alt + Control + U Increase volume
  *   Alt + Control + M Toggle sound mute
  *   Alt + Control + A Toggle audio descriptions (if available)
  *   Alt + Control + C Toggle captions (if available)
  *   Alt + Control + R Toggle resizing of player

I imagine some research went into these decisions, likely related to how they play with AT shortcuts. It's interesting they don't follow the conventions Colin mentioned, but I'm not sure why. Might be interesting to ping someone from this team to get some feedback on their choices?

best,
heidi



On 2011-08-03, at 4:03 PM, Colin Clark wrote:

Hey Charly,

Glad to hear you're making such good progress with the Video Player. It's exciting to see it shape up so well!

There are, at very least, a handful of fairly well established keyboard conventions for video. I'd recommend trying to stick with them where you can, and then do a quick competitive evaluation of the keyboard shortcuts in other popular players.

* Spacebar should toggle the Play/Pause button
* Left and right arrow keys typically skip forward and back by a frame,
* Up and down arrow keys typically control the volume.

I don't think, in general, you need to be worried about shortcuts with modifier keys. People who have trouble pressing more than one key at a time will typically use a sticky keys feature built into their operating system to help with that. I think it's largely just a question of usability: the most commonly used controls should be really quick and easy for users to access with the keyboard.

AT users will often have conflicts with most keyboard shortcuts, so you also want to have some kind of redundancy. As a result, you'll still want to make sure that each of the widgets in the Video Player are independently focusable with the Tab key and can be controlled with their usual keys. So the scrubber should still accept focus and be movable with the left and right arrow keys. Same with the volume control.

As a result, you'll have "global" and "local" keyboard shortcuts. Globally, the sorts of shortcuts listed above will be in effect. When the user has focus on a particular control, the arrow keys will be overridden to do their usual thing. You'll probably want to optionally bind these "global" keyboard shortcuts to the page as a whole so they are always available, regardless of which element is focused.

Have you thought about ways you can make your keyboard shortcuts configurable, so that if there are any conflicts, an implementer of the component can re-bind them? We did this with the Reorderer, though in a way that seems inconsistent with the general framework conventions today (the Reorderer was written largely prior to the framework):

https://github.com/fluid-project/infusion/blob/master/src/webapp/components/reorderer/js/Reorderer.js#L538-557

Here are some examples of other player's shortcuts:

You Tube:
http://www.makeuseof.com/tag/comprehensive-guide-youtube-player-keyboard-shortcuts/

FlowPlayer:
*Key UP, ctrl+K: volume up
* Key DOWN, ctrl+J: volume down
* Key RIGHT: jumpseek forward
* Key LEFT: jumpseek backward
* space: toggle play/pause

QuickTime Player:
* Space bar: Play or pause
* Left Arrow: Stop playback and go back one frame
* Right Arrow: Stop playback and go forward one frame
* Option-Left Arrow: Go to the beginning of a movie
* Option-Right Arrow: Go to the end of a movie
* Command (⌘)-Left Arrow: Cycle through rewind speeds
* Command (⌘)-Right Arrow: Cycle through fast forward speeds
* Up Arrow: Turn volume up
* Down Arrow: Turn volume down
* Option-Up Arrow: Turn the volume up to the maximum level
* Option-Down Arrow: Turn the volume down to the minimum level
* Option-Command (⌘)-T: Show closed captioning
* Command (⌘)-R: Show chapters
* Command (⌘)-L: Loop the movie

Hope this helps,

Colin

On 2011-08-01, at 1:41 PM, charly molter wrote:

Hi everybody,
I've did quite a lot of progress recently on the videoPlayer and I'm
currently trying to add some keyboard control to it.
I need your help to try to find the best and more obvious ones with
bearing in mind a notion of accessibility.
So these are the few rules I've imposed:
- Only one key at a time (no Shift+something) that is mainly because
combination of keys can be hard
- No usage of the numeric pad (many laptop haven't got one)
- The keys should be obvious.

Here is what I've fought for the moment :
play/pause : "p"
volume + : "+"
volume - : "-" (these really need to change indeed on a azerty apple
Keyboard they both need shift and I'm sure azerty is not the only
keyboard that need it)
fullscreen on/off: "f"
captions on/off: "c"
video forward: "t" (this has been chosen as it is often next to the "r" key)
video rewind: "r"

for the volume change and video change I thought about using right,
left, up and down + shift for eg but the combination of keys doesn't
seem really accessible to me.
What's your opinion?
I'm open to any kind of suggestion so please don't hesitate

---
Colin Clark
Technical Lead, Fluid Project
http://fluidproject.org

_______________________________________________________
fluid-work mailing list - fluid-work at fluidproject.org
To unsubscribe, change settings or access archives,
see http://lists.idrc.ocad.ca/mailman/listinfo/fluid-work

-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.idrc.ocad.ca/pipermail/fluid-work/attachments/20110804/8464f0db/attachment.html>


More information about the fluid-work mailing list