An introduction to the differences are between designing for iOS and Android.

1. Designing For Android
Dropping iOS Patterns
@jsonfry

2. What?
•
•
Designing Specifically for Android
How it differs from iOS design

3. What you might
already know?

4. Basics of designing for
small touch screens
•
•
•
•
•
Large tap area, don’t make tiny buttons
Prioritise content
Minimal user input
Intermittent connectivity
(Have used an Android device)

5. Back To Android

6. Android Design is NOT:

7. Android Design is NOT:

8. Android Design is NOT:

9. Why?
•
Users’ Learnt Behaviours

10. Side Note
•
Don’t make a soft iOS style
back button
•
Up button

11. Side Note
•
Don’t make a soft iOS style
back button
•
Up button

12. Why?
•
Users’ Learnt Behaviours

13. View Stack

14. bit.
View Stack
ly/i
nte
nts
2

15. View Stack
•
•
Like Browser Back Button
Subtle Animations

16. Up Button

17. Up Button

18. Up Button

19. Up Button

26. So what then?

27. Navigation Drawers &
Action Bars!

28. Navigation Drawer

29. Navigation Drawer

30. Navigation Drawer
er
raw
avd
y/n
it.l
b

31. Action Bar

32. Action Bar

33. Action Bar

34. Where are tabs useful?

40. Other ways to
filter content

41. View Control

42. View Control

43. Icons

44. Icons
•
•
•
App Icon
Notification Icon
Context Menu Icons

45. Icons
•
•
•
App Icon
Notification Icon
Context Menu Icons
icons
android
bit.ly/

46. Icons
•
•
•
App Icon
icons
android
bit.ly/
Notification Icon
Context Menu Icons
bit.ly/assetstudio

47. Loading Modal Dialogs

49. Other Modal Dialogs

52. NO!

53. NO!

54. Toasts

57. Status Bar Notifications

59. Ongoing Notifications
•
•
Anything in the background
E.g.
•
•
•
Music
Downloading
Updating status

60. ngoing Notifications
•
•
Anything in the background
E.g.
•
•
•
Music
Downloading
Updating status

61. Ambient Notifications

62. Expanding Notifications

63. Expanding Notifications

64. Lists

69. Different
Screen Sizes & Densities

70. Different
Screen Sizes & Densities
screens
ndroid
bit.ly/a

77. Other Little Extras

78. Other Little Extras
•
•
•
Don’t use a splash screen
Don’t use full screen
Double tap is only used for zooming

79. Other Little Extras
•
•
•
Don’t use a splash screen
Don’t use full screen
bit.ly/A
Double tap is only used for zooming ndroidDesig
nGuide
lines

80. Thanks!
•
jasonfry.co.uk
•
@jsonfry