Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.



Published on

A presentation to help you understand the value of creating prototypes for your mLearning projects.

Published in: Technology
  • Be the first to comment


  1. 1. PrototypingCreate your first mLearning prototype usingweb-based tools.
  2. 2. • Got the files?• If not... Here is the link:Pregame...
  3. 3. Float guides industry-leading companies tounderstand and leverage the power of mobilelearning. We help companies meet their businessstrategies by making useful informationaccessible, anytime, anywhere.
  4. 4. Mobile Learning Certificate ProgramMobile Learning Essentials SeriesWhere you can find more...Learning Everywhere – Published June 2012
  5. 5. • Mobile development can get pricey• Mobile development can take time and can getbogged down• Prototyping helps manage cost and risk• Prototyping helps get buy-in and useracceptance/usability out of the way earlierWhy prototype?
  6. 6. Considerations
  7. 7. • Building Prototypes should be EASY• Prototypes should not need to be pixelperfect• Prototypes goals need to be clearly spelledout prior to creation• Build Prototypes that have an output thateveryone can see• If animations, etc. are going to be used in thefinal, attempt to build them in the prototypeThe Basics
  8. 8. • Functional Fidelity and Visual Fidelity• You need to envision the goals for theprototype• Choose method and graphic sophisticationbased on the goals.• More “Production Ready” = more time• More graphically rich = more time• More revisions at this point are less expensivethan laterFidelity vs. Functionality
  9. 9. Fidelity vs. Effort
  10. 10. A few prototypingoptions.
  11. 11. Ahh... Paper
  12. 12. Pros• Inexpensive• EasyCons• Doesnt really emulate the UX• Hard to pull off a complicated design or onewith a lot of screens/data• None of the design elements/deliverablesreally will live on• Tough to justify with so many good toolsthese days.Paper prototype
  13. 13. HTML/CSS
  14. 14. Pros• Inexpensive• Easy-ish• Using Webkit based browsers, you can emulate mobiledevices pretty well• There are tools popping up now that ease thisconsiderablyCons• More tech knowledge might be required than simplepaper prototypes• There is still very little reuse of assets for the final version,unless you are going to mobile web, not appsHTML/CSS
  15. 15. Tools that arent reallyfor prototyping, butstill work pretty well.
  16. 16. Pros• Most everyone has one of these• Reasonably easy to use for any one familiar with desktoppublishing tools• Produces interactivity and animationCons• Its a tad expensive if you don’t own it already• None of the design elements/deliverables really will live on• Good UI Stencils are tough to find or need reprep• Output isn’t really “mobile”Powerpoint/Keynote
  17. 17. Keynote Examples
  18. 18. Pros• great toolset – highly extensible, large community• Produces fantastic diagrams and high quality output• Reasonably easy to use for any one familiar with desktoppublishing tools• produces interactivity• move from wireframe to prototype easilyCons• Its a tad expensive• Mac only (which might also be considered a Pro)• None of the design elements/deliverables really will live onOmnigraffle
  19. 19. Graffle!
  20. 20. Pros• Uses InDesign• Produces rich interactivity• Allows for mediaCons• Fairly pricey if you want to take it past a prototype and useit for production• Does require InDesign, which some of you may not have• Output is iPad onlyDigital Publishing Suite
  21. 21. DPS
  22. 22. Lots more examples inApp Savvy
  23. 23. New! Rapidprototyping tools.
  24. 24. Protosketch
  25. 25.
  26. 26. Pros• Inexpensive• Super-easy!• Web/Cloud based (so its collaborative)• Results are pretty stellarCons• Its still in beta-ish state• Cloud Based (maybe not possible in your org)• Assets are not going to be used for the final deliverableInvisionApp
  27. 27. Wrap it up, already.
  28. 28. • Prototyping is fast• Prototyping is easy• Prototyping gets stakeholders involved sooner• Prototyping saves moneyWhy prototype?
  29. 29. • Activity• Got the files?• If not... Here is the link:Finishing up