1. Android Design
Pattern-II

2. Contents
1. Dealing With Data
2. Getting Input
3. Navigation
4. Notifications
5. Personalize
6. Screen Interactions
7. Social

3. Navigation
Ginger Yu

4. Navigation
1. Highlight important functionalities
2. A way through content
3. Move through content
Toggle between different sections or
4.
activities
5. Access to contextual actions
6. Access to general operations

5. Highlight important functionalities
1
• Action Bar
• Dashboard-Catology
• Dashboard-Features

6. Action Bar
1
1.

7. •
•
•
•
Logo
•

8. Action Bar
1
1.
• •
•
• •
+ -

9. 1
1.
Twitter
Market

10. Twitter
1
Twitter
2
Tweets

11. Twitter
3
tweet

12. Dashboard-
2
1.
Catology

13. •
•
•
•
•
•

14. Dashboard-
1.2
Catology
• •
• •
+ -
•

15. Dashboard-Catology
2
1.
Google Place
Documents to Go
Factbook

16. Google Place
1
Google Places

17. Dashboard-Functionalities
3
1.

18. •
•
•
•
•
•

19. Dashboard-Functionalities
3
1.
• •
• •
+ -
•

20. Dashboard-Functionalities
3
1.
Google Place
Documents to Go
Factbook

21. Google Place
1
Google Places

22. Drill Down Navigation
1
2.

23. 1 …
3
2 …

24. Drill Down Navigation
1
2.
• •
•
•
+ -

25. Drill Down Navigation
1
2.
Treintijden light
Dropbox

26. TwitTreintijden light
ter
1 2
Treintijden
light

27. TwitTreintijden light
3

28. List Navigation
2
2.

29. 3
1 2

30. List Navigation
2
2.
• •
+ -

31. List Navigation
2
2.
Shop Savvy
Calorie Counter

32. Shop Savvy
1
Shop
Savvy

33. Segmented control
3
2.

34. 2 …
1 2-5
...
3

35. Segmented control
3
2.
• •
+ -

36. Segmented control
3
2.
Appie - Shops
Appie - my purchases

37. Appie - Shops
1 Appie
2
8

38. Expandable list
4
2.

39. 1 2
•
•

40. Expandable list
4
2.
• •
+ -

41. Expandable list
4
2.
App categories
Browser (Samsung Galaxy S)

42. App categories
1 2
…

43. Mode selector
5
2.

44. 1 3 6
2 7
5
…
4

45. Mode selector
5
2.
• •
•
•
+ -

46. Mode selector
5
2.
Time Mobile
Engadget
Twitter

47. Time Mobile
1
Time Mobile
2
“
”
“Time”logo

48. Time Mobile
3 4
‘ ’
...

49. Time Mobile
5
...
6
...
' '

50. Tabs
6
2.
2-5

51. 1 3
…
2 …
3

52. Tabs
6
2.
• •
•
• 3
+ -

53. Tabs
6
2.
Facebook
Android Market

54. Facebook
1 facebook
2
3
“ ”

55. Facebook
3

56. Windows Shade
7
2.

57. 1
...
3
4
2

58. Windows Shade
7
2.
• •
• •
+ -
• •
•

59. Windows Shade
7
2.
Facebook
Winamp
New York Times

60. Facebook
1 2
Facebook

61. Scroll thumb
8
2.
Facebook

62. 1 3
2

63. 4 5

64. Scroll thumb
8
2.
• •
•
+ -

65. Scroll thumb
8
2.
Facebook
Dropbox
Contacts

66. Facebook
1
Facebook
2

67. Facebook
3 4
Facebook

68. Slideable top navigation
9
2.

69. 2 4 ...
5
1 3

70. Slideable top navigation
9
2.
• •
•
•
•
+ -

71. Slideable top navigation
9
2.
Mashable
Pulse

72. Mashable
1 2
Mashable

73. Mashable
3 4

74. Mashable
5
11

75. Carousel
1
3.

76. 1 1
N
2 3

77. Carousel
1
3.
• •
•
•
+ -

78. Carousel
1
3.
Sportypal
IMDb

79. Sportypal
1
Sportypal

80. Stepping
2
3.

81. 1 3
2 …
4

82. Stepping
2
3.
• •
•
+ -

83. Stepping
2
3.
Engadget
Google goggles tutorial
HTC Sense - RSS reader

84. Engadget
1
Engadget
2
…
/
20

85. Engadget
3

86. Tab bar
1
4.
5

87. 5
3 ...
1 2

88. Tab bar
1
4.
• •
•
•
• 5
+ -
•

89. Tab bar
1
4.
Tunewiki
Engadget

90. Tunewiki
1
Tunewiki
2

91. Context Menu
1
5.
windows

92. 1
2
3

93. Context Menu
1
5.
• •
•
•
+ -
——
•

94. Context Menu
1
5.
Gmail
Evernote

95. Gmail
1
Gmail
2

96. Quick actions
2
5.
Gmail

97. 3
1
2

98. Quick actions
2
5.
• •
•
•
+ -

99. Quick actions
2
5.
Twitter
Samsung Galaxy S
Contacts
TaskKiller Free

100. Twitter
1
Twitter android
2
tweet tweet
tweets

101. Swipe for action
3
5.
“ ”

102. 3
1 2

103. Swipe for action
3
5.
• •
• •
•
•
•
+ -
•
•

104. Swipe for action
3
5.
Twitter
Samsung Galaxy S - List with
contacts

105. Twitter
1 2 5
tweets

106. Twitter
3 4

107. Twitter
5 6
...

108. Options menu
1
6.
6
6
“ ”

109. 2 1-6
2-3
1 ' '

110. Options menu
1
6.
• •
-
-
•
•
+ -

111. Options menu
1
6.
gStrings
Shuffle
Gmail

112. gStrings
1
GString
3

113. Expanded options menu
2
6.
6

114. 1 2 1-6
4
3 ”
6
“

115. Expanded options menu
2
6.
• •
•
+ -

116. Expanded options menu
2
6.
Astro
Google maps

117. Astro
1 2
Astro
6
“ ”
...

118. Toolbar
3
6.
5
“ ”

119. 1 5
2

120. Toolbar
3
6.
• •
+ -

121. Toolbar
3
6.
Wapedia
Skyfire Browser
Google Places

122. Wapedia
1
Wapedia
2
...