E-Learning in amulti-device world      Steve Rayson
http://www.worldofsuperheroes.com/wp-content/uploads/2012/04/phones.jpg
Today we will cover:• How we use multiple devices• How have online design technologies  adapted to this?• What does this m...
How many devices do you use in a         typical day?  (Desktop, laptop, smartphones,              tablets)          •   O...
• We live in a multi-device worldGoogle Survey - http://services.google.com/fh/files/misc/multiscreenworld_final.pdf
• We live in a multi-device world
• We live in a multi-device world
MLearning Solutions – Vendor Hype?Reality is not desktop v mobile but       multi-device delivery
Web moving from mobile design to         responsive multi-device designVolume of GooglesearchesMobile web designResponsive...
From multiple versions to a single      responsive version         www.shell.com
From multiple versions to a single responsive version   www.bostonglobe.com
New Scrolling Navigation• Driven by scrolling  on phones and  tablets• More elegant• More exploratory• No navigation• Beco...
Scrolling Example
HTML5 Interactivity
Implications for  eLearning
Old World                    Publish to, or produce: Delivering to                 • native iPhone app                    ...
New world is responsive elearning designOne version that works on all devices regardless of          screen size or Operat...
One version that responds,  not multiple versions Fluid design, not fixed screen sizes  Is it a dream? Let’s see a demo.
Intelligent Responsiveness - ADAPT•   Simplifies content for Smartphone•   Extra content for phone only•   Changes interac...
Rethinking eLearning Design• Shorter but deeper learner journeys• Making navigation a meaningful part of the journey  E.g....
Benefits of       Responsive eLearning•   One version works on all devices•   One version to track and maintain•   Distrib...
The Future• Advances in HTML5 have led to  design innovations that challenge  traditional e-learning design• Though we can...
Common Questions• Offline version• IE6 needs fallback html  version• Access to phone  functions• Role of native apps
Designing for Multiple Devices?•••
Kineo - Global Leaders in eLearning                          •                          •                          •      ...
Thank you and please keep in touch…••••••                 Learning Visions
Linkshttp://services.google.com/fh/files/misc/multiscreenworld_final.pdfhttp://www.amazon.com/Kindle-Paperwhite-Resolution...
HTML5 – Apps Debate http://mashable.com/2012/09/12/web-vs-native-apps/http://www.businessinsider.com/html5-vs-apps-why-the...
Designing and delivering elearning in a multi-device world
Upcoming SlideShare
Loading in …5
×

Designing and delivering elearning in a multi-device world

3,727 views

Published on

Kineo Pacific’s eLearning Solutions Manager Souraya Khoury led a breakout session on Day 1 of AITD 2013 about the new challenges that L&D departments face: What can be achieved with HTML5 and how responsive eLearning design can assist in achieving greater levels of accessibility across multiple devices.

Find out more at www.kineo.com

Published in: Business, Technology, Design
  • Be the first to comment

Designing and delivering elearning in a multi-device world

  1. 1. E-Learning in amulti-device world Steve Rayson
  2. 2. http://www.worldofsuperheroes.com/wp-content/uploads/2012/04/phones.jpg
  3. 3. Today we will cover:• How we use multiple devices• How have online design technologies adapted to this?• What does this mean for elearning?
  4. 4. How many devices do you use in a typical day? (Desktop, laptop, smartphones, tablets) • One • Two • Three • More than 3
  5. 5. • We live in a multi-device worldGoogle Survey - http://services.google.com/fh/files/misc/multiscreenworld_final.pdf
  6. 6. • We live in a multi-device world
  7. 7. • We live in a multi-device world
  8. 8. MLearning Solutions – Vendor Hype?Reality is not desktop v mobile but multi-device delivery
  9. 9. Web moving from mobile design to responsive multi-device designVolume of GooglesearchesMobile web designResponsive web design http://en.wikipedia.org/wiki/Responsive_Web_Design
  10. 10. From multiple versions to a single responsive version www.shell.com
  11. 11. From multiple versions to a single responsive version www.bostonglobe.com
  12. 12. New Scrolling Navigation• Driven by scrolling on phones and tablets• More elegant• More exploratory• No navigation• Becoming a web norm• Well known http://titanic.q-music.be/ scrolling advocates include Amazon,
  13. 13. Scrolling Example
  14. 14. HTML5 Interactivity
  15. 15. Implications for eLearning
  16. 16. Old World Publish to, or produce: Delivering to • native iPhone app • native Blackberry appMultiple Devices • native Android app • Flash version • HTML version for iPads.Even single source publishing still means different versions toupdate and track. Can be further complicated if LMS trackingrequired.
  17. 17. New world is responsive elearning designOne version that works on all devices regardless of screen size or Operating System • Why publish multiple versions? • Why develop a version that works only on one device?
  18. 18. One version that responds, not multiple versions Fluid design, not fixed screen sizes Is it a dream? Let’s see a demo.
  19. 19. Intelligent Responsiveness - ADAPT• Simplifies content for Smartphone• Extra content for phone only• Changes interaction for smaller screens• Reduces image size or removes for Smartphone• Searchable by tags
  20. 20. Rethinking eLearning Design• Shorter but deeper learner journeys• Making navigation a meaningful part of the journey E.g. Titanic• Searchable and reusable content objects or components• Building content in small blocks• Rethinking the journey on different devices – different content and content types
  21. 21. Benefits of Responsive eLearning• One version works on all devices• One version to track and maintain• Distribute from a single LMS• Accessible content• Searchable content• More cost effective• Allows sequential screening
  22. 22. The Future• Advances in HTML5 have led to design innovations that challenge traditional e-learning design• Though we cant be sure what the future holds, multi-device use is here to stay so we must adapt our current design methodologies
  23. 23. Common Questions• Offline version• IE6 needs fallback html version• Access to phone functions• Role of native apps
  24. 24. Designing for Multiple Devices?•••
  25. 25. Kineo - Global Leaders in eLearning • • • • • • •
  26. 26. Thank you and please keep in touch…•••••• Learning Visions
  27. 27. Linkshttp://services.google.com/fh/files/misc/multiscreenworld_final.pdfhttp://www.amazon.com/Kindle-Paperwhite-Resolution-Display-Built- /dp/B007OZNZG0/ref=sr_tr_sr_1?ie=UTF8&qid=1347890370&sr=8- 1&keywords=kindle www.bostonglobe.com http://www.google.com/culturalinstitute/ www.shell.com www.beetle.com http://www.dangersoffracking.com/ http://titanic.q-music.be/
  28. 28. HTML5 – Apps Debate http://mashable.com/2012/09/12/web-vs-native-apps/http://www.businessinsider.com/html5-vs-apps-why-the-debate-matters-and-who-will-win-2012-8#ixzz24yUXunf2 http://learningandskillsgroup.ning.com/events/e-learning-in-a-multi-device-world

×