Successfully reported this slideshow.
Your SlideShare is downloading. ×

Designing & Developing mLearning using HTML5 #mlearncon

Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Upcoming SlideShare
Chris Speed #TSBIOTResearch
Chris Speed #TSBIOTResearch
Loading in …3
×

Check these out next

1 of 169 Ad

Designing & Developing mLearning using HTML5 #mlearncon

Download to read offline

HTML5 is rapidly becoming the program of choice when creating sophisticated eLearning. Although not yet fully defined, the major portions now in use provide increased capability when you understand what they do and how to use them.
Participants in this session will learn what HTML5, and its core technologies, offers your team, when to adopt it in your solutions, and how to take advantage of HTML5 in developing content. You'll learn how you can use Canvas and SVG graphics for animation, graphics, and interactivity, how you can optimize HTML5's new-media formats and deliver them effectively to desktop and mobile devices, and how you can use geolocation in applications and Web courses.

HTML5 is rapidly becoming the program of choice when creating sophisticated eLearning. Although not yet fully defined, the major portions now in use provide increased capability when you understand what they do and how to use them.
Participants in this session will learn what HTML5, and its core technologies, offers your team, when to adopt it in your solutions, and how to take advantage of HTML5 in developing content. You'll learn how you can use Canvas and SVG graphics for animation, graphics, and interactivity, how you can optimize HTML5's new-media formats and deliver them effectively to desktop and mobile devices, and how you can use geolocation in applications and Web courses.

Advertisement
Advertisement

More Related Content

Similar to Designing & Developing mLearning using HTML5 #mlearncon (20)

More from Nick Floro (20)

Advertisement

Recently uploaded (20)

Designing & Developing mLearning using HTML5 #mlearncon

  1. Nick@sealworks.com Twitter.com/NickFloro HTML5 Designing & Developing mLearning Using Playing the mobile game? ibooks html5 hidesign mobilefn Tuesday, June 19, 2012
  2. 1.6 billion Internet users Tuesday, June 19, 2012
  3. 1.5 billion TV’s Tuesday, June 19, 2012
  4. 4.2 billion Mobile Phones Tuesday, June 19, 2012
  5. 3.5 billion Tooth Brushes Tuesday, June 19, 2012
  6. The Web Platform is Accelerating Tuesday, June 19, 2012
  7. Solving Developer Challenges Graphics Location Storage Speed Tuesday, June 19, 2012
  8. What can we do with HTML5 Tuesday, June 19, 2012
  9. Tuesday, June 19, 2012
  10. Tuesday, June 19, 2012
  11. Tuesday, June 19, 2012
  12. Tuesday, June 19, 2012
  13. • form factor • network latency • input mechanism • memory • computational power • battery • context Tuesday, June 19, 2012
  14. Tuesday, June 19, 2012
  15. Tuesday, June 19, 2012
  16. Tuesday, June 19, 2012
  17. The mobile environment single early failure = non-returning user Tuesday, June 19, 2012
  18. The mobile environment crucial first 30-60 seconds usage Tuesday, June 19, 2012
  19. The mobile environment Fewer options Tuesday, June 19, 2012
  20. Tuesday, June 19, 2012
  21. App Tuesday, June 19, 2012
  22. The Web Platform Tuesday, June 19, 2012
  23. Web App Tuesday, June 19, 2012
  24. Web App Tuesday, June 19, 2012
  25. Web App HTML Javascript CSS API’s Tuesday, June 19, 2012
  26. Tuesday, June 19, 2012
  27. Tuesday, June 19, 2012
  28. Tuesday, June 19, 2012
  29. Tuesday, June 19, 2012
  30. Pulse for Mobile Tuesday, June 19, 2012
  31. Tuesday, June 19, 2012
  32. Tuesday, June 19, 2012
  33. SEMANTICS DEVICE ACCESS CSS3 MULTIMEDIA CONNECTIVITY PERFORMANCE & 3D, GRAPHICS OFFLINE & STORAGE INTEGRATION & EFFECTS Tuesday, June 19, 2012
  34. HTML5 = JS + CSS3 Tuesday, June 19, 2012
  35. Create once and deliver everywhere... Tuesday, June 19, 2012
  36. Next Generation Mobile Using Webkit Android iOS Windows Phone RIM Blackberry Tuesday, June 19, 2012
  37. Tuesday, June 19, 2012
  38. Tuesday, June 19, 2012
  39. Tuesday, June 19, 2012
  40. Tuesday, June 19, 2012
  41. Which browser’s support HTML 5? Chrome Safari Firefox Opera Tuesday, June 19, 2012
  42. Which browser’s support HTML 5? Chrome Safari Firefox Opera BETA Internet Explorer 9 Tuesday, June 19, 2012
  43. HTML 5 in the works... Tuesday, June 19, 2012
  44. Advanced Core Language Tuesday, June 19, 2012
  45. Tuesday, June 19, 2012
  46. HTML 4 Tuesday, June 19, 2012
  47. HTML 5 - Introduces New Elements Tuesday, June 19, 2012
  48. Improve Web Apps Tuesday, June 19, 2012
  49. Tuesday, June 19, 2012
  50. Tuesday, June 19, 2012
  51. Tuesday, June 19, 2012
  52. Flow chart Compatibility Tuesday, June 19, 2012
  53. Flow chart Replaces: XHTML 1.0 & Dom2html with new API’s Tuesday, June 19, 2012
  54. Improve Handling of Errors Tuesday, June 19, 2012
  55. Tuesday, June 19, 2012
  56. Focus on the Audience Tuesday, June 19, 2012
  57. Google Analytics Tuesday, June 19, 2012
  58. Google Analytics Tuesday, June 19, 2012
  59. Drawing on the Web Flash Tuesday, June 19, 2012
  60. Canvas & SVG Tuesday, June 19, 2012
  61. Tuesday, June 19, 2012
  62. Scalable Vector Graphics | SVG Tuesday, June 19, 2012
  63. Vector Graphics Scale & Look Great! Tuesday, June 19, 2012
  64. Tuesday, June 19, 2012
  65. Demo’s • Mozilla Download Center (FF) • First Person Gifter (FF) • Population Demo (FF) • German Election Atlas (Safari) Tuesday, June 19, 2012
  66. When Canvas or SVG? SVG -> High level Canvas -> Low level • Import/Export • No mouse interaction • Easy UIs • High Animation • Interactive • JS Centric • Medium Animation • More Bookkeeping • Tree of objects • Pixels Tuesday, June 19, 2012
  67. HTML 5 Support canvas / svg £ £ £ £ video geolocation app cache database workers Tuesday, June 19, 2012
  68. Quake II - Browser Only Tuesday, June 19, 2012
  69. Quake II - Browser Only Tuesday, June 19, 2012
  70. Quake II - Browser Only WebGL 3D graphics HTML 5 Canvas HTML 5 Audio HTML 5 Web Sockets HTML 5 Local Storage Tuesday, June 19, 2012
  71. Video Tuesday, June 19, 2012
  72. The Production Process Capture to delivery and beyond Video / Audio Assets Compression Authoring Delivery Tuesday, June 19, 2012
  73. Standards Are Everywhere NTSC/ RedBook FM MPEG-2 PAL AC-3 DV JPEG MPEG- 1/ MPEG- 4 audio Tuesday, June 19, 2012
  74. Tuesday, June 19, 2012
  75. Tuesday, June 19, 2012
  76. Tuesday, June 19, 2012
  77. Video Compression HTML 5 Options Flash H264 | MPEG 4 WebM Ogg Theora H264 Apple | Microsoft Google Adobe Tuesday, June 19, 2012
  78. Guidelines for Compression Tips & Hints • Video – Frame Rate: 15 fps – Data Rate Target 800-1200 kbs • Audio – 16bit / 22khz / Mono / 64 kbs • Delivery – Flash: H264 – HTML5: H264 Tuesday, June 19, 2012
  79. www.longtailvideo.com Tuesday, June 19, 2012
  80. Easy Access to Video Flip $100 to $200 Tuesday, June 19, 2012
  81. Smart Phones Tuesday, June 19, 2012
  82. Tuesday, June 19, 2012
  83. brightcove.com Tuesday, June 19, 2012
  84. HTML 5 Support canvas / svg £ £ £ £ video £ £ £ £ geolocation app cache database workers Tuesday, June 19, 2012
  85. geolocation Tuesday, June 19, 2012
  86. Tuesday, June 19, 2012
  87. Tuesday, June 19, 2012
  88. Tuesday, June 19, 2012
  89. // the geolocation api brings browser based location to your apps Tuesday, June 19, 2012
  90. O C A R T P www.seeknspell.com Tuesday, June 19, 2012
  91. HTML 5 Support canvas / svg £ £ £ £ video £ £ £ £ geolocation £ £ £ iPhone £ app cache database workers Tuesday, June 19, 2012
  92. app cache & database Tuesday, June 19, 2012
  93. Tuesday, June 19, 2012
  94. Tuesday, June 19, 2012
  95. HTML 5 Support canvas / svg £ £ £ £ video £ £ £ £ geolocation £ £ £ iPhone £ app cache £ £ £ £ mobile database £ £ £ £ mobile workers Tuesday, June 19, 2012
  96. Tuesday, June 19, 2012 web workers
  97. HTML 5 More Power Tuesday, June 19, 2012
  98. // web workers defines an API for running background scripts Tuesday, June 19, 2012
  99. Demo’s Bad Primes (FF 3.5) Good Primes (FF 3.5) Motion Tracker (FF) Tuesday, June 19, 2012
  100. HTML 5 Support canvas / svg £ £ £ £ video £ £ £ £ geolocation £ £ £ iPhone £ app cache £ £ £ £ mobile database £ £ £ £ mobile workers £ £ £ £ Tuesday, June 19, 2012
  101. CSS 3 Forms JavaScript Effects/Transitions Tuesday, June 19, 2012
  102. Test for Usability Test on Windows 7, Vista, XP • Internet Explorer 6, 7, 8, 9 • Firefox 3.5, 3.6, 4.0 + • Opera 10 Test on OS X − Safari 4 − Firefox 3.5, 3.6, 4.0 + − Opera 10 Test Mobile − iOS − Android 2.x-4.x − Blackberry, Windows 7 Phone Tuesday, June 19, 2012
  103. How should we Design? Tuesday, June 19, 2012
  104. Focus on the Audience Tuesday, June 19, 2012 1
  105. Content 2 is the key Tuesday, June 19, 2012
  106. Transparent 3 Interface Tuesday, June 19, 2012
  107. Tuesday, June 19, 2012
  108. Tuesday, June 19, 2012
  109. Tuesday, June 19, 2012
  110. Keep it Simple Tuesday, June 19, 2012
  111. Tuesday, June 19, 2012
  112. Design: Keep it Simple Tuesday, June 19, 2012
  113. How do we start? Tuesday, June 19, 2012
  114. Sketches Tuesday, June 19, 2012
  115. Wireframes Tuesday, June 19, 2012
  116. www.balsamiq.com Tuesday, June 19, 2012
  117. Sketchy & iMockUps Tuesday, June 19, 2012
  118. http://www.teehanlax.com/blog/2010/06/14/iphone-gui-psd-v4/ Tuesday, June 19, 2012
  119. www.uistencils.com Tuesday, June 19, 2012
  120. Wireframes Tuesday, June 19, 2012
  121. Design • Focus on audience • Content is key • Transparent interface Tuesday, June 19, 2012
  122. Tuesday, June 19, 2012
  123. Text Tuesday, June 19, 2012
  124. 1. Create Text 2. Make a selection 3. Invert select 4. Save alpha channel Text 5. Deselect 6. Load Alpha Channel 7. Load Color 8. Offset 9. Apply Blur 10. Reposition 11. Save 12. If the copy changed, star over Tuesday, June 19, 2012
  125. Tuesday, June 19, 2012
  126. Tuesday, June 19, 2012
  127. Tuesday, June 19, 2012
  128. Design for Flexibility Tuesday, June 19, 2012
  129. Tuesday, June 19, 2012
  130. Tuesday, June 19, 2012
  131. Tuesday, June 19, 2012
  132. Tuesday, June 19, 2012
  133. Tuesday, June 19, 2012
  134. Tuesday, June 19, 2012
  135. Tuesday, June 19, 2012
  136. Tuesday, June 19, 2012
  137. Tuesday, June 19, 2012
  138. Tuesday, June 19, 2012
  139. Pixels & Aspect Ratio Selecting a Size Android Xoom 1280 x 720 HTC Incredible iPad 800 x 480 1024 x 768 iPhone 4 960 x Droid 854 x 480 iPhone 480 x 320 Tuesday, June 19, 2012
  140. Resources Tuesday, June 19, 2012
  141. html5rocks.com Tuesday, June 19, 2012
  142. lynda.com Tuesday, June 19, 2012
  143. http://www.caniuse.com/ Tuesday, June 19, 2012
  144. Tuesday, June 19, 2012
  145. tumultco.com Tuesday, June 19, 2012
  146. animatable.com Tuesday, June 19, 2012
  147. html5demos.com Tuesday, June 19, 2012
  148. www.sencha.com Tuesday, June 19, 2012
  149. www.css3.info Tuesday, June 19, 2012
  150. www.uxmag.com Tuesday, June 19, 2012
  151. typekit.com Tuesday, June 19, 2012
  152. CSS3 for Web Designers Dan Cederholm | A Book Apart aBookApart.com Tuesday, June 19, 2012
  153. RESPONSIVE WEB DESIGN ETHAN MARCOTTE | A Book Apart aBookApart.com Tuesday, June 19, 2012
  154. HTML5 for Web Designers JEREMY KEITH | A Book Apart aBookApart.com Tuesday, June 19, 2012
  155. Go Play, Experiment, Dream Apple iOS Tuesday, June 19, 2012
  156. Search Flickr.com for iPad UI Tuesday, June 19, 2012
  157. www.smashingmagazine.com Tuesday, June 19, 2012
  158. Tuesday, June 19, 2012
  159. Tuesday, June 19, 2012
  160. Tuesday, June 19, 2012
  161. Tuesday, June 19, 2012
  162. Tuesday, June 19, 2012
  163. Explore Pictures Blog Video Audio Micro-blogging 3D Models ePortfolios Course Management System Multiplayer Environment Tuesday, June 19, 2012
  164. Capture & Analyze Tuesday, June 19, 2012
  165. Using CoverFlow view and Preview of Graphics Tuesday, June 19, 2012
  166. Design Scrapbook: iPhoto | LittleSnapper Tuesday, June 19, 2012
  167. Tuesday, June 19, 2012
  168. Tuesday, June 19, 2012
  169. Thank You Nick Floro sealworks.com nick@sealworks.com twitter.com/NickFloro Download the Presentation at: http://www.slideshare.net/nickfloro Tuesday, June 19, 2012

×