android ui/ux design - best practices

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

Upload: andrei-catinean

Post on 28-Jan-2015

131 views

Category:

Technology


2 download

DESCRIPTION

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

Page 1: Android UI/UX design - Best Practices

CASE STUDY: ANDROID UI/UX DESIGN - BEST PRACTICES

Eugeniu [email protected]@gmail.com

Andrei [email protected]@gmail.com

Page 2: Android UI/UX design - Best Practices

AGENDA

UI PatternsCase study

Page 3: Android UI/UX design - Best Practices

WHY?

Page 4: Android UI/UX design - Best Practices

WHY?

Simplicity

Images provided by Androidify.com

Page 5: Android UI/UX design - Best Practices

WHY?

BeautySimplicity

Images provided by Androidify.com

Page 6: Android UI/UX design - Best Practices

WHY?

BeautySimplicity Functionality

Images provided by Androidify.com

Page 7: Android UI/UX design - Best Practices

AMAZING APP !!!

Images provided by Androidify.com

Page 8: Android UI/UX design - Best Practices

AGENDA

UI PatternsCase study

Page 9: Android UI/UX design - Best Practices

ACTION BAR

Page 10: Android UI/UX design - Best Practices

ACTION BAR

Main action bar

Page 11: Android UI/UX design - Best Practices

ACTION BAR

Contextual action bar

Page 12: Android UI/UX design - Best Practices

ACTION BAR

Bottom action bar

Page 14: Android UI/UX design - Best Practices

Jake’s WhartonActionBarSherlock

http://actionbarsherlock.com/

Page 15: Android UI/UX design - Best Practices

VIEW PAGER &TAB INDICATOR

Page 16: Android UI/UX design - Best Practices

FLY-IN APP MENUSLIDE-OUT MENUSIDE NAVIGATIONSLIDE MENU...

Page 17: Android UI/UX design - Best Practices

Cyril’s MottierFly-in app menu

http://android.cyrilmottier.com

Page 18: Android UI/UX design - Best Practices

AGENDA

UI PatternsCase study

Page 19: Android UI/UX design - Best Practices

CASE STUDYSTIRILE PROTV.RO

Page 20: Android UI/UX design - Best Practices

?

Page 21: Android UI/UX design - Best Practices

?

Page 22: Android UI/UX design - Best Practices
Page 23: Android UI/UX design - Best Practices
Page 24: Android UI/UX design - Best Practices

?

Page 25: Android UI/UX design - Best Practices
Page 26: Android UI/UX design - Best Practices
Page 27: Android UI/UX design - Best Practices
Page 28: Android UI/UX design - Best Practices
Page 29: Android UI/UX design - Best Practices

WRAPPING UP

Page 30: Android UI/UX design - Best Practices

WRAPPING UP

Simple + Beautiful + Functional = Amazing

Page 31: Android UI/UX design - Best Practices

WRAPPING UP

Simple + Beautiful + Functional = Amazing

Common UI patterns for design and navigation

Page 32: Android UI/UX design - Best Practices

WRAPPING UP

Simple + Beautiful + Functional = Amazing

Common UI patterns for design and navigation

Originality ≠ Breaking consistency

Page 33: Android UI/UX design - Best Practices

WRAPPING UP

Simple + Beautiful + Functional = Amazing

Common UI patterns for design and navigation

Originality ≠ Breaking consistency

Native components!

Page 34: Android UI/UX design - Best Practices

QUESTIONS ?