html5 player for course online system
TRANSCRIPT
COL HTML5 PlayerCACS
COL Players• Online Players
• Flash• Silverlight
• Offline Players• Flash• Silverlight• iPhone/iPad App• Android App
All PlatformsWindows / Mac / Linux / Android / iPad
All PlatformsWindows / Mac / Linux / Android / iPad
HTML5 Player Features
Challenges we met
Challenges• Too many screen sizes to adapt• The screen data is too big• User Interaction
• Two whiteboards, one video, one screen• Desktop devices and touch devices
Study from other Apps
Responsive LayoutAuto suit different screen sizes
Customizable
Keyboard ShortcutsAction Shortcut
Toggle play/pause k or SpacebarGo back 5 seconds Left arrow
Go back 10 seconds j or Ctrl+Left arrowGo forward 5 seconds Right arrowGo forward 10 seconds l or Ctrl+Right Arrow
Restart 0 (not the keypad number)
Go to Full Screen mode fExit Full Screen mode Escape
Increase speed Shift+>Decrease speed Shift+<
Disadvantages of Using HTML5
Disadvantages of Using HTML5
• No local storage
• No support to legacy browsers
• No support iPhone due to Apple’s limitation
The future plan
• HTML5 for desktop (Windows/Mac)
• Support subtitles and closed captions
Demo