Mobile Apps: Web vs. Native - A Nerdery Agency Primer

1,611 views

Published on

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

  • Be the first to like this

No Downloads
Views
Total views
1,611
On SlideShare
0
From Embeds
0
Number of Embeds
261
Actions
Shares
0
Downloads
44
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Mobile Apps: Web vs. Native - A Nerdery Agency Primer

  1. 1. WEB APPS VS. NATIVE APPS AGENCY PRIMER SERIES
  2. 2. THE NERDERY We help our partners get big ideas out of their heads and onto their clients’ websites Website: www.nerdery.com Twitter: @the_nerdery
  3. 3. MIKEUSER EXPERIENCE MANAGER
  4. 4. TONYFRONT-END DEVELOPER
  5. 5. THE MOBILE LANDSCAPE
  6. 6. DEMOGRAPHICS & GROWTH Image Courtesy of - Dave Rupert http://bit.ly/hvlM6j
  7. 7. WHO HAS A MOBILE PHONE? 292,000,000 Mobile Phones 93% Market Penetration Source - http://www.ctia.org/media/industry_info/index.cfm/AID/10323
  8. 8. MOBILE OS LANDSCAPESymbian (Nokia) 37% Android 25% Apple 17%RIM (BlackBerry) 15%Windows Mobile 3% Other 3% 0 0.1 0.2 0.3 0.4 Market Share Source - http://en.wikipedia.org/wiki/File:Smartphone_share_current.png
  9. 9. MOBILE BANDWIDTH 1.4 MBPS3G Networks 6.0 MBPS 6.0 MBPS4G Networks 10.0 MBPS Average Speed Peak Speed
  10. 10. WHAT’S THE DIFFERENCE?MOBILE WEBSITE NATIVE APP
  11. 11. NATIVE APPS VS. WEB APPS PROS CONS UNIVERSAL BROWSER INCONSISTENCIES NO DISTRIBUTION BARRIERS REQUIRES INTERNET CONNECTION WEB APP EASY TO UPDATE PRESENTATION VARIES BETWEEN STANDARDS BASED DEVELOPMENT DEVICES ACCESS TO NATIVE HARDWARE FEATURES ONE APP PER OPERATING SYSTEM GREATER POTENTIAL FOR REVENUENATIVE APP FASTER / MORE USABLE ADVANCED DEVELOPMENT SKILLS MULTIPLE UI CONVENTIONS LOCAL STORAGE / CACHING
  12. 12. HOW TO CHOOSEGO MOBILE WEB IF... GO NATIVE APP IF... You want to reach the broadest You need to utilize specific hardware possible audience for the least features amount of money You have a niche audience or large You can deal with a less than development budget spectacular user interface You need to make money from your You don’t need a distribution application channel
  13. 13. MOBILE DESIGN BEST PRACTICES
  14. 14. SIMPLIFY - THEN DO IT AGAIN.
  15. 15. MOBILE DESIGN PRINCIPLES Design for touch interactions Utilize common interface conventions Fitts Law - Worry about “Fat Fingers” Speed up load time by: Reducing calls to the server Reducing the number of images
  16. 16. MOBILE CONSTRAINTSAttention SpanLack of :hover interactionsVarying and changing screen sizes & resolutionsLimited or no Flash & Silverlight supportTypographical limitationsBandwidth
  17. 17. DESIGNING MOBILE WEBSITES
  18. 18. MOBILE SCREEN SIZES
  19. 19. LIQUID LAYOUTSBe flexible - Let content flow naturallyAllows for targeting all screen sizes and resolutionsFuture proofs your website for new devices
  20. 20. DEVICE DETECTION AND VERSION SWITCHING http://yourwebsite.com ➔ http://m.yourwebsite.com Detect User Agent in software Redirect to mobile subdomain Allow Mobile / Desktop SwitchingMost popular subdomains
  21. 21. SEO AND REDIRECTIONhttp://www.edmunds.com/toyota/rav4/review.html http://m.edmunds.com/
  22. 22. DESIGNING NATIVE MOBILE APPS
  23. 23. KNOW YOUR AUDIENCE Pick a platform, but consider multiple platforms if budget allows. Design unique versions for each platformImage Courtesy of - http://www.csectioncomics.com/2010/11/iphone-vs-android-vs-blackberry.html
  24. 24. PLATFORM COMPARISONS IPHONE ANDROID PHONES OS IOS - 5 VERSIONS ANDROID PLATFORM - 5 VERSIONS DEVICES 4 DEVICES 60+ DEVICES APP DEV OBJECTIVE C JAVA LANGUAGEDISTRIBUTION APP STORE ANDROID MARKET APPS 300,000 100,000 AVAILABLE CARRIER AT&T WHOEVER WANTS TO
  25. 25. MIMIC NATIVE CONVENTIONS
  26. 26. TACTILE INTERACTION
  27. 27. UTILIZING HARDWARE FEATURESGeo Location Accelerometer Gyroscope Light Sensor SMS Phone Calls Camera Touch Screen Gestures Push Notifications Local Database
  28. 28. USING GESTURES Tap Circle Double Tap Expand PinchTap and Hold Rotate Change One Finger Two Finger ShakeOrientation Scroll Scroll
  29. 29. PRICING ANDDISTRIBUTION
  30. 30. FREE APPS VS PAID APPS Image Courtesy of - http://www.distimo.com/
  31. 31. APPS AVERAGE PRICE Image Courtesy of - http://www.distimo.com/
  32. 32. APP DISTRIBUTIONApple App Store Android Market Blackberry App World
  33. 33. APPLE APP STORE 300,000 apps Requires Apple Developer Account ($99) Must be approved by Apple 14 day approval time (7 day for updates) You set your price (Apple gets 30%) Apple Enterprise ProgramApple App Store
  34. 34. HOW TO AVOID APPLE REJECTION The Dreaded HIG Simulating Failures Bandwidth Usage over Cellular Networks Political Lampooning Accurate app description OS Compatibility Apple App Store http://mobileorchard.com/avoiding-iphone-app-rejection-from-apple/
  35. 35. ANDROID MARKET 100,000 apps $25.00 Developer Account Instant Submission No Review Process Google takes 30% Allows refunds before 24 hoursAndroid Market
  36. 36. QUESTIONS?More answers online at http://nerdery.com

×