Fragmentation in mobile design: fact or fiction
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

Fragmentation in mobile design: fact or fiction

on

  • 4,006 views

 

Statistics

Views

Total Views
4,006
Views on SlideShare
3,812
Embed Views
194

Actions

Likes
12
Downloads
70
Comments
0

8 Embeds 194

https://twitter.com 164
http://lanyrd.com 21
http://tweetedtimes.com 2
https://si0.twimg.com 2
http://www.iphone-entreprise.com 2
http://bottlenose.com 1
http://www.diffbot.com&_=1360510438739 HTTP 1
http://news.google.com 1
More...

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

CC Attribution-ShareAlike LicenseCC Attribution-ShareAlike License

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Fragmentation in mobile design: fact or fiction Presentation Transcript

  • 1. FRAGMENTATION IN MOBILE DESIGN FIC TIO N? FACT ORPuzzle perspective by jugbo http://www.flickr.com/photos/jugbo/366748612/
  • 2. The mobile industry is now worth1.3 trillion dollarsThe State of the Union blog for Mobile Industry - all the stats and facts for 2012, T. Ahonen - http://goo.gl/M0oyV
  • 3. Mobile phones sold in 2011 1.6 billion unitsThe State of the Union blog for Mobile Industry - all the stats and facts for 2012, T. Ahonen - http://goo.gl/M0oyV
  • 4. HARDWAREHardware Store by John McNab - http://www.flickr.com/photos/johnmcnab/5758738799/
  • 5. by mikek http://www.flickr.com/photos/mikek/6816067326/
  • 6. by mikek http://www.flickr.com/photos/mikek/6810557770/
  • 7. by mikek http://www.flickr.com/photos/mikek/6997113043/
  • 8. by mikek http://www.flickr.com/photos/mikek/7043782841/
  • 9. by mikek http://www.flickr.com/photos/mikek/7068344451/
  • 10. by mikek http://www.flickr.com/photos/mikek/6875178758/
  • 11. by mikek http://www.flickr.com/photos/mikek/6830525152
  • 12. by mikek http://www.flickr.com/photos/mikek/7024324235/
  • 13. http://www.mobiledia.com/phones/nokia/6810/photo-1.html
  • 14. http://n-gageaplicationdownload.blogspot.co.uk/
  • 15. http://www.mobiledia.com/phones/nokia/6810/photo-1.html
  • 16. http://www.mobiledia.com/phones/nokia/6810/photo-1.html
  • 17. It’s a box by tim caynes - http://www.flickr.com/photos/timcaynes/5408753242/
  • 18. Screen resolutions of the 681,900 Android devices using opensignalmapshttp://opensignalmaps.com/reports/fragmentation.php
  • 19. HARDWARE FRAGMENTATION? FACTHardware Store by John McNab http://www.flickr.com/photos/johnmcnab/5758738799/
  • 20. DEVELOPMENTDevelopment in Docklands by Destinys Agent http://www.flickr.com/photos/destinysagent/2664658912/
  • 21. Fragmentation challenges have been a key topic of discussion in mobile industry circles since Java ME started proliferating in 2004-5. Developer Economics 2011 by Vision MobileDevelopment in Docklands by Destinys Agent http://www.flickr.com/photos/destinysagent/2664658912/
  • 22. Developing across the top three or four mobile platforms (iOS, Android, Symbian and Blackberry) reaches just over 20% of the devices sold on average. Developer Economics 2011 by Vision MobileDevelopment in Docklands by Destinys Agent http://www.flickr.com/photos/destinysagent/2664658912/
  • 23. Brew Series40 Symbian iOS Android many hundred 275 150 350 millions million million millionBlackberry WP Bada WebOS Meego 80 9 12 tons of small OSs million million million http://communities-dominate.blogs.com/brands/2012/05/mobile-services-beyond-messaging-excellent-tns-global-survey-reveals-tons.html
  • 24. platforms differ. LANGUAGES & ENVIRONMENTS Platform Authoring language Dev Environment App store Android Dalvik Android Development Tool Android Market C and C++ (NDK) Plugin for Eclipse WebViews Other IDEs, e.g., IntelliJ, Netbeans. Visual Studio Bada C++ (proprietary Bada IDE based on Eclipse Samsung Apps extension) CDT and JSDT (JavaScript HTML, CSS, JS Development Tools) Blackberry C/C++ QNX Momentics IDE Blackberry App World Tablet OS Java Eclipse plug-ins Android Player Standard IDE & Webworks HTML5, CSS, tools JavaScript Blackberry J2ME MIDP 2.0 Eclipse plug-in Blackberry App World OS HTML WebWorks SDK iOS Objective C Mac with Xcode App Store WebViews Symbian C++ Carbide C++ IDE Ovi Store Qt Windows C#, VB.NET Visual Studio and Microsoft Windows Phone Marketplace Phone Silverlight framework tools such as Expression XNA framework Blend source: VisionMobile researchCross-Platform Developer Tools 2012 by Vision Mobile
  • 25. deployment format (web vs. native). MAJOR CROSS-PLATFORM TOOLS & APPROACHES Vendor (Tool) Technology approach Authoring language Deploym. format Adobe (AIR) Runtime Actionscript Native, Hybrid Adobe (Flex) SDK addition to AIR MXML Native, Hybrid Ansca Mobile Runtime Lua Native (Corona) Antenna Software HTML5, CSS and Runtime Hybrid web apps (Mobility Studio) JavaScript Antix Labs (Antix Runtime C/C++ Native Games) Appcelerator HTML5, CSS and Runtime Native apps (Titanium) JavaScript Web-to-native wrapper WYSIWYG, HTML, Application Craft Web apps, Hybrid (PhoneGap) Javascript, CSS, jQuery Runtime (Mobius) Web-to- HTML5, CSS and AppMobi native app wrapper Web apps, Hybrid JavaScript (PhoneGap) Web-to-native app wrapper HTML5, CSS and Backelite (BKrender) Web apps, Hybrid (PhoneGap) JavaScript DHTMLX Touch JavaScript framework HTML5, CSS, JavaScript Web apps Didmo (Magmito) App Factory WYSIWYG Web apps, Hybrid
  • 26. JavaScript framework, Web- The M Project HTML5, CSS, JavaScript Web apps, Hybrid to-native app wrapper Unity Technologies C# .NET, JavaScript and Runtime Native (Unity) Boo Unreal (Unreal Runtime UnrealScript Native Engine) Uxebu (Aparrat.io, Frameworks, Web-to-native HTML5, CSS, JavaScript Hybrid Storage.js ) app wrapper UXplus (Aqua WYSIWYG, JavaScript, Runtime Native Platform) C++ JavaScript Framework, Web- Wink to-native wrapper HTML5, CSS, JavaScript Web app (PhoneGap) Wix Mobile App factory WYSIWYG Web app Xamarin (Mono Source code translator, Touch, Mono for C# .NET Native Runtime Android) Java Bytecode, .NET .Net, Java or Ruby XMLVM Source code translator CIL, JavaScript, Bytecode Python, Obj. C C++ Zipline Games App factory, Runtime (for Lua Native (Moai) Lua script) source: VisionMobile researchCross-Platform Developer Tools 2012tools that Mobile tracked as part of our research appears below.The full list of 100 cross-platform by Vision we have
  • 27. Spiderweb by jk079 - http://www.flickr.com/photos/jk079/5236562439/
  • 28. Mobile web moving from hype to reality. Developers stumbling on three challenges: fragmentation, performance limitations and lack of distribution and monetisation channels. Developer Economics 2012 by Vision MobileSpiderweb by jk079 - http://www.flickr.com/photos/jk079/5236562439/
  • 29. OpenSignalMaps, a popular Androidapplication, has tracked over 600 thousanddevices (...) and reported nearly 600 devicemodels and 4,000 device variants.Developer Economics 2012 by Vision Mobile
  • 30. Digital madness by ric_k - http://www.flickr.com/photos/ric_k/2545124107/
  • 31. DEVELOPMENT FRAGMENTATION? FACTDevelopment in Docklands by Destinys Agent http://www.flickr.com/photos/destinysagent/2664658912/
  • 32. DESIGN
  • 33. APPLICATIONS
  • 34. contentWhat the user has in a digital experience:1) information and 2) the potential of doingsomething with this information APPLICATIONSArturo Toledo, User Experience Designer (WP Design Studio) - http://ux.artu.tv/?p=240 actions
  • 35. contentWhat the user has in a digital experience:1) information and 2) the potential of doingsomething with this information APPLICATIONSArturo Toledo, User Experience Designer (WP Design Studio) - http://ux.artu.tv/?p=240
  • 36. CONTENT SCREENS
  • 37. SIBLING NAVIGATION
  • 38. TOP-DOWN NAVIGATION
  • 39. BACK NAVIGATION
  • 40. What the user has in a digital experience:1) information and 2) the potential of doingsomething with this information APPLICATIONSArturo Toledo, User Experience Designer (WP Design Studio) - http://ux.artu.tv/?p=240 actions
  • 41. A A AA A A
  • 42. GLOBAL ACTIONS
  • 43. SCREEN ACTIONS
  • 44. OBJECT ACTIONS
  • 45. A A AA A A
  • 46. A A INPUT SCREENS AA A A
  • 47. A A AA A A A A A
  • 48. A A AA A A A
  • 49. A A A A A A A A A A
  • 50. A A A A A A A A A A
  • 51. Applications
  • 52. Applications Content Content Content screen screen screen Content screen Content screen
  • 53. Applications Content Content Content screen screen screen Content screen Content screen
  • 54. Applications Content Content Content screen screen screen Content screen Content screen
  • 55. Applications A A A Content Content Content screen screen screen A Content screen A Content screen
  • 56. Applications A Input screen A A A Content Content Content screen screen screen A A Content screen Input screen A A Content screen Input screen
  • 57. Applications A Input screen A A A Content Content Content screen screen screen A A Content screen Input screen A A Content screen Input screen
  • 58. Applications A Input screen A A A Content Content Content screen screen screen A A Content screen Input screen A A Content screen Input screen
  • 59. Applications A Input screen A A A Content Content Content screen screen screen A A Content screen Input screen A A Content screen Input screen
  • 60. Applications A Input screen A A A Content Content Content screen screen screen A A Content screen Input screen A A Content screen Input screen
  • 61. Applications A Input screen A A A Content Content Content screen screen screen A A Content screen Input screen A A Content screen Input screen
  • 62. GLOBAL & SCREEN ACTIONS
  • 63. OBJECT ACTIONS
  • 64. Applications A Input screen A A A Content Content Content screen screen screen A A Content screen Input screen A A Content screen Input screen
  • 65. Applications A Input screen A A A Content Content Content screen screen screen A A Content screen Input screen A A Content screen Input screen
  • 66. The switcher testStep 1 - Go to one appStep 2 - Open the apps switcherStep 3 - Go to a different appStep 4 - Press the back buttonWhere are you now?
  • 67. APPLICATION STRUCTURE (navigates) within an app based on thehierarchical relationships between screens http://developer.android.com/design/patterns/navigation.html
  • 68. ACTIVITY HISTORY (navigates) in reverse chronological order,through the history of screens the user has recently worked with http://developer.android.com/design/patterns/navigation.html
  • 69. appstructureactivity
  • 70. appstructure Android 2.3 and earlier relied upon the system Back button for supporting navigation within an app. With the introduction of action bars in Android 3.0, a second navigation mechanism appeared: the Up button, consisting of the app icon and a left- point caret http://developer.android.com/design/patterns/navigation.htmlactivity
  • 71. appstructure When the previously viewed screen is also the hierarchical parent of the current screen, pressing the Back button has the same result as pressing the Up button - this is a common occurrence http://developer.android.com/design/patterns/navigation.htmlactivity
  • 72. 1
  • 73. 1
  • 74. 2
  • 75. 2
  • 76. 3
  • 77. 3
  • 78. 4
  • 79. 4
  • 80. 5
  • 81. 5
  • 82. 6
  • 83. 6
  • 84. 7 8
  • 85. DESIGN FRAGMENTATION?F IC TI ON
  • 86. DESIGN FRAGMENTATION? ON DOES THIS MATTER?F IC TI
  • 87. http://orainteractive.com/2012/06/understanding-mobile-ui-patterns/
  • 88. Commonplace means familiar, and for youraudience, familiarity leads to efficiency andease (...) Novices in particular benefit frominterfaces that use icons and controls they’veseen elsewhere.Tapworthy - Designing Great iPhone apps, J. Clark
  • 89. There is a confusing and frustrating array ofhardware, software, apps, websites, etc (...)using them is burdensome (...) the diversity ofthem (...) is already problematic (...) So I seewhatever will simplify and unify our activitiesas being popular.The Future of Apps and Web, Pew Internethttp://pewinternet.org/Reports/2012/Future-of-Apps-and-Web/Overview.aspx
  • 90. We are only three decades into one of themost important revolutions the world hasever seen. In design development terms, thatis a mere blink.The Mobile Frontier, R. Hinman
  • 91. the history of mobile has been a long, painfulprocess of copying desktop computers andthen sheepishly realizing that is just doesn’tquite work right.S. Jenson - http://designmind.frogdesign.com/blog/mobile-apps-must.die.html
  • 92. In light of all the statistical data and anecdotalevidence, it may be difficult to believe thatanything is limiting the potential of mobiletechnology. But there is one limiting factor: it’sour fixation with the desktop paradigm andits graphical user interface.The Mobile Frontier, R. Hinman
  • 93. WHY IS IT HAPPENING?
  • 94. lockdown was the direction a visionary SteveJobs (...) first took with the iPhone. (...) Thesetechnologies can let geeky outsiders buildupon them just as they could with PCs, but ina highly controlled and contingent way (...)software written by outsiders that must beapproved by and funneled through Apple.The Future of the Internet, J. Zittrain
  • 95. When your task is designing an operatingsystem, you are not focusing on interactioninnovation: all your energies are going intoother things ....... mainly creating a coherent interactionframework, protecting your users, and givingthird-party developers the tools they need.
  • 96. Companies build phones that the carriers askfor instead of taking risks and testing newconcepts (...) The result is a collection ofhandsets that are fairly homogenous from asmall number of brands.http://theverge.com/2012/7/5/3138711/five-years-after-the-iphone-carriers-are-the-biggest-threat-to-innovation-editorial
  • 97. There’s a lull in the industry right now (...) Ifanything, Apple has an interest in maintainingthe status quo. So does everyone else.http://www.mobileindustryreview.com/2012/05/the-facebook-phone-why-its-good-news-for-the-industry.html
  • 98. with every new smartphone subscription wetake another tiny but discrete step towards anetworked world dominated by powerfulcorporations that can (...) control the speedof technological innovation to a pace that isconvenient for them rather than determinedby the creativity of hackers and engineers.http://guardian.co.uk/technology/2012/jun/03/john-naughton-smartphone-revolution-cost
  • 99. disruption in mobile designwill not come from thecompanies designing the OS
  • 100. disruption in mobile designmust come from third partyservices
  • 101. disruption in mobile designmust come from third partyservices or might not comeat all.
  • 102. 4 billion unique mobile phone usersThe State of the Union blog for Mobile Industry - all the stats and facts for 2012, T. Ahonen http://goo.gl/M0oyV