+ All Categories
Transcript
Page 1: Responsive E-Learning Design (RED): E-learning that works everywhere

E-Learning in a multi-device world

Steve Rayson

Page 2: Responsive E-Learning Design (RED): E-learning that works everywhere

How many devices do you use in a typical day?

(Desktop/laptop, smartphones, tablets)

1) One2) Two3) Three4) More than 3

Page 3: Responsive E-Learning Design (RED): E-learning that works everywhere

We live in a multi-device world

Page 4: Responsive E-Learning Design (RED): E-learning that works everywhere

• We live in a multi-device world

Google Survey - http://services.google.com/fh/files/misc/multiscreenworld_final.pdf

Page 5: Responsive E-Learning Design (RED): E-learning that works everywhere

• We live in a multi-device world

Page 6: Responsive E-Learning Design (RED): E-learning that works everywhere

• We live in a multi-device world

Page 7: Responsive E-Learning Design (RED): E-learning that works everywhere

Reality is not desktop v mobile but multi-device delivery

MLearning Solutions – Vendor Hype

Page 8: Responsive E-Learning Design (RED): E-learning that works everywhere

Web moving from mobile design to responsive multi-device

design

Mobile web designResponsive web design

Volume of Google searches

http://en.wikipedia.org/wiki/Responsive_Web_Design

Page 9: Responsive E-Learning Design (RED): E-learning that works everywhere

From multiple versions to a single responsive version

http://www.google.com/culturalinstitute/

Page 10: Responsive E-Learning Design (RED): E-learning that works everywhere

From multiple versions to a single responsive version

www.shell.com

Page 11: Responsive E-Learning Design (RED): E-learning that works everywhere

From multiple versions to a single responsive version

www.bostonglobe.com

Page 12: Responsive E-Learning Design (RED): E-learning that works everywhere

New Scrolling Navigation

Driven by scrolling on phones and tabletsMore elegantMore exploratoryNo navigationBecoming a web norm

Page 13: Responsive E-Learning Design (RED): E-learning that works everywhere

Scrolling Designs

http://www.dangersoffracking.com/ http://titanic.q-music.be/

Page 14: Responsive E-Learning Design (RED): E-learning that works everywhere

Scrolling AdvocatesAmazon. Each product has a single page. The Kindle, the product page was 17,244 pixels long. Amazon clearly does not have a problem with using long pages to sell its best selling product.

Amaze redesigned Volvo site using long single section pages. Whilst not all people scroll all the way down, 46% of users see the majority of the content. In the past, the typical user only saw 18% of the content of the relevant car chapter.

Page 15: Responsive E-Learning Design (RED): E-learning that works everywhere

HTML 5

Page 16: Responsive E-Learning Design (RED): E-learning that works everywhere

HTML5 Interactivity

Page 17: Responsive E-Learning Design (RED): E-learning that works everywhere

Implications for E-Learning

Page 18: Responsive E-Learning Design (RED): E-learning that works everywhere

Do you need to deliver e-learning that only

works on one device?

Page 19: Responsive E-Learning Design (RED): E-learning that works everywhere

Do you need to deliver e-learning that only

works on one device or on

multiple devices?

Page 20: Responsive E-Learning Design (RED): E-learning that works everywhere

Old World Delivering to

Multiple Devices

Publish to or produce:- native iPhone app- native Blackberry app- native Android app- Flash version- HTML version for iPads

Even single source publishing still means different versions to update and track. Can be further complicated with languages.

Page 21: Responsive E-Learning Design (RED): E-learning that works everywhere

New world is responsive e-learning design“One version that works on all devices”

Why publish multiple versions?Why develop a version that works only on one

device?

Page 22: Responsive E-Learning Design (RED): E-learning that works everywhere

One version that respondsnot multiple versions

Fluid design, not fixed screen sizesIs it a dream? Let’s see a demo

Page 23: Responsive E-Learning Design (RED): E-learning that works everywhere

Kineo’s Adapt FrameworkIntelligent Responsiveness

Page 24: Responsive E-Learning Design (RED): E-learning that works everywhere

Intelligent Responsiveness• Simplifies content for smartphone• Extra content for phone only• Changes interaction for smaller screens• Reduces image size or removes for Smartphone

Page 25: Responsive E-Learning Design (RED): E-learning that works everywhere

Kineo’s Adapt Framework

Page 26: Responsive E-Learning Design (RED): E-learning that works everywhere

Rethinking E-Learning Design

Shorter but deeper learner journeysMaking navigation a meaningful part of the journeySearchable and reusable content objectsBuilding content in small blocksRethinking the journey on different devices – different content and content types

Page 27: Responsive E-Learning Design (RED): E-learning that works everywhere

Benefits of Responsive E-Learning

One version works on all devicesOne version to track and maintainDistribute from a single LMSAccessible contentSearchable contentMore cost effectiveAllows sequential screening

Page 28: Responsive E-Learning Design (RED): E-learning that works everywhere
Page 29: Responsive E-Learning Design (RED): E-learning that works everywhere

Common Questions

Offline version – yesIE6 – needs fallback html versionAccess to phone functions – more limitedRole of native apps – performance support, less tracking, updating

Page 30: Responsive E-Learning Design (RED): E-learning that works everywhere

The Future?

Old World

• Mobile authoring & Flash authoring

• Multiple versions

New World

• Responsive authoring

• Single version

Page 31: Responsive E-Learning Design (RED): E-learning that works everywhere

Thank You

Contact us for a demo or to find out more

Steve [email protected]

Page 32: Responsive E-Learning Design (RED): E-learning that works everywhere

Links

http://services.google.com/fh/files/misc/multiscreenworld_final.pdf http://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/

Page 33: Responsive E-Learning Design (RED): E-learning that works everywhere

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

Page 34: Responsive E-Learning Design (RED): E-learning that works everywhere
Page 35: Responsive E-Learning Design (RED): E-learning that works everywhere

Top Related