Mobile Learning User Experience (UX) Design!Creating a Mobile CourseCompanion with WordPress!Paul D. Hibbitts"Hibbitts Des...
A Little About Me!!  Established Hibbitts Design in 1998!!  100+ successful software UX projects, with   clients such as A...
Better experiences,!  better learning"
Topics for Today!!  Mobile Learning Headspace!!  Usability and User Experience!!  My Design Approach and Tools!!  Mobile C...
Mobile Learning Poll!
Mobile Learning Headspace!http://www.flickr.com/photos/realtingley/4467469704/
Mobile Web Usage Projections!http://www.mobify.com/blog/mobile-performance-benchmarks
Defining Mobile Learning!“The ability to learn independently of place andtime, facilitated by a range of mobile devices.”!U...
Forms of Mobile Learning!"  Assessments!     –  Tests, surveys, polls!"  Learning games!     –  Challenges and simulations...
Five Moments of"              Learning Needs!1.  When learning for the first time!              Formal"2.  When wanting to ...
Mobile Learning and"         Formal Learning!!  Mobile’s strength is not in formal learning!!  Informal learning of a “jus...
User Experience!http://www.flickr.com/photos/rekha6/326405841/
Usability – How it Works!!  Learnability (first time users) !!  Efficiency (experienced users)!!  Memorability (casual users...
User Experience (UX) –"      How it Works and Feels!!  Subjective in nature, but still measurable!!  Often changes over ti...
Aspects of User Experience!http://semanticstudios.com/publications/semantics/000029.php
The Role of User Experience          with Mobile Learning!http://www.gliffy.com/go/publish/3363991/
My Design Approach and Tools!http://www.flickr.com/photos/jesshibb/4964851353/
Design Strategies!
Mobile First!http://www.abookapart.com/products/mobile-first
What Exactly is “Mobile”?!http://bradfrostweb.com/blog/web/mobile-first-responsive-web-design/
User-Centered Design!http://www.sapdesignguild.org/resources/ucd_process.asp
More Prototyping,"                         Less Wireframing!http://www.cennydd.co.uk/2012/why-i-dont-wireframe-much/
Instructional Design Principles!http://ged578.pbworks.com/w/page/7309910/Multimodal_Teaching-Learning
Immersion!http://www.uselog.com/2005_10_01_archive.html
Content Parity!   ="
“Frictionless” User Experience!http://www.apple.com/iphone/features/siri.html
Tools of Choice (for now…)!
WordPress!
Why WordPress?!$  Substantial and friendly development community!$  Large amount of documentation available!$  One of the ...
WPtouch Pro!
What about"               Responsive Web Design?!http://www.paulolyslager.com/responsive-design-hype-solution/
Supporting Multiple Devices!!  Responsive web design!!  Device specific design!!  Responsive web design +"   server side co...
Headway Framework!
Mobile Course Companion!
Demo!
Wrap-up!http://www.flickr.com/photos/o2de/5815193403/
Summary!!  Mobile Learning Headspace!!  Usability and User Experience!!  My Design Approach and Tools!!  Mobile Course Com...
Where to Next?!mobilelearningux.com (mobile friendly of course!)!  –  These slides!  –  Suggested books!  –  Articles!  – ...
Thank You! Further Questions?!Contact info!   Web: paulhibbitts.com!   Email: paul@paulhibbitts.com!   Twitter: @hibbittsd...
IT4BC - Mobile Learning User Experience (UX) Design: Creating a Mobile Course Companion with WordPress
IT4BC - Mobile Learning User Experience (UX) Design: Creating a Mobile Course Companion with WordPress
IT4BC - Mobile Learning User Experience (UX) Design: Creating a Mobile Course Companion with WordPress
Upcoming SlideShare
Loading in...5
×

IT4BC - Mobile Learning User Experience (UX) Design: Creating a Mobile Course Companion with WordPress

561

Published on

Explore how to improve mobile learning outcomes with user-centered designer and UX analyst Paul Hibbitts. By sharing his experiences in creating mobile course companions in both academic and corporate contexts, Paul will guide you through the fundamentals of mobile learning, including its potential role with formal learning, and how to use UX design viewpoints and techniques to provide more effective mobile learning. He will also share his preferred tools and techniques to leverage WordPress as an outstanding vehicle to deliver mobile learning, using a case study involving a face-to-face university course he recently taught at Simon Fraser University.

Published in: Design, Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
561
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
9
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

IT4BC - Mobile Learning User Experience (UX) Design: Creating a Mobile Course Companion with WordPress

  1. 1. Mobile Learning User Experience (UX) Design!Creating a Mobile CourseCompanion with WordPress!Paul D. Hibbitts"Hibbitts Design!
  2. 2. A Little About Me!!  Established Hibbitts Design in 1998!!  100+ successful software UX projects, with clients such as Absolute Software, FINCAD," SAP Business Objects, and the University of BC!!  Instructor and course designer for CMPT-363" (UI Design) at Simon Fraser University!!  Usability Mentor, 2009 Season of Usability" (co-sponsored by Google)!!  HFI-Certified Usability Analyst!
  3. 3. Better experiences,! better learning"
  4. 4. Topics for Today!!  Mobile Learning Headspace!!  Usability and User Experience!!  My Design Approach and Tools!!  Mobile Course Companion Demo!
  5. 5. Mobile Learning Poll!
  6. 6. Mobile Learning Headspace!http://www.flickr.com/photos/realtingley/4467469704/
  7. 7. Mobile Web Usage Projections!http://www.mobify.com/blog/mobile-performance-benchmarks
  8. 8. Defining Mobile Learning!“The ability to learn independently of place andtime, facilitated by a range of mobile devices.”!Ufi/learndirect and Kineo, 2007
  9. 9. Forms of Mobile Learning!"  Assessments! –  Tests, surveys, polls!"  Learning games! –  Challenges and simulations!"  Synchronous! –  Virtual classrooms using mobile webinar tools!#  Social media learning! –  Enabling networks for learning!#  Micro-learning! –  Self paced mini lessons in varied media!#  Performance support! –  References, job aids, collaboration, social, augmented reality!As defined by Connie Malamed
  10. 10. Five Moments of" Learning Needs!1.  When learning for the first time! Formal"2.  When wanting to learn more! Learning!3.  When trying to remember" and/or apply! Informal"4.  When things change! Learning!5.  When something goes wrong!!As defined by Bob Mosher and Conrad Gottfredson
  11. 11. Mobile Learning and" Formal Learning!!  Mobile’s strength is not in formal learning!!  Informal learning of a “just-in-time” nature, is a better use of mobile technology!!  Mobile learning is very effective as performance support with (or without) formal learning!
  12. 12. User Experience!http://www.flickr.com/photos/rekha6/326405841/
  13. 13. Usability – How it Works!!  Learnability (first time users) !!  Efficiency (experienced users)!!  Memorability (casual users)!!  Error-resistance (all users)!
  14. 14. User Experience (UX) –" How it Works and Feels!!  Subjective in nature, but still measurable!!  Often changes over time, due to circumstances!!  Will also include aspects of usability!
  15. 15. Aspects of User Experience!http://semanticstudios.com/publications/semantics/000029.php
  16. 16. The Role of User Experience with Mobile Learning!http://www.gliffy.com/go/publish/3363991/
  17. 17. My Design Approach and Tools!http://www.flickr.com/photos/jesshibb/4964851353/
  18. 18. Design Strategies!
  19. 19. Mobile First!http://www.abookapart.com/products/mobile-first
  20. 20. What Exactly is “Mobile”?!http://bradfrostweb.com/blog/web/mobile-first-responsive-web-design/
  21. 21. User-Centered Design!http://www.sapdesignguild.org/resources/ucd_process.asp
  22. 22. More Prototyping," Less Wireframing!http://www.cennydd.co.uk/2012/why-i-dont-wireframe-much/
  23. 23. Instructional Design Principles!http://ged578.pbworks.com/w/page/7309910/Multimodal_Teaching-Learning
  24. 24. Immersion!http://www.uselog.com/2005_10_01_archive.html
  25. 25. Content Parity! ="
  26. 26. “Frictionless” User Experience!http://www.apple.com/iphone/features/siri.html
  27. 27. Tools of Choice (for now…)!
  28. 28. WordPress!
  29. 29. Why WordPress?!$  Substantial and friendly development community!$  Large amount of documentation available!$  One of the most usable CMS platforms available!$  High quality, and customizable, user experience (incl. Administration UI)!$  Wide-range of plugins to extend capabilities!$  WPtouch Pro plugin (by BraveNewCode)!$  More than just blogging, really a platform!!
  30. 30. WPtouch Pro!
  31. 31. What about" Responsive Web Design?!http://www.paulolyslager.com/responsive-design-hype-solution/
  32. 32. Supporting Multiple Devices!!  Responsive web design!!  Device specific design!!  Responsive web design +" server side components!Adapted from Luke Wroblewski
  33. 33. Headway Framework!
  34. 34. Mobile Course Companion!
  35. 35. Demo!
  36. 36. Wrap-up!http://www.flickr.com/photos/o2de/5815193403/
  37. 37. Summary!!  Mobile Learning Headspace!!  Usability and User Experience!!  My Design Approach and Tools!!  Mobile Course Companion Demo!
  38. 38. Where to Next?!mobilelearningux.com (mobile friendly of course!)! –  These slides! –  Suggested books! –  Articles! –  Videos! –  Learning apps (iPhone/iPad and Android)! –  Mobile-friendly WordPress themes! –  Responsive web frameworks! –  Comments/discussion!
  39. 39. Thank You! Further Questions?!Contact info! Web: paulhibbitts.com! Email: paul@paulhibbitts.com! Twitter: @hibbittsdesign! LinkedIn: linkedin.com/in/paulhibbitts!
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×