Developing for Mobile: Tools, Tips, and Deployment Options
Upcoming SlideShare
Loading in...5
×

Like this? Share it with your network

Share

Developing for Mobile: Tools, Tips, and Deployment Options

  • 4,192 views
Uploaded on

"Developing for Mobile: Tools, Tips, and Deployment Options" for Training Magazine Learning 3.0 Conference in Chicago October 3-5, 2011

"Developing for Mobile: Tools, Tips, and Deployment Options" for Training Magazine Learning 3.0 Conference in Chicago October 3-5, 2011

More in: Technology , Education
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
No Downloads

Views

Total Views
4,192
On Slideshare
4,042
From Embeds
150
Number of Embeds
4

Actions

Shares
Downloads
125
Comments
1
Likes
4

Embeds 150

http://paper.li 142
http://www.linkedin.com 5
http://www.scoop.it 2
http://twitter.com 1

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Developing for Mobile: Tools, Tips, and Deployment Options Jason Haag Mobile Learning Research Analyst The Tolliver Group, Inc.
  • 2. Stages of Human Evolution… Are We Evolving ? 2  
  • 3. Scientists Suggest… Our fingertips are changing! 3  
  • 4. Or Is It A Sign? Prepare for the Zombie Apocalypse! 4  
  • 5. 5  
  • 6. ADL Mobile Learning Team Judy Brown and Jason Haag 6  
  • 7. Mobile Me… Since 2003 7  
  • 8. 8  
  • 9. ADL Mobile Learning DefinitionADL defines mobile learning as theuse of handheld or wearablecomputing devices to provide accessto learning content and informationresources. 9  
  • 10. Five Moments of Learning Needs •  When learning for the first time •  When wanting to learn more •  When trying to remember •  When things change •  When something goes wrong Dr. Conrad Gottfredson Which One Is Most Appropriate for Mobile? 10  
  • 11. Five Moments of Learning Needs •  When learning for the first time •  When wanting to learn more Learn   •  When trying to remember •  When things change Perform   •  When something goes wrong 11  
  • 12. Much More Than Courses… EvaluaFon   rning   Contextualized  lea on   Field  guide   Quiz   Poll   Just-­‐in-­‐Fme  LocaF   c specifi   Review/remember   Micro  learning Feedback   Modules,     Video  recordings   Alerts   Survey   Geo-­‐blogging   Courses,     Note  taking   Fon   What  Else?   Tr anscrip Test   ings   Assdio  record d  acce u   n  On-­‐deman Geo-­‐exploraFo Reminders   Capture/share/document   ReporFng   Reference   Procedure s   Updates   Conferencing   Game-­‐based  learning   on   SimulaF toring OrganizaFon   Coaching/men list   Job  aid/check   Assignmen ts   TranslaFon Augmented  reality     Decision  support   PresentaFons   E-­‐books   Mobile Learning Opportunities! 12  
  • 13. “Think Outside the Course” Judy Brown 13  
  • 14. 14  
  • 15. 15  
  • 16. ADL’s Mobile Learning Handbook http://mlhandbook.adlnet.gov We are also working with TSWG Combating Terrorism on conductingMarket research on companies that offer mobile learning products. Want to participate? Want to be added? Contact Us: adlmobile@adlnet.gov 16  
  • 17. ADL Mobile Learning Guide: Mobile Web Deployment http://mlearn.adlnet.gov or http://mlearn.adlnet.mobi (mirror) 17  
  • 18. Native App Distribution iTunes  App  Store   Android Market & iPhone App Store 18  
  • 19. USA.gov App Store Deployment iTunes  App  Store   http://apps.usa.gov/adl-mlearning-guide/ 19  
  • 20. ADL Mobile Learning Guide •  Graphics editor (Fireworks) •  HTML editor (Dreamweaver CS 5.5) –  jQuery Mobile Framework (for mobile content creation) •  PhoneGap Framework (open source - for native app packaging & deployment) •  Books –  Programming the Mobile Web , Maximiliano Firtman –  Mobile Design and Development , Brian Fling –  HTML5: Up and Running , Mark Pilgrim How Did We Do It? 20  
  • 21. 21  
  • 22. 22  
  • 23. 23  
  • 24. Mobile Apps Must Die! “Native Apps Are Becoming Too Much To Organize & Maintain” Is Value > Pain ? - Scott Jenson, @scottjenson 24  
  • 25. I’m a PC…I’m a Mac Yeah…whatever  25   25
  • 26. I’m a Native App…I’m a Web App What’s the Difference? 26   Source:    Global  Intelligence  Alliance   26
  • 27. The Wrong QuestionThe question is no longer, “Which do we develop for, native or mobile web?” but... 27  
  • 28. The Right Question“How do we develop solutions to handle both mobile web & native now as well as the devices of the future?” - Dave Olsen, @dmolsen 28  
  • 29. You Need A… Dave Olsen, @dmolsen 29  
  • 30. Native App SDKs = Develop for Many Platforms •  Symbian OS from the Symbian Foundation •  BlackBerry OS from RIM •  iOS from Apple •  Windows Phone 7 from Microsoft •  Android from Google •  WebOS from HP •  Bada from Samsung •  MeeGo from Nokia and Intel Must Support Several Platforms & No Browsers 30  
  • 31. Emulators Anyone? http://www.mobilexweb.com/emulators 31  
  • 32. Quick Alternatives…•  SwebApps •  TapLynx •  AppIncubator •  Appanda •  Kanchoo •  AppMakr •  AppBreeder •  App.co •  MyAppBuilder •  Appswell •  BuildAnApp •  UNITYMobile •  eBookApp •  And many others… •  GameSalad •  MobileRoadie •  MobBase Do-It-Yourself Toolkits32  
  • 33. Do-It-Yourself Toolkits No Coding Required, BUT…33  
  • 34. Why the Mobile Web? 1  out  of  every  5  people  by  2013   34  
  • 35. Mobile App Development Balancing Views35  
  • 36. Deployment Options Support Native Only… or Web & Native? 36  
  • 37. Standards•  W3C Standards for Web Apps on Mobile (Feb 2011) –  http://www.w3.org/2011/02/mobile-web-app-state.html –  Current Status: http://www.w3.org/standards/techs/mobileapp#w3c_all The Web is an App Platform! 37  
  • 38. “Not  every  mobile  device  will  have  your  app  on  it,  but  every  mobile  device  will  have  a  browser.”   -­‐  Jason  Grigsby,  @grigs   38  
  • 39. Web App Stores…Mozilla’s Open Web App Store (2010) •  http://apps.mozillalabs.com Open App Market (2010) •  http://www.openappmkt.com Chrome Web Store (2010) •  http://chrome.google.com/webstore GetJar HTML5 Mobile Web App Store •  http://www.getjar.com Opera Mobile Web App Store (2011) •  http://apps.mozillalabs.com Open Space (Under Development) •  https://www.developerscoop.org On the Rise 39  
  • 40. Mobile Web App Frameworks •  Developed using Web Standards (HTML, CSS, JavaScript) –  Each framework usually consists of these file types and some additional images, templates •  Can be hosted on a web server – OR – packaged as Native App (using PhoneGap or other Solution) 40  
  • 41. History Repeats Itself! Don’t Just Target Webkit Browsers!41  
  • 42. Mobile Web App Frameworks •  HTML, CSS, JavaScript Only –  iWebkit –  JQTouch (JQuery Touch) –  iUI (iPhone User Interface) –  jQuery Mobile (Uses Progressive Enhancement) •  HTML, CSS, JavaScript + Native App Publishing –  Rhodes & RhoHub –  Sencha Touch JavaScript Framework –  Titanium Appcelerator •  Native App Packaging for HTML Content –  PhoneGap 42  
  • 43. Mobile Web App Frameworks http://adlmobile.wikispaces.com 43  
  • 44. Mobile Web Frameworks in Higher Ed •  http://kurogo.org •  http://mollyproject.org •  http://mwf.ucla.edu •  http://www.jasig.org/umobile Support Both Native and Mobile Web 44  
  • 45. Report from MOLE (March 2011) http://www.mole-project.net 45  
  • 46. Device Detection•  WURFL -  Protects from transcoders -  Java & PHP APIs & XML focused on accurate detection of mobile device capabilities -  http://wurfl.sourceforge.net •  Terra-WURFL -  PHP API & MySQL focused on high-performance detection of mobile devices -  Can detect over 45,000 UAs -  http://www.tera-wurfl.com •  Device Atlas – Mobile Device Database & API -  Developed by dotMobi in February 2008 -  Comprehensive data on over 6,000 devices -  http://deviceatlas.com •  DetectMobileBrowsers.mobi – Detects Mobile Browser User Agents -  PHP-based (server-side) -  Supports: iPhone, iPad, Android, Opera Mini, Blackberry, Palm, Windows Mobiles, Low End Mobiles, Desktop Redirect URL If You Can’t Create and Must Convert…46  
  • 47. Content Adaptation aka “Device Detection”   Used for XHTML/ CSS for basic version   Used iWebkit HTML5 & CSS for advanced version   Used device detection h^p://webguide.ua.edu/mobile.html   Maintenance Nightmare! 47  
  • 48. Feature Detection Is A Better Approach JavaScript Library: http://modernizr.com 48  
  • 49. The Peanut M&M AnalogyThe Chocolaty Layers of Progressive Enhancement Progressive Enhancement = Mobile First 49  
  • 50. Mobile First Strategy Naturally Improves Information Achitecture 50  
  • 51. HTML5 Responsive Design The Boston Globe (Desktop Browser) 51  
  • 52. HTML5 Responsive Design The Boston Globe (Tablet Browser) 52  
  • 53. HTML5 Responsive Design: CSS Media Queries The Boston Globe (Mobile Browser) 53  
  • 54. jQuery Mobile http://jquerymobile.com 54  
  • 55. Dreamweaver CS5.5 “Mobile Starters” Samples Included! 55  
  • 56. EASY HTML!<body><!-- Start of first page --><div data-role="page" id="foo”><div data-role="header"><h1>Foo</h1></div><!-- /header --><div data-role="content"><p>Im first in the source order so Im shown as the page.</p><p>View internal page called <a href="#bar">bar</a></p></div><!-- /content --><div data-role="footer"><h4>Page Footer</h4> </div><!-- /footer --></div><!-- /page --> Header, Content Body, Footer 56  
  • 57. 57  
  • 58. Next StepsMaintenance & Updates –  Contextual updates –  Framework updates –  Search functionality –  More App Store Distribution •  Windows Phone •  BlackBerry •  Open Web App Stores Mobile Learning Guide (App) 58  
  • 59. jQuery Mobile + PhoneGap = Write Once, Deploy to Multiple Platforms 59  
  • 60. Where’s the Gap? To the Cloud! 60  
  • 61. Mobile Lessons Learned•  An emulator is not always consistent with the actual device •  Limited support for Flash today (Adobe working HTML5) •  Poor / inconsistent support for pop-up windows and framesets •  Video Compatibility -  Varying formats supported -  Video fragmentation issues with Android 61  
  • 62. Mobile Video Formats RIM Apple Microsoft Google Nokia Palm BBOS iPhone OS Win Mobile Android Symbian Palm OSMP4 / 3GP M4V / MP4 WMV / 3GP MP4 / SWF MP4 / WMV MP4 / H263files (wide) files files files files Credit: OnPoint Digital 62  
  • 63. Mobile Lessons Learned•  Create. Don’t convert! •  Scope: You can support all device types. Narrow the scope and focus on consistent user experience •  Mobile first approach: potential for both a desktop and mobile deliverable from single code base •  SCORM on mobile browsers works, but provides a poor user experience –  What level of tracking is actually needed? Bookmarking, completion, assessment, etc. •  Mobile Apps can be developed using HTML5 and support multiple platforms (both native and web) 63  
  • 64. Don’t Get Hung Up on Platforms!Think About: Requirements, Content, and User Experience I’m at Native App… I’m a Web App… I’m a Hybrid App…So What! Credit: OnPoint Digital 64  
  • 65. Developing for Mobile Is Tough! a balancing act… 65  
  • 66. Resources http://adlmobile.wikispaces.com 66  
  • 67. Resources http://research.adlnet.gov/newsletter/mobile 67  
  • 68. Other Resources – What I’m Reading •  Beginning Building Mobile Application Development in the Cloud (November 2011) By Richard Rodger •  Head First Mobile Web (December 2011) By Lyza Danger Gardner and Jason Grigsby •  jQuery Mobile: Up and Running, 1st Edition (July 2011) By Maximiliano Firtman •  Programming HTML5 Applications (May 2011)By Zachary Kessin •  Designing mLearning (February 2011) By Clark Quinn New and Upcoming Books on Mobile! 68  
  • 69. Homo Textus…Don’t Text and Drive! You Know Who You Are! 69  
  • 70. Don’t Text and Fly! 2011! Happy Halloween  70  
  • 71. More Photo Credits•  http://www.flickr.com/photos/adactio/6153558098/in/set-72157627691092806 •  http://www.flickr.com/photos/danzen/4137160631/ •  http://filamentgroup.com/lab/building_with_jquery_mobile/ •  http://www.chrisumiastowski.com/heres-another-reason-why-apps-die •  http://theinvisiblegorilla.com/blog/2010/10/25/dont-text-and-fly/ 71  
  • 72. Questions / Discussion Jason Haag Mobile Learning Research Analyst   jason.haag.ctr@adlnet.gov   Twi^er:  @J_Haag,  @ADLmobile   h^p://www.linkedin.com/in/jasonhaag   Let’s Connect! 72