Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Android UI/UX design - Best Practices

Android UI/UX design - Best Practices

Me and my friend Eugen Arbuleac presented at Droidcon Bucharest 2012 the way you can take advantage of native Android components together with the latest innovations in mobile design in order to make your app not just useful, but great. As a case study, we will take an autochthonous app from Google Play and will give it a new twist.

Andrei Catinean

November 03, 2012
Tweet

More Decks by Andrei Catinean

Other Decks in Technology

Transcript

  1. CASE STUDY: ANDROID UI/UX DESIGN - BEST PRACTICES
    Eugeniu Arbuleac
    @arbuleac
    [email protected]
    Andrei Catinean
    @electryc
    [email protected]

    View Slide

  2. AGENDA
    UI Patterns
    Case study

    View Slide

  3. WHY?

    View Slide

  4. WHY?
    Simplicity
    Images provided by Androidify.com

    View Slide

  5. WHY?
    Beauty
    Simplicity
    Images provided by Androidify.com

    View Slide

  6. WHY?
    Beauty
    Simplicity Functionality
    Images provided by Androidify.com

    View Slide

  7. AMAZING APP !!!
    Images provided by Androidify.com

    View Slide

  8. AGENDA
    UI Patterns
    Case study

    View Slide

  9. ACTION BAR

    View Slide

  10. ACTION BAR
    Main action bar

    View Slide

  11. ACTION BAR
    Contextual action bar

    View Slide

  12. ACTION BAR
    Bottom action bar

    View Slide

  13. http://developer.android.com/design/patterns/actionbar.html

    View Slide

  14. Jake’s Wharton
    ActionBarSherlock
    http://actionbarsherlock.com/

    View Slide

  15. VIEW PAGER
    &
    TAB INDICATOR

    View Slide

  16. FLY-IN APP MENU
    SLIDE-OUT MENU
    SIDE NAVIGATION
    SLIDE MENU
    ...

    View Slide

  17. Cyril’s Mottier
    Fly-in app menu
    http://android.cyrilmottier.com

    View Slide

  18. AGENDA
    UI Patterns
    Case study

    View Slide

  19. CASE STUDY
    STIRILE PROTV.RO

    View Slide

  20. ?

    View Slide

  21. ?

    View Slide

  22. View Slide

  23. View Slide

  24. ?

    View Slide

  25. View Slide

  26. View Slide

  27. View Slide

  28. View Slide

  29. WRAPPING UP

    View Slide

  30. WRAPPING UP
    Simple + Beautiful + Functional = Amazing

    View Slide

  31. WRAPPING UP
    Simple + Beautiful + Functional = Amazing
    Common UI patterns for design and navigation

    View Slide

  32. WRAPPING UP
    Simple + Beautiful + Functional = Amazing
    Common UI patterns for design and navigation
    Originality ≠ Breaking consistency

    View Slide

  33. WRAPPING UP
    Simple + Beautiful + Functional = Amazing
    Common UI patterns for design and navigation
    Originality ≠ Breaking consistency
    Native components!

    View Slide

  34. QUESTIONS ?

    View Slide

  35. THANK YOU !
    Eugeniu Arbuleac
    @arbuleac
    [email protected]
    Andrei Catinean
    @electryc
    [email protected]

    View Slide