Presentation from WebVisions 2011

1. The Mobile FrontierWebVisions 2011 Rachel Hinman Senior Research Scientist Nokia Research Lab Palo Alto, California USA Twitter: @Hinman Title

2. Mobile = Wild West

3. A

4. Do you remember a time… Do you remember a time when the web was new? Q: A

5. Do you remember a time… “We need a web presence!” ! A

6. 6 Solution: Brochure - online Brochureware

7. “we need a web presence” “We need online commerce!” ! A

8. 8 Online commerce What about shipping?

9. Make it like the world “Let’s make our site like…” ! A A

10. 10 Southwest airlines

11. Hypothesis vs. Agenda The Rearview Mirror

12. Hypothesis vs. Agenda Even in situations in which a spirit of exploration and freedom exist, where faculty are free to experiment to work beyond physical and social constraints, our cognitive habits often get in the way. Marshall McLuhan called it “the rear-view mirror effect,” noting that “We see the world through a rear-view mirror. We march backwards into the future.” Even in situations in which a spirit of exploration and freedom exist, where faculty are free to experiment to work beyond physical and social constraints, our cognitive habits often get in the way. Marshall McLuhan called it“the rear-view mirror effect,” noting that“We see the world through a rear-view mirror. We march backwards into the future.”

13. Hypothesis vs. Agenda

14. Hypothesis vs. Agenda

15. Hypothesis vs. Agenda

16. Hypothesis vs. Agenda

17. A Do you remember a time… The definition of insanity is doing the same thing over and over and expecting different results.

18. 18 Mobile presents an opportunity to invent new ways… Opinion! Mobile presents an opportunity to invent new ways for users to interact with information.

19. A mobile phone is not a computer 19

20. umm…. duh! A Um… duh!

22. 22 iPhone Mobile phones aren’t really phones anymore

23. 23 iPhone

25. Hypothesis vs. Agenda Mobile Devices are the Gateway Drug for Ubicomp

26. Hypothesis vs. Agenda Following toddlers into the future

27. Mobile = Wild West

28. Where to Look?

29. Great Mobile user experiences Emergent Mobile UX Topics 1 Contextual Computing 2 A Brave NUI World 3 Shapeshifting

30. Contextual Computing

31. Pictures of mobile contexts What exactly do you mean by mobile “context” ? Q: A

32. Pictures of mobile contexts A

33. More pictures of mobile contexts

34. Social context

35. Context is complex Context is complex! ! A

36. Context is about understanding human relationships to the people,places and things in the world. A Context is about understanding the relationships

37. 37 Context Framework Context Framework steal this slide!

38. 38 Context Framework Context Framework steal this slide!

39. 39 Relationships Chording Orchestration and Inflection

40. 40 Peanut butter

41. 41 Google: Facebook Spatial

42. 42 Temporal Temporal

43. Spatial - peanut butter Social 43

44. Google: Facebook Semantic 44

45. 45 Peanut butter in Denver Peanut butter in Melbourne right now?

46. The web is good at people and things. The web is good at semantic relationships. (and okay at social relationships) A Context is about understanding the relationships

47. Context Framework Mobile is good at places… steal this slide! 47

48. Context Framework Mobile is good at spatial and temporal relationships. steal this slide! 48

49. 49 Google maps - PC vs. Mobile

50. Temporal and spatial relationships are underserved There are currently not many technologiesthat help us understand place, and temporal and spatial relationships. 50

58. What we learned from the web Contextual Computing Questions What is the “URL” for place? How might we break our 1:1 relationship with devices? Nature of the relationship between devices? Instead of burrowing into the world behind the LCD screen, how can devices help us connect us to the world around us?

59. 59 Wireframe A Brave NUI World

60. 60 Differences in the mobile environment Seated in a relatively predictable environment Large screen enables multi-tasking Keyboard and a mouse for input

61. 61 Wireframe We’re reaching the edges of what GUI can do

62. 62 Wireframe

63. Hypothesis vs. Agenda

64. Hypothesis vs. Agenda

65. 65 Wireframe

66. 66 Wireframe steal this slide!

67. 67 Wireframe It’s not longer “what you see it what you get…”

68. 68 Wireframe …now it’s “what you do is what you get”

69. 69 Wireframe Different platforms express characteristics differently

70. Paper Prototype example GUI = Computer as tool, NUI = Computer as Media 70

71. 71 Wireframe GUI = Metaphorics, containment and place

72. 72 Wireframe NUI = Fluid, Unmediated, and Organic

73. Paper Prototype example GUIs = Heavy Chrome, Icons & Buttons 73

74. NUIs = Let the Content be the Star 74 It’s like a game of cards

75. Paper Prototype example SCROLL GUI = “Desktop” and “Pages” as Anchors 75

76. NUIs Can Feel Anchor-less 76

77. Paper Prototype example [ ] + = 77

78. Paper Prototype example = 78

79. What we learned from the web Animation & TransitionsA new design elements that can: steal this slide! Reinforce cognition. Help users form a mental model of how information will “unfold”. Provide cues for interaction. Help make your experience feel more intuitive for users.

80. Say Goodbye to Done 80 Wireframe

81. This should look familiar… 81 Wireframe

82. 82 Wireframe This should look familiar… The web has evolved around a task-efficiency model. Mobile is different.

83. 83 Mobile is different Mobile is different…. Mobile is about pivoting people through information quickly. It’s about exposing possibilities.

84. What’s the point? “What can happen?” “What’s the point?” TASK POSSIBILITIES

85. Tasks are about completion… 85 Tasks are about completion

86. 86 Tasks are about completion Tasks are about completion… Possibilities are interactions that accrue over time…

87. Tasks are about completion… Possibilities are interactions that accrue over time… … or facilitate exploration… 87 Tasks are about completion

88. … or facilitate exploration… 88 Tasks are about completion Tasks are about completion… Possibilities are interactions that accrue over time… ..or are about SENSING INTENT!

89. 89 Example -

90. 90 Example -

91. 91 Example -

92. 92 Example -

93. 93 Example -

94. 94 Example -

95. What we learned from the web Brave NUI World Questions What’s beyond tasks? What’s after “computer as media”? How can we create interfaces that sense intent without going to the creepy “Hal” place? Can information objects be defined less by how they are and more by how they move?

96. Shape Shifting

97. We can annotate expectations in the web world 97

99. How do you make interfaces that speak their power A 99

100. A 100

101. A 101

102. Hypothesis vs. Agenda

103. Hypothesis vs. Agenda

104. Hypothesis vs. Agenda

105. Hypothesis vs. Agenda

106. Hypothesis vs. Agenda

108. Paper Prototype example 108

109. How do you make interfaces that speak their power A 109

110. How do you make interfaces that speak their power A 110

115. In reality… people’s lives are messy

116. Through Lines

117. Good luck

118. Good luck

119. Good luck

120. What we learned from the web Shapeshifting Questions What’s after the desktop and “web pages”? Are metaphors dead? If not, can we get beyond our “lizard brain” need for physicality? How might we enable convergence with existing technology? Is retiring old technology the price of entry?

121. Great Mobile user experiences Emergent Mobile UX Topics 1 Contextual Computing 2 A Brave NUI World 3 Shapeshifting

122. Shift your perspective and point of view “The rapid development of cell phones is killing early cell phones much faster than it's killing any of the early, older legacy technologies. I think that is a real principle... something you have to understand if you're going to be in this line of work. It's very romantic. It's very fast moving. You are building dead lumps of plastic.When people come out and they show you an iPhone, or an Android... they are showing you larval versions of something much more sophisticated. The world you are building right now is the ground floor for something much larger -- and the soil beneath that ground floor is violently unstable.” -- Mobile Monday Amsterdam – November 2008 Rapid Evolution 122

123. Thank you! Email: rachel.hinman@nokia.com Thanks, and next up…

124. The Mobile Frontier A Guide for Designing Mobile Experiences Expected Publication: late 2011