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.

Transcript

1. CASE STUDY: ANDROID UI/UX DESIGN - BEST PRACTICES
   Eugeniu Arbuleac
   @arbuleac
   arbuleac.ev@gmail.com
   Andrei Catinean
   @electryc
   andrei.catinean@gmail.com
   

   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
    arbuleac.ev@gmail.com
    Andrei Catinean
    @electryc
    andrei.catinean@gmail.com
    

    View Slide