StirTrek

Transcript

1. Friday, May 4, 12
   

   View Slide

2. Friday, May 4, 12
   

   View Slide

3. Friday, May 4, 12
   

   View Slide

4. Friday, May 4, 12
   

   View Slide

5. Friday, May 4, 12
   

   View Slide

6. Friday, May 4, 12
   

   View Slide

7. Friday, May 4, 12
   

   View Slide

8. Friday, May 4, 12
   

   View Slide

9. Friday, May 4, 12
   

   View Slide

10. Friday, May 4, 12
    

    View Slide

11. Friday, May 4, 12
    

    View Slide

12. Friday, May 4, 12
    

    View Slide

13. Friday, May 4, 12
    

    View Slide

14. Friday, May 4, 12
    

    View Slide

15. Friday, May 4, 12
    

    View Slide

16. Friday, May 4, 12
    

    View Slide

17. Friday, May 4, 12
    

    View Slide

18. Friday, May 4, 12
    

    View Slide

19. Friday, May 4, 12
    

    View Slide

20. Friday, May 4, 12
    

    View Slide

21. TIMEOUT
    Friday, May 4, 12
    

    View Slide

22. My website
    Industry magazines
    Long informative comics
    Friday, May 4, 12
    

    View Slide

23. What brings me here
    today is my day job.
    As I was having this
    terrible experience with
    the library I was just
    starting in on my first
    Friday, May 4, 12
    

    View Slide

24. HTML
    Friday, May 4, 12
    

    View Slide

25. >
    In order to have a successful digital
    magazine it had to be better in some
    way to its print counterpart.
    Friday, May 4, 12
    

    View Slide

26. If you look at digital music or books you
    can make the argument that digital is
    better because you can carry around
    thousands of them with ease.
    Friday, May 4, 12
    

    View Slide

27. There were 2 things that we needed to
    understand.
    The first is we had to know the
    differences between these platforms
    (iPad, Android, Windows Phone,
    Blackberry)
    The second is that we had to understand
    how to make a great user experience
    across platforms.
    Friday, May 4, 12
    

    View Slide

28. What is the secret to
    creating a great
    experience?
    Friday, May 4, 12
    

    View Slide

29. S T E P 1
    Find a book you're
    interested in
    Friday, May 4, 12
    

    View Slide

30. S T E P 1 S T E P 2
    Find a book you're
    interested in
    Add book to your cart
    Friday, May 4, 12
    

    View Slide

31. S T E P 1 S T E P 2 S T E P 3
    Find a book you're
    interested in
    Add book to your cart
    Login and Check out
    your book
    Friday, May 4, 12
    

    View Slide

32. S T E P 4
    Get a download link
    Friday, May 4, 12
    

    View Slide

33. S T E P 4 S T E P 5
    Get a download link Boot up Windows
    Friday, May 4, 12
    

    View Slide

34. S T E P 4 S T E P 5 S T E P 6
    Get a download link Boot up Windows
    Download proprietary
    software
    Friday, May 4, 12
    

    View Slide

35. S T E P 7
    Install software
    Friday, May 4, 12
    

    View Slide

36. S T E P 7 S T E P 8
    Install software Get cryptic error
    Friday, May 4, 12
    

    View Slide

37. S T E P 7 S T E P 8 S T E P 9
    Install software Get cryptic error Google cryptic error
    Friday, May 4, 12
    

    View Slide

38. S T E P 1 0
    Learn that you need an
    updated security certificate
    Friday, May 4, 12
    

    View Slide

39. S T E P 1 0 S T E P 1 1
    Learn that you need an
    updated security certificate
    Open Windows Media
    Player
    Friday, May 4, 12
    

    View Slide

40. S T E P 1 0 S T E P 1 1 S T E P 1 2
    Download new security
    certificate
    Learn that you need an
    updated security certificate
    Open Windows Media
    Player
    Friday, May 4, 12
    

    View Slide

41. S T E P 1 3
    Learn that you need to update
    Windows Media Player
    Friday, May 4, 12
    

    View Slide

42. S T E P 1 3 S T E P 1 4
    Learn that you need to update
    Windows Media Player
    Download and Install
    update
    Friday, May 4, 12
    

    View Slide

43. S T E P 1 3 S T E P 1 4 S T E P 1 5
    Learn that you need to update
    Windows Media Player
    Download and Install
    update
    Reboot Windows
    Friday, May 4, 12
    

    View Slide

44. S T E P 1 6
    Start up Overdrive
    Media Player
    Friday, May 4, 12
    

    View Slide

45. S T E P 1 6 S T E P 1 7
    Get another cryptic
    error message
    Start up Overdrive
    Media Player
    Friday, May 4, 12
    

    View Slide

46. S T E P 1 6 S T E P 1 7 S T E P 1 8
    Get another cryptic
    error message
    Insert profanity
    Start up Overdrive
    Media Player
    Friday, May 4, 12
    

    View Slide

47. S T E P 1 9
    Give up on stupid
    library
    Friday, May 4, 12
    

    View Slide

48. S T E P 1 9 S T E P 2 0
    Give up on stupid
    library
    Open Bit torrent site
    Friday, May 4, 12
    

    View Slide

49. S T E P 1 9 S T E P 2 0
    Give up on stupid
    library
    Open Bit torrent site
    S T E P 2 1
    Click download
    Friday, May 4, 12
    

    View Slide

50. S T E P 2 2
    Enjoy your audio book
    Friday, May 4, 12
    

    View Slide

51. Friday, May 4, 12
    

    View Slide

52. Friday, May 4, 12
    

    View Slide

53. Friday, May 4, 12
    

    View Slide

54. Friday, May 4, 12
    

    View Slide

55. Friday, May 4, 12
    

    View Slide

56. Friday, May 4, 12
    

    View Slide

57. Friday, May 4, 12
    

    View Slide

58. Friday, May 4, 12
    

    View Slide

59. Friday, May 4, 12
    

    View Slide

60. Friday, May 4, 12
    

    View Slide

61. Friday, May 4, 12
    

    View Slide

62. se·lect·list
    [si-lekt-list]
    Friday, May 4, 12
    

    View Slide

63. se·lect·list
    [si-lekt-list]
    ???
    Friday, May 4, 12
    

    View Slide

64. Nit-picking
    [nit-pi-king]
    Nitpicking is the act of removing nits
    (the eggs of lice, generally head lice)
    from the host's hair.
    Friday, May 4, 12
    

    View Slide

65. Friday, May 4, 12
    

    View Slide

66. Friday, May 4, 12
    

    View Slide

67. Friday, May 4, 12
    

    View Slide

68. Friday, May 4, 12
    

    View Slide

69. Friday, May 4, 12
    

    View Slide

70. Friday, May 4, 12
    

    View Slide

71. Friday, May 4, 12
    

    View Slide

72. Friday, May 4, 12
    

    View Slide

73. Friday, May 4, 12
    

    View Slide

74. Friday, May 4, 12
    

    View Slide

75. Friday, May 4, 12
    

    View Slide

76. I CLEVELAND
    Friday, May 4, 12
    

    View Slide

77. Friday, May 4, 12
    

    View Slide

78. Friday, May 4, 12
    

    View Slide

79. Friday, May 4, 12
    

    View Slide

80. Friday, May 4, 12
    

    View Slide

81. Friday, May 4, 12
    

    View Slide

82. They don’t care
    Friday, May 4, 12
    

    View Slide

83. What is the secret to
    creating a great
    experience?
    Friday, May 4, 12
    

    View Slide

84. You have to care.
    Friday, May 4, 12
    

    View Slide

85. Friday, May 4, 12
    

    View Slide

86. Friday, May 4, 12
    

    View Slide

87. Friday, May 4, 12
    

    View Slide

88. Friday, May 4, 12
    

    View Slide

89. Friday, May 4, 12
    

    View Slide

90. 
    Username or Email
    class="text-input" id="login" name="login" tabindex="1"
    type="text" value="" />
    
    Friday, May 4, 12
    

    View Slide

91. Instapaper
    Friday, May 4, 12
    

    View Slide

92. Friday, May 4, 12
    

    View Slide

93. Friday, May 4, 12
    

    View Slide

94. 2048 x 1536 1280 x 800 1024 x 600
    iPad Galaxy Tab 10.1
    Kindle Fire
    (1024 x 768)
    Friday, May 4, 12
    

    View Slide

95. Friday, May 4, 12
    

    View Slide

96. Friday, May 4, 12
    

    View Slide

97. Friday, May 4, 12
    

    View Slide

98. Friday, May 4, 12
    

    View Slide

99. Friday, May 4, 12
    

    View Slide

100. Friday, May 4, 12
     

     View Slide

101. Platform Characteristics
     Interfacing with the Hardware
     Interface Design Elements
     Understand Design Patterns
     Best Practices
     Friday, May 4, 12
     

     View Slide

102. tap double tap swipe
     pinch tap and hold
     Friday, May 4, 12
     

     View Slide

103. Interfacing with the
     Hardware
     Friday, May 4, 12
     

     View Slide

104. Friday, May 4, 12
     

     View Slide

105. Friday, May 4, 12
     

     View Slide

106. Friday, May 4, 12
     

     View Slide

107. Friday, May 4, 12
     

     View Slide

108. Friday, May 4, 12
     

     View Slide

109. Friday, May 4, 12
     

     View Slide

110. iPhone Android
     Friday, May 4, 12
     

     View Slide

111. iPhone Android
     Friday, May 4, 12
     

     View Slide

112. iPhone Android
     Friday, May 4, 12
     

     View Slide

113. iPhone Android
     Friday, May 4, 12
     

     View Slide

114. Interface design elements
     Friday, May 4, 12
     

     View Slide

115. Friday, May 4, 12
     

     View Slide

116. Friday, May 4, 12
     

     View Slide

117. Friday, May 4, 12
     

     View Slide

118. Friday, May 4, 12
     

     View Slide

119. Design Patterns
     Friday, May 4, 12
     

     View Slide

120. Friday, May 4, 12
     

     View Slide

121. Friday, May 4, 12
     

     View Slide

122. Friday, May 4, 12
     

     View Slide

123. Friday, May 4, 12
     

     View Slide

124. Friday, May 4, 12
     

     View Slide

125. an accent like a simple one-pixel stroke may
     look terrific on Android devices with a high
     resolution, “then we pull out a handful of older
     devices and it just looks bad.”
     Hipmunk generates its Android assets at
     three resolutions: 1x for older devices, 2x for
     high-resolution devices, and an awkward 1.5x
     resolution for other devices — a necessity to
     avoid “weird artifacting,” as Campos puts it.
     But some developers may skip this high level
     of support for outlier devices, leading to blurry,
     jaggy visuals for an unlucky few.
     http://www.wired.com/gadgetlab/2012/04/easier-design-apps-ios/
     Friday, May 4, 12
     

     View Slide

126. Best Practices
     Friday, May 4, 12
     

     View Slide

127. Don’t let the UI hinder the experience
     Friday, May 4, 12
     

     View Slide

128. Don’t let the UI hinder the experience
     Friday, May 4, 12
     

     View Slide

129. Elevate the content people care about
     Friday, May 4, 12
     

     View Slide

130. Elevate the content people care about
     Friday, May 4, 12
     

     View Slide

131. Elevate the content people care about
     Friday, May 4, 12
     

     View Slide

132. Know where you are
     Friday, May 4, 12
     

     View Slide

133. Seek ’n Spell
     Friday, May 4, 12
     

     View Slide

134. Friday, May 4, 12
     

     View Slide

135. Friday, May 4, 12
     

     View Slide

136. Friday, May 4, 12
     

     View Slide

137. Friday, May 4, 12
     

     View Slide

138. Friday, May 4, 12
     

     View Slide

139. Avoid forcing a user to rotate the device
     Friday, May 4, 12
     

     View Slide

140. Avoid forcing a user to rotate the device
     Friday, May 4, 12
     

     View Slide

141. Avoid creating new touch gestures
     Report adult content to Apple
     Friday, May 4, 12
     

     View Slide

142. Avoid creating new touch gestures
     Friday, May 4, 12
     

     View Slide

143. Avoid help
     Friday, May 4, 12
     

     View Slide

144. http://developer.apple.com/library/ios/#documentation/userexperience/conceptual/mobilehig/Introduction/Introduction.html
     Apple iOS
     http://developer.android.com/guide/practices/ui_guidelines/index.html
     http://developer.android.com/design/index.html
     Android
     http://docs.blackberry.com/en/developers/deliverables/17965/index.jsp?name=UI+Guidelines+-+BlackBerry
     +Smartphones6.0&language=English&userType=21&category=Java+Development+Guidelines&subCategory=
     BlackBerry
     http://msdn.microsoft.com/en-us/library/hh202915(v=VS.92).aspx
     Windows Phone 7
     Friday, May 4, 12
     

     View Slide

145. Friday, May 4, 12
     

     View Slide

146. Friday, May 4, 12
     

     View Slide

147. Friday, May 4, 12
     

     View Slide

148. Friday, May 4, 12
     

     View Slide

149. Friday, May 4, 12
     

     View Slide

150. Friday, May 4, 12
     

     View Slide

151. Friday, May 4, 12
     

     View Slide

152. Friday, May 4, 12
     

     View Slide

153. Friday, May 4, 12
     

     View Slide

154. Friday, May 4, 12
     

     View Slide

155. Friday, May 4, 12
     

     View Slide

156. Thank You
     colbowdesign.com
     @bradcolbow
     Friday, May 4, 12
     

     View Slide

157. speakerdeck.com/u/bcolbow
     colbowdesign.com
     @bradcolbow
     Friday, May 4, 12
     

     View Slide