@fernando_cejaswww.fernandocejas.com
Who am I?• Barcelona GDG Organizer• NFC, Android and Agile Geek• Android10.org• NFC Actions App• Flojack (@flomio)• @ferna...
Agenda•   User Interface•   User Experience•   Usability•   Android Design Patterns•   Examples•   Advices
WTF?
WTF?
WTF?
What is User Interface? (UI)• A common boundary or surface between the  interactive system and the user• All elements whic...
Elements of a User Interface
What is User Interface Design?• User interface design is the process of  supporting the tasks (goals) of the user,  ideall...
What about User Experience (UX)?• “A person’s perceptions and responses that  result from the use or anticipated use of a ...
What is Usability?• Usability means that a person using a system  finds it easy to understand and use• A usable system all...
Usability Iceberg                     Visuals                     Cues, feedback,                     and aestheticsIntera...
Android Design Patterns
What is a Design Pattern?• It’s a design solution to a recurring problem• It’s also about not reinventing the wheel.• Peop...
Things change… Isn’t it?
Ice Cream Sandwich! Android 4.0• A big quality step• Mature, stable and elegant
For Smartphones and Tablets• Different devices have different usability
Android Main Themes• Holo Light and Holo Dark
Gestures
Application Structure
Application Structure
Navigation with Back and Up
Action Bar
Action Bar• Consider split it when  having many elements
Multi-pane Layouts
Multi-pane Layouts
Swipe Views• Navigate with gestures through the content
Contextual Action Bar
Sliding Menu• Replaces the dashboard? (deprecated?)
Pure Android
ActionBarSherlock
UI/UX Examples        Beautiful… Sweeeet!!!!
UI/UX Examples
UI/UX Examples
UI/UX Examples
Useful Links• Android Design Official• ActionBar Sherlock• Nine Old Androids• Android UI Patterns
Some advice…• Dont port the UI from other platforms• Dont override the behavior of system buttons• Know your user and get ...
Any questions?
Thanks!When you look at the dark side, careful you must be ... for the dark side looks back.             @fernando_cejas  ...
Upcoming SlideShare
Loading in...5
×

Android Design Patterns

4,407

Published on

Android UX-UI Design Patterns Introduction

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

No Downloads
Views
Total Views
4,407
On Slideshare
0
From Embeds
0
Number of Embeds
5
Actions
Shares
0
Downloads
0
Comments
0
Likes
21
Embeds 0
No embeds

No notes for slide

Transcript of "Android Design Patterns"

  1. 1. @fernando_cejaswww.fernandocejas.com
  2. 2. Who am I?• Barcelona GDG Organizer• NFC, Android and Agile Geek• Android10.org• NFC Actions App• Flojack (@flomio)• @fernando_cejas• http://www.fernandocejas.com/
  3. 3. Agenda• User Interface• User Experience• Usability• Android Design Patterns• Examples• Advices
  4. 4. WTF?
  5. 5. WTF?
  6. 6. WTF?
  7. 7. What is User Interface? (UI)• A common boundary or surface between the interactive system and the user• All elements which provide communication between the interactive system and the user
  8. 8. Elements of a User Interface
  9. 9. What is User Interface Design?• User interface design is the process of supporting the tasks (goals) of the user, ideally in a friendly and articulate manner
  10. 10. What about User Experience (UX)?• “A person’s perceptions and responses that result from the use or anticipated use of a product, interactive system, or service.” –ISO9241-210
  11. 11. What is Usability?• Usability means that a person using a system finds it easy to understand and use• A usable system allows a person to focus on their tasks, and not on the system itself• A usable system most often does what a! person expects
  12. 12. Usability Iceberg Visuals Cues, feedback, and aestheticsInteractionTechniquesKeyboard and mousemappings, menus,feedback, etc.
  13. 13. Android Design Patterns
  14. 14. What is a Design Pattern?• It’s a design solution to a recurring problem• It’s also about not reinventing the wheel.• People want to use what they have learnt already using the phone
  15. 15. Things change… Isn’t it?
  16. 16. Ice Cream Sandwich! Android 4.0• A big quality step• Mature, stable and elegant
  17. 17. For Smartphones and Tablets• Different devices have different usability
  18. 18. Android Main Themes• Holo Light and Holo Dark
  19. 19. Gestures
  20. 20. Application Structure
  21. 21. Application Structure
  22. 22. Navigation with Back and Up
  23. 23. Action Bar
  24. 24. Action Bar• Consider split it when having many elements
  25. 25. Multi-pane Layouts
  26. 26. Multi-pane Layouts
  27. 27. Swipe Views• Navigate with gestures through the content
  28. 28. Contextual Action Bar
  29. 29. Sliding Menu• Replaces the dashboard? (deprecated?)
  30. 30. Pure Android
  31. 31. ActionBarSherlock
  32. 32. UI/UX Examples Beautiful… Sweeeet!!!!
  33. 33. UI/UX Examples
  34. 34. UI/UX Examples
  35. 35. UI/UX Examples
  36. 36. Useful Links• Android Design Official• ActionBar Sherlock• Nine Old Androids• Android UI Patterns
  37. 37. Some advice…• Dont port the UI from other platforms• Dont override the behavior of system buttons• Know your user and get feedback from him• Test on real users, early and often• Do what the user expects• The most common operations should be visible• Dont reinvent the wheel
  38. 38. Any questions?
  39. 39. Thanks!When you look at the dark side, careful you must be ... for the dark side looks back. @fernando_cejas www.fernandocejas.com

×