XTREME LABSBUILDING GREAT APPSIN THE FRAGMENTEDANDROID WORLDBoris Chan (@borisc)Principal, Xtreme Labs (@xtremelabs)June 2...
XTREME LABS                  Leader in Mobile Solutions             Toronto, Canada & Palo Alto, CaliforniaBoris Chan @bor...
100% AGILEBoris Chan @borisc / @xtremelabs
SUCCESS ACROSS MULTI-PLATFORMS            300+                             300+            Apps                           ...
(@borisc or boris@xtremelabs.com)Boris Chan @borisc / @xtremelabs
BUILDING GREAT APPS IN THE    FRAGMENTED ANDROID WORLD (IN 3                 PARTS)           1. Tips for Building Great A...
10 THINGS WE LEARNED FROM BUILDING                 APPS  What we talk about when we talk about buildingBoris Chan @borisc ...
#10: THINK MOBILE-FIRST            Not just a strategy for disruption.Boris Chan @borisc / @xtremelabs
#9: DESIGN IN SOCIAL BY DEFAULT               Friendly, private and intimate.Boris Chan @borisc / @xtremelabs
#8: LATENCY KILLS.          You have limited time and resources.                                   Ed Yourdon http://www.fl...
#7: EMBRACE BEAUTY               (Holo tells you to do this too)Boris Chan @borisc / @xtremelabs
#6: EMBRACE TOUCH                           Keep it real.Boris Chan @borisc / @xtremelabs
#5: CREATE THAT A-HA MOMENT                      Delight your users.Boris Chan @borisc / @xtremelabs
#4: CACHE IS KING   Cache all the things. (A lack of speed also kills.)Boris Chan @borisc / @xtremelabs
#3: HAVE PERFECT TIMING    “All     Get things ready for your users.           things entail rising and falling    timing....
#2: KNOW YOUR PLATFORMS                     Understand Android.Boris Chan @borisc / @xtremelabs
#1: KNOW YOUR USERS     Get data to build the right thing. Play to yourBoris Chan @borisc / @xtremelabs
ANDROID AND FRAGMENTATIONBoris Chan @borisc / @xtremelabs
ANDROID AND FRAGMENTATION400+ devices that differ in many ways  Different dpi and densities, screen sizes  (5+!)  Differen...
ANDROID AND FRAGMENTATIONCurrent Android Marketshare  2.2/2.3 is  usually the  decision...  4.x just at 7%Boris Chan @bori...
ANDROID AND FRAGMENTATIONCurrent Android Marketshare  Adoption rate not picking fast  enough...Boris Chan @borisc / @xtrem...
ANDROID AND FRAGMENTATIONWhat you should look for:  Device manufacturers branch their own  versions of Android (Motorola R...
HOW DOES ANDROID ATTEMPT TO SOLVE              THIS?                           Enter Holo...Boris Chan @borisc / @xtremelabs
REVIEWING HOLO:              An attempt to unify Android UI/UXBoris Chan @borisc / @xtremelabs
HOLO UI PRINCIPLESBoris Chan @borisc / @xtremelabs
ENCHANT MEBoris Chan @borisc / @xtremelabs
REVIEWING HOLOENCHANT ME                                    Real objects are more fun than    Delight me in surprising way...
SIMPLIFY MY LIFEBoris Chan @borisc / @xtremelabs
REVIEWING HOLOSIMPLIFY MY LIFE  Keep it brief  Pictures are faster than words  Decide for me but let me have the final say ...
REVIEWING HOLOSIMPLIFY MY LIFE  I should always know where I am  Never lose my stuff  If it looks the same, it should act ...
MAKE ME AMAZINGBoris Chan @borisc / @xtremelabs
REVIEWING HOLOMAKE ME AMAZING  Give me tricks that work everywhere  It’s not my fault  Sprinkle encouragement  Do the heav...
A QUICK REVIEW OF HOLO AND THEMESUnderstanding Holo as a unified look-and-feel for Android  ActionBar is actually their att...
A QUICK REVIEW OF HOLO AND THEMESUnderstanding Holo and the Compatibility Standard  Provides a predictable, standard look ...
HOLO IS THE NEW UI/UX CENTRE OF                ANDROIDBoris Chan @borisc / @xtremelabs
ON FRAGMENTATION DURING DESIGN          AND DEVELOPMENT(Also, note that this is a companion guide to our afternoon        ...
MOST OF THE DESIGN GUIDE IS EASY TO             NAVIGATE...                   (Except the following...)Boris Chan @borisc ...
UNDERSTANDING BACK STACK ONPlacement  Hardware at the bottom (in any order),  Software button (at the bottom left),  Softw...
Up vs. BackBoris Chan @borisc / @xtremelabs   27
Sibling ScreensBoris Chan @borisc / @xtremelabs   27
Unrelated Siblings and the Back StackSibling ScreensBoris Chan @borisc / @xtremelabs        27
Action Bars, Menus and BackwardsCompatibility                            Hardware Controls    Virtual Controls            ...
Spot the problem for designers...                            Hardware Controls                              Why does the a...
PURE ANDROIDDon’t mimic UI elements from other platforms         Android         iOS         WP7Boris Chan @borisc / @xtre...
PURE ANDROIDDon’t carry over platform specific icons        Android        iOS         WP7Boris Chan @borisc / @xtremelabs ...
PURE ANDROIDDon’t hardcode links to other appsBoris Chan @borisc / @xtremelabs     27
PURE ANDROIDDon’t use labeled back buttons on action barsBoris Chan @borisc / @xtremelabs                27
PURE ANDROIDDon’t use right-pointing carets on line itemsBoris Chan @borisc / @xtremelabs                27
COMPARING APPLES AND ANDROIDSiOS is not like Android, most of the time  Flat and follow Holo - Holo + fallback to  system ...
DESIGN PATTERNS ARE JUST GUIDELINESYou must be fearless in destroying yourself to progress...Example: Dashboards are being...
LIFE WITH THE SUPPORT PACKAGEFocus on the app, worry less about the platform. (But helpexists!)  Support Package/Compatibi...
LIBRARIES AND PRACTICAL ANDROIDThings to consider when thinking about Holo Everywherepractically...  Third party-libraries...
ONE MORE THING...                   Let’s put it all together.Boris Chan @borisc / @xtremelabs
TALKING ABOUT BUILDING APPSThe Countdown...1. Know your users2. Know your platforms             6. Embrace Touch3. Have pe...
HOLO IS THE NEW UI/UX CENTRE OF                ANDROID      (and the path to Pure Android)Boris Chan @borisc / @xtremelabs
Boris Chan @borisc / @xtremelabs
Boris Chan @borisc / @xtremelabs
Boris Chan @borisc / @xtremelabs
Boris Chan @borisc / @xtremelabs
Boris Chan @borisc / @xtremelabs
Boris Chan @borisc / @xtremelabs
Boris Chan @borisc / @xtremelabs
THANK YOU! Ask me anything: @borisc / boris@xtremelabs.comBoris Chan @borisc / @xtremelabs
Upcoming SlideShare
Loading in...5
×

Build Great Apps on Android - Boris Chan - FITC Spotlight Android

967

Published on

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

No Downloads
Views
Total Views
967
On Slideshare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
18
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • Build Great Apps on Android - Boris Chan - FITC Spotlight Android

    1. 1. XTREME LABSBUILDING GREAT APPSIN THE FRAGMENTEDANDROID WORLDBoris Chan (@borisc)Principal, Xtreme Labs (@xtremelabs)June 23, 2012 - FITC Spotlight Android 1
    2. 2. XTREME LABS Leader in Mobile Solutions Toronto, Canada & Palo Alto, CaliforniaBoris Chan @borisc / @xtremelabs
    3. 3. 100% AGILEBoris Chan @borisc / @xtremelabs
    4. 4. SUCCESS ACROSS MULTI-PLATFORMS 300+ 300+ Apps Millio Developed n Downloads BlackBerry and iPhone and Android Windows Mobile Web PlayBook iPad Phone Phone 7 TabletBoris Chan @borisc / @xtremelabs
    5. 5. (@borisc or boris@xtremelabs.com)Boris Chan @borisc / @xtremelabs
    6. 6. BUILDING GREAT APPS IN THE FRAGMENTED ANDROID WORLD (IN 3 PARTS) 1. Tips for Building Great Apps 2. Android Fragmentation and Understanding Holo 3. Putting it All TogetherBoris Chan @borisc / @xtremelabs
    7. 7. 10 THINGS WE LEARNED FROM BUILDING APPS What we talk about when we talk about buildingBoris Chan @borisc / @xtremelabs
    8. 8. #10: THINK MOBILE-FIRST Not just a strategy for disruption.Boris Chan @borisc / @xtremelabs
    9. 9. #9: DESIGN IN SOCIAL BY DEFAULT Friendly, private and intimate.Boris Chan @borisc / @xtremelabs
    10. 10. #8: LATENCY KILLS. You have limited time and resources. Ed Yourdon http://www.flickr.com/photos/yourdon/ 4064143718/Boris Chan @borisc / @xtremelabs
    11. 11. #7: EMBRACE BEAUTY (Holo tells you to do this too)Boris Chan @borisc / @xtremelabs
    12. 12. #6: EMBRACE TOUCH Keep it real.Boris Chan @borisc / @xtremelabs
    13. 13. #5: CREATE THAT A-HA MOMENT Delight your users.Boris Chan @borisc / @xtremelabs
    14. 14. #4: CACHE IS KING Cache all the things. (A lack of speed also kills.)Boris Chan @borisc / @xtremelabs
    15. 15. #3: HAVE PERFECT TIMING “All Get things ready for your users. things entail rising and falling timing. You must be able to discern this.” – Miyamoto MusashiBoris Chan @borisc / @xtremelabs
    16. 16. #2: KNOW YOUR PLATFORMS Understand Android.Boris Chan @borisc / @xtremelabs
    17. 17. #1: KNOW YOUR USERS Get data to build the right thing. Play to yourBoris Chan @borisc / @xtremelabs
    18. 18. ANDROID AND FRAGMENTATIONBoris Chan @borisc / @xtremelabs
    19. 19. ANDROID AND FRAGMENTATION400+ devices that differ in many ways Different dpi and densities, screen sizes (5+!) Different form factors: Tablet/Phone/ Phablets/Content Devices/etc. Different configurations of Hardware/ Software Buttons on physical device.Boris Chan @borisc / @xtremelabs
    20. 20. ANDROID AND FRAGMENTATIONCurrent Android Marketshare 2.2/2.3 is usually the decision... 4.x just at 7%Boris Chan @borisc / @xtremelabs
    21. 21. ANDROID AND FRAGMENTATIONCurrent Android Marketshare Adoption rate not picking fast enough...Boris Chan @borisc / @xtremelabs
    22. 22. ANDROID AND FRAGMENTATIONWhat you should look for: Device manufacturers branch their own versions of Android (Motorola RAZR, Kindle Fire) Also, there are forks: Fire, MIUI, etc. Compatibility Test Suite compliance TL;DR: A tested version of Android can run apps, launch Intents, etc.Boris Chan @borisc / @xtremelabs
    23. 23. HOW DOES ANDROID ATTEMPT TO SOLVE THIS? Enter Holo...Boris Chan @borisc / @xtremelabs
    24. 24. REVIEWING HOLO: An attempt to unify Android UI/UXBoris Chan @borisc / @xtremelabs
    25. 25. HOLO UI PRINCIPLESBoris Chan @borisc / @xtremelabs
    26. 26. ENCHANT MEBoris Chan @borisc / @xtremelabs
    27. 27. REVIEWING HOLOENCHANT ME Real objects are more fun than Delight me in surprising ways buttons and menus Let me make it mine Get to know meBoris Chan @borisc / @xtremelabs
    28. 28. SIMPLIFY MY LIFEBoris Chan @borisc / @xtremelabs
    29. 29. REVIEWING HOLOSIMPLIFY MY LIFE Keep it brief Pictures are faster than words Decide for me but let me have the final say Only show what I need when I need itBoris Chan @borisc / @xtremelabs
    30. 30. REVIEWING HOLOSIMPLIFY MY LIFE I should always know where I am Never lose my stuff If it looks the same, it should act the same Only interrupt me if it’s importantBoris Chan @borisc / @xtremelabs
    31. 31. MAKE ME AMAZINGBoris Chan @borisc / @xtremelabs
    32. 32. REVIEWING HOLOMAKE ME AMAZING Give me tricks that work everywhere It’s not my fault Sprinkle encouragement Do the heavy lifting for me Make important things fastBoris Chan @borisc / @xtremelabs
    33. 33. A QUICK REVIEW OF HOLO AND THEMESUnderstanding Holo as a unified look-and-feel for Android ActionBar is actually their attempt to fix the back stack Provide more guidance on informational hierarchy with their suggestions on categories Language of icons and text to unify how to communicate to users Flat look-and-feel to create a differentiated and unique experience for Android Help enforce forgiveness, direct manipulation, consistency (really helpful on mobile!)Boris Chan @borisc / @xtremelabs 27
    34. 34. A QUICK REVIEW OF HOLO AND THEMESUnderstanding Holo and the Compatibility Standard Provides a predictable, standard look and feel for Android (vs. 2.x) Provides a forward and backwards compatible standard Use themes that are selected based on platform version. Provides a standard and safe-for-use parent styles for customization Apps look and feel should not change when the device (manufacturer or other) themes are Baseline theme and then let Android handle eachBoris Chan @borisc / @xtremelabs 27
    35. 35. HOLO IS THE NEW UI/UX CENTRE OF ANDROIDBoris Chan @borisc / @xtremelabs
    36. 36. ON FRAGMENTATION DURING DESIGN AND DEVELOPMENT(Also, note that this is a companion guide to our afternoon session)Boris Chan @borisc / @xtremelabs
    37. 37. MOST OF THE DESIGN GUIDE IS EASY TO NAVIGATE... (Except the following...)Boris Chan @borisc / @xtremelabs
    38. 38. UNDERSTANDING BACK STACK ONPlacement Hardware at the bottom (in any order), Software button (at the bottom left), Software - tied to app (in the navigation at the top), or other actions that can pop the stack. Hard to learn, but also hard to scan! And Up vs. Back:Boris Chan @borisc / @xtremelabs 27
    39. 39. Up vs. BackBoris Chan @borisc / @xtremelabs 27
    40. 40. Sibling ScreensBoris Chan @borisc / @xtremelabs 27
    41. 41. Unrelated Siblings and the Back StackSibling ScreensBoris Chan @borisc / @xtremelabs 27
    42. 42. Action Bars, Menus and BackwardsCompatibility Hardware Controls Virtual Controls Legacy ControlsBoris Chan @borisc / @xtremelabs 27
    43. 43. Spot the problem for designers... Hardware Controls Why does the action bar look like this on the older phone? - Your favourite designer Virtual Controls Legacy ControlsBoris Chan @borisc / @xtremelabs 27
    44. 44. PURE ANDROIDDon’t mimic UI elements from other platforms Android iOS WP7Boris Chan @borisc / @xtremelabs 27
    45. 45. PURE ANDROIDDon’t carry over platform specific icons Android iOS WP7Boris Chan @borisc / @xtremelabs 27
    46. 46. PURE ANDROIDDon’t hardcode links to other appsBoris Chan @borisc / @xtremelabs 27
    47. 47. PURE ANDROIDDon’t use labeled back buttons on action barsBoris Chan @borisc / @xtremelabs 27
    48. 48. PURE ANDROIDDon’t use right-pointing carets on line itemsBoris Chan @borisc / @xtremelabs 27
    49. 49. COMPARING APPLES AND ANDROIDSiOS is not like Android, most of the time Flat and follow Holo - Holo + fallback to system theme, flat, not skeuomorphism for look-and-feel Follow Pure Android - Don’t confuse the users, make sure the easy stuff is taken care of (use Android icons, Android-style sharing, no right-carets, Android-style table cells, etc.) No on-screen back buttons (they could be up buttons for action bars though) Use action bar as the menu system - iOS needs some form of custom design andBoris Chan @borisc / @xtremelabs 27
    50. 50. DESIGN PATTERNS ARE JUST GUIDELINESYou must be fearless in destroying yourself to progress...Example: Dashboards are being replaced by Sidebar navigationBoris Chan @borisc / @xtremelabs
    51. 51. LIFE WITH THE SUPPORT PACKAGEFocus on the app, worry less about the platform. (But helpexists!) Support Package/Compatibility Library is there to target older versions of Android. Use Fragments if starting from scratch, reduces complicated Activity nesting logic, increases code reuse. (Hello, FragmentActivity!) Configure different layouts for different devices (instead of creating from scratch) that need themBoris Chan @borisc / @xtremelabs 27
    52. 52. LIBRARIES AND PRACTICAL ANDROIDThings to consider when thinking about Holo Everywherepractically... Third party-libraries build upon existing libraries to add more features backwards in Android time ActionBar is a can be a quick drop-in thanks to actionbarsherlock http://actionbarsherlock.com/ Pull to refresh: https://github.com/johannilsson/ android-pulltorefreshBoris Chan @borisc / @xtremelabs 27
    53. 53. ONE MORE THING... Let’s put it all together.Boris Chan @borisc / @xtremelabs
    54. 54. TALKING ABOUT BUILDING APPSThe Countdown...1. Know your users2. Know your platforms 6. Embrace Touch3. Have perfect timing 7. Embrace Beauty4. Cache is King 8. Latency Kills5. Create that A-ha 9. Design in Social byMoment Default 10. Think Mobile-FirstBoris Chan @borisc / @xtremelabs 27
    55. 55. HOLO IS THE NEW UI/UX CENTRE OF ANDROID (and the path to Pure Android)Boris Chan @borisc / @xtremelabs
    56. 56. Boris Chan @borisc / @xtremelabs
    57. 57. Boris Chan @borisc / @xtremelabs
    58. 58. Boris Chan @borisc / @xtremelabs
    59. 59. Boris Chan @borisc / @xtremelabs
    60. 60. Boris Chan @borisc / @xtremelabs
    61. 61. Boris Chan @borisc / @xtremelabs
    62. 62. Boris Chan @borisc / @xtremelabs
    63. 63. THANK YOU! Ask me anything: @borisc / boris@xtremelabs.comBoris Chan @borisc / @xtremelabs
    1. A particular slide catching your eye?

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

    ×