Final virtual seminar_mobile_frontier
-
Upload
rachel-hinman -
Category
Technology
-
view
106 -
download
0
description
Transcript of Final virtual seminar_mobile_frontier
![Page 1: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/1.jpg)
The Mobile Frontier
Rachel Hinman Senior Research Scientist Nokia Research Lab Palo Alto, California USA
Hinman
![Page 2: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/2.jpg)
I used to be a web designer, too!
2
![Page 3: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/3.jpg)
Mobile has arrived…
![Page 4: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/4.jpg)
Mobile = Wild West
![Page 5: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/5.jpg)
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.”!
“Hey, I’ve got this great idea for an app…”
![Page 6: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/6.jpg)
![Page 7: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/7.jpg)
![Page 8: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/8.jpg)
![Page 9: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/9.jpg)
The Rearview Mirror Effect
![Page 10: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/10.jpg)
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 we are free to experiment and 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.”
![Page 11: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/11.jpg)
11!
Mobile presents an
opportunity to invent new ways for users to interact with information.
![Page 12: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/12.jpg)
![Page 13: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/13.jpg)
Where to Look?
![Page 14: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/14.jpg)
Shapeshifting 1
A Brave NUI World
Comfortable Computing
Emergent Mobile Topics
2
3
![Page 15: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/15.jpg)
Shapeshifting 1
A Brave NUI World
Comfortable Computing
Emergent Mobile Topics
2
3
![Page 16: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/16.jpg)
Shapeshifting
![Page 17: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/17.jpg)
![Page 18: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/18.jpg)
18!
![Page 19: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/19.jpg)
“We made the web in the image of ourselves, and in the U.S., that means OBESE.”
~Jason Grigsby
![Page 20: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/20.jpg)
A!
20!
![Page 21: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/21.jpg)
21!
![Page 22: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/22.jpg)
Q:!
“I think a lot of web design in the past five to ten years is actually just a reflection of print again. We’ve been designing for one context, which isn’t much better than a PDF document.”
~ Bryan Rieger
Q:
22!
![Page 23: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/23.jpg)
Q:!
“Our obsession with layout (carried over from print design) keeps us from seizing much bigger opportunities on mobile.”
~ Luke Wroblewski
Q:
23!
![Page 24: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/24.jpg)
24!
![Page 25: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/25.jpg)
Shapeshifting
![Page 26: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/26.jpg)
Plans & Situated Action
Mutual Reconfiguration
![Page 27: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/27.jpg)
![Page 28: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/28.jpg)
Q:!
Suchman’s theory of mutual reconfiguration suggests a person’s capacity to act (their agency) is reconfigured when it comes into contact with another thing or person - that human action is constantly constructed and reconstructed from dynamic interactions with the material and social worlds.
Q:
![Page 29: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/29.jpg)
![Page 30: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/30.jpg)
30
![Page 31: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/31.jpg)
Q:! Two Design Implications
Q:
![Page 32: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/32.jpg)
Q:!
Q:
1. Shift in contextual assumptions
![Page 33: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/33.jpg)
Q:!
Q:
2. Shift in our sensibilities around content as a design material
![Page 34: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/34.jpg)
Q:!
Q:
1. Shift in contextual assumptions
![Page 35: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/35.jpg)
![Page 36: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/36.jpg)
![Page 37: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/37.jpg)
![Page 38: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/38.jpg)
![Page 39: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/39.jpg)
![Page 40: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/40.jpg)
![Page 41: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/41.jpg)
A!
![Page 42: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/42.jpg)
A!
Throughout the design process, our work should be situated in the contexts where it will be used.
![Page 43: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/43.jpg)
Go to the Gemba
![Page 44: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/44.jpg)
Go to the Gemba
![Page 45: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/45.jpg)
Go to the Gemba
![Page 46: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/46.jpg)
Q:!
Q:
2. Shift in our sensibilities around content as a design material
![Page 47: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/47.jpg)
![Page 48: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/48.jpg)
Design as the manipulation of materials.
![Page 49: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/49.jpg)
Q:!
Q:
Pages and screens are not our design material
![Page 50: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/50.jpg)
Content as a design material.
![Page 51: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/51.jpg)
Q:!
“Right now many designers end up focusing a lot of energy on the overlying view – the whole template and look and feel. But the smaller the screen gets, the less that stuff matters.
One of the most important things we’ve started looking at is writing and working with APIs rather than designing ‘pages’ for one context.”
~Stephanie Rieger
Q:
![Page 52: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/52.jpg)
Q:!
“For so much digital content, there is no good metaphor to render anymore – the content is just information, text and images – so new approaches to interaction and visual UI design are needed.”
~Mike Kruzeniski
![Page 53: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/53.jpg)
![Page 54: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/54.jpg)
![Page 55: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/55.jpg)
![Page 56: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/56.jpg)
![Page 57: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/57.jpg)
![Page 58: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/58.jpg)
How?
![Page 59: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/59.jpg)
2 steps
![Page 60: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/60.jpg)
1.
![Page 61: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/61.jpg)
A!
Think of ways to integrate context considerations into your design process.
![Page 62: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/62.jpg)
62!
Text entry will never be easy!
Ideate in the wild…
![Page 63: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/63.jpg)
Test prototypes with users
early and often
![Page 64: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/64.jpg)
Modifications to your design process will be necessary.
![Page 65: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/65.jpg)
2.
![Page 66: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/66.jpg)
![Page 67: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/67.jpg)
![Page 68: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/68.jpg)
Lead with the content
![Page 69: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/69.jpg)
?
![Page 70: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/70.jpg)
Shapeshifting 1
A Brave NUI World
Comfortable Computing
Emergent Mobile Topics
2
3
![Page 71: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/71.jpg)
71!
![Page 72: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/72.jpg)
72!
Seated in a relatively predictable environment
Large screen enables multi-tasking
Keyboard and a mouse for input
![Page 73: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/73.jpg)
73!
We’re reaching the edges of what GUI can do
![Page 74: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/74.jpg)
74!
![Page 75: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/75.jpg)
75!
GUIs become brittle on a mobile device
![Page 76: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/76.jpg)
![Page 77: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/77.jpg)
![Page 78: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/78.jpg)
78!
![Page 79: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/79.jpg)
79!
![Page 80: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/80.jpg)
Key differences between NUI and GUI
![Page 81: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/81.jpg)
Defining Attributes of
GUIs…
![Page 82: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/82.jpg)
82!
GUI Mental Model = Computer as tool
![Page 83: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/83.jpg)
83!
GUI = Recognition “What you see is what you get”
![Page 84: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/84.jpg)
84!
GUI = Metaphorics, containment and place
![Page 85: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/85.jpg)
85!
GUIs = Heavy Chrome, Icons & Buttons
![Page 86: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/86.jpg)
Defining Attributes of
NUIs…
![Page 87: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/87.jpg)
87!
NUI Mental Model = Computer as media
![Page 88: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/88.jpg)
88!
NUI = Intuition “What you do is what you get”
![Page 89: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/89.jpg)
89!
NUI = Fluid, Unmediated, and Organic
![Page 90: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/90.jpg)
NUIs = Content is the Star
90!
![Page 91: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/91.jpg)
91!
GUI = Experiences are anchored
![Page 92: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/92.jpg)
92!
NUI = Experiences Unfold
![Page 93: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/93.jpg)
93!
NUIs Unfold Like a Game
![Page 94: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/94.jpg)
94!
NUIs Can Feel Anchor-less
![Page 95: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/95.jpg)
95
![Page 96: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/96.jpg)
The Nested Doll Pattern 1
Mobile Experiences Unfold Patterns for how mobile experiences unfold and progressively reveal their nature
The Hub and Spoke Pattern 2
The Bento Box Pattern 3
The Filtered View Pattern 4
![Page 97: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/97.jpg)
97!
Nested Doll Pattern
![Page 98: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/98.jpg)
98!
Hub and Spoke Pattern
![Page 99: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/99.jpg)
99!
Bento Box Pattern
![Page 100: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/100.jpg)
100!
Filtered View Pattern
![Page 101: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/101.jpg)
The Nested Doll Pattern 1
Mobile Experiences Unfold Patterns for how mobile experiences unfold and progressively reveal their nature
The Hub and Spoke Pattern 2
The Bento Box Pattern 3
The Filtered View Pattern 4
![Page 102: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/102.jpg)
A!
102!
Trick to unfolding =
Information boulders to pebbles
![Page 103: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/103.jpg)
A!
103
![Page 104: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/104.jpg)
A!
104
![Page 105: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/105.jpg)
Your Design Challenge! From GUI to NUI
105!
![Page 106: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/106.jpg)
Your Design Challenge! From GUI to NUI
Identify an interaction sequence you’d like to recreate using NUI principles.
Sketch out the interaction using the templates provided.
Identify how you’d like your mobile experience to unfold.
1
2
3
106!
![Page 107: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/107.jpg)
107!
![Page 108: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/108.jpg)
108!
![Page 109: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/109.jpg)
109!
REMEMBER! It’s easy to go crazy and try to do it all. Instead, focus on applying what we’ve covered…
Understanding the differences between graphical and natural user interfaces.
Experimenting with how your mobile experience can unfold and and progressively reveal its nature.
Play around with the unfolding patterns that have been presented… or invent some of your own.
![Page 110: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/110.jpg)
110
![Page 111: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/111.jpg)
111!
Paper In-Screen Prototypes
Following Process documented by Diego Pulido via UX Magazine – Paper In-Screen Prototypes Photos courtesy of Diego Pulido and UX Magazine
![Page 112: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/112.jpg)
1. Sketch screen layouts. ! ! !! !
Photo courtesy of Diego Pulido and UX Magazine 112
![Page 113: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/113.jpg)
1. Sketch screen layouts. 2. Scan or photograph the sketches.
Photo courtesy of Diego Pulido and UX Magazine 113
![Page 114: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/114.jpg)
1. Sketch screen layouts. 2. Scan or photograph the sketches.
3. Making sizing adjustments to the files.
Photo courtesy of Diego Pulido and UX Magazine!114
![Page 115: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/115.jpg)
4. Save the resized images in a file format supported by the mobile device. Be mindful of the sequencing of your screens and label files accordingly.
Photo courtesy of Diego Pulido and UX Magazine 115
![Page 116: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/116.jpg)
116!
4. Save the resized images in a file format supported by the mobile device. Be mindful of the sequencing of your screens and label files accordingly.
5. Import the files into the mobile device’s photo gallery.
Photo courtesy of Diego Pulido and UX Magazine!
![Page 117: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/117.jpg)
Paper Prototype example!
117!
4. Save the resized images in a file format supported by the mobile device. Be mindful of the sequencing of your screens and label files accordingly.
5. Import the files into the mobile device’s photo gallery.
6. Click and swipe away.
Photo courtesy of Diego Pulido and UX Magazine
![Page 118: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/118.jpg)
Q:!
Q:
![Page 119: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/119.jpg)
?
![Page 120: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/120.jpg)
Shapeshifting 1
A Brave NUI World
Comfortable Computing
Emergent Mobile Topics
2
3
![Page 121: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/121.jpg)
Mark Weiser
![Page 122: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/122.jpg)
Q:!
Q:
![Page 123: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/123.jpg)
Q:!
Q: “The most profound technologies are those that disappear.
They weave themselves into the fabric of everyday life until they are indistinguishable from it.”
~ Mark Weiser The Computer for the 21st Century
![Page 124: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/124.jpg)
Q:!
Q:
1991
Tab Pad Yard-Sized Board
![Page 125: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/125.jpg)
2010
![Page 126: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/126.jpg)
![Page 127: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/127.jpg)
Mobile devices are the gateway drug for ubicomp
![Page 128: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/128.jpg)
Following toddlers into the future
![Page 129: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/129.jpg)
![Page 130: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/130.jpg)
Q:!
Q: “I like cuddling up in bed with Netflix on the iPad instead of sitting in front of the TV. It’s more comfortable to go to bed with a movie the same way I used to go to bed with a book”
~ Norbert iPad Study Participant
![Page 131: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/131.jpg)
Q:!
Q: “It’s almost like my blankie… I curl up in bed with it, or on the couch. I usually have it with me, regardless of extenuating circumstances ”
~ Erin iPad Study Participant
![Page 132: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/132.jpg)
“It’s almost like my blankie…”
![Page 133: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/133.jpg)
![Page 134: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/134.jpg)
![Page 135: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/135.jpg)
![Page 136: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/136.jpg)
Say Goodbye to Done
![Page 137: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/137.jpg)
137!
This should look familiar…
![Page 138: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/138.jpg)
138!
The web has evolved around a task-efficiency model.
Mobile can be different.
This should look familiar…
![Page 139: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/139.jpg)
139!
Tasks are about completion…
![Page 140: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/140.jpg)
140!
Tasks are about completion…
Possibilities are interactions that accrue over time…
![Page 141: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/141.jpg)
… or facilitate exploration…
141!
Tasks are about completion…
Possibilities are interactions that accrue over time…
![Page 142: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/142.jpg)
… or facilitate exploration…
142!
Tasks are about completion…
Possibilities are interactions that accrue over time…
..or are about SENSING INTENT!
![Page 143: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/143.jpg)
143!
![Page 144: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/144.jpg)
144!
![Page 145: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/145.jpg)
145!
![Page 146: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/146.jpg)
146!
![Page 147: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/147.jpg)
147!
![Page 148: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/148.jpg)
148!
![Page 149: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/149.jpg)
![Page 150: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/150.jpg)
Shapeshifting 1
A Brave NUI World
Comfortable Computing
Emergent Mobile Topics
2
3
![Page 151: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/151.jpg)
151!
Mobile presents an
opportunity to invent new ways for users to interact with information.
![Page 153: Final virtual seminar_mobile_frontier](https://reader038.fdocuments.net/reader038/viewer/2022110115/54c7ee684a795999488b4818/html5/thumbnails/153.jpg)
Oh! By the way… I’m writing a book!
Expected Publication: April 2011
! ! !