Now that people experience the web across multiple screens and on many devices, we need a UX strategy that helps us design and deliver those experiences in a way that is both consistent and contextual. Designing for motivation, behavior, emotion, and creativity ensures that we put people first and use technology to the fullest advantage. Keynote presentation from Mobile+Web DevCon in San Francisco, July 2012.

1. Mobile+Web UX
Mobile+Web DevCon
San Francisco, July 2012

2. Welcome
David M. Hogue, Ph.D.
VP Experience Design
Fluid, San Francisco

3. Devices Today

4. 1.1B+
227 million
current generation video
game consoles
26.7 million
e-readers sold in the last
two years
personal computers 18 million
on Earth Kinect motion-sensing
systems
600 million
400 365
people around the
world have broadband
lines for Internet access,
about the same access
million Android million iOS the web through mobile
devices
devices devices

5. Smartphone
Tablet
Desktop / Laptop
e-Reader
Television

6. It is a
multi-screen
world.

7. Click
Tap
Gesture
Talk

8. The mouse is
no longer king.

9. We need a
UX strategy
that works
everywhere.

10. UX Strategy

11. Technology is great…

12. … but this is really about the people.

13. People first.

14. Motivation
Behavior
Emotion
Creativity

15. Focus on people
not technology
and solutions
emerge.

16. Understand context.

17. Context involves:
People
Places
Objects
Needs (or Wants)
Urgency
Importance

18. Core Principles

19. Focus
Attention

20. Reduce Cognitive Load

21. Assist
Memory

22. Recover from loss and failure.

23. Yes, I know.

24. Make
Connections

25. Foster
Emotion

26. Sense the World

27. Ask
What is the purpose?
What else might it do?
Is it meaningful?
Can it be learned quickly?
What is unnecessary?
What will make it enjoyable?

28. Participate
Use the device.
Join the crowd.
Immerse and observe.

29. Embrace chaos.

30. UX Tactics

32. Be ruthless.
Understand.
Focus.
Edit.
Edit again.

33. “I saw the angel in
the marble and
carved until I set
him free.”

34. “Get yourself
fully dressed
and then,
before
walking out
the front
door, pause
by the mirror
and remove
one item.”

35. “You have to deeply understand the essence
of a product in order to be able to get rid of
the parts that are not essential.”

36. Focus
on only the most
important data and
actions. There is
no room
for the extraneous.

37. Some essentials…

38. Perceivability
always wins.
Invisibility is a challenge.

39. Don’t make it seem interactive,
if it isn’t interactive.

40. Touch
Give enough room.
Fitts’ Law (actually, Meyer’s Law.)
Tactility invites touch.

41. Dip your fingers…

42. Tapping is easy.
Typing is hard.

43. Match keyboard to information.

44. There is no hover
with your finger.

45. Gestures
leave no trace.
(Well, not much.)

46. Touch Traces

47. The opportunity
to gesture
can be difficult to communicate.

48. Leap Motion

49. Overlays for instructions.

50. Show, don’t tell.

51. Visual indicators and hints.
Overlays for instructions.

52. Gestures
Are easy when they are familiar.
Are easy when they make sense.
But gestures may still be arbitrary.

53. Swipe to navigate.

54. Pull to refresh.

55. Spread to Insert

56. Gestures may involve
more than the screen,
they may involve the
entire device.

57. Shake to randomize.

58. Motion can:
Provide cues for interaction.
Focus attention.
Make connections.
Facilitate understanding.
Establish mental models.

59. Motion conveys meaning.
“John Bohannon: Dance vs. Powerpoint, A Modest Proposal” on TED

60. Motion can help
experiences feel more
natural.

61. It is new, and it just feels right.

62. Multiple screens
require designs that are
responsive.

63. Create layouts
whose elements
flow and
adapt
between the
break points.

64. People expect to have
the same experience
everywhere.

65. Future UX

66. Move beyond tasks
to focus on
abilities.

67. It will not be about what we
need to do.
It will be about what we
can do.

68. Mobile Today
New ways of doing common things.
News, books, music, photos, sharing,
buying, finding, learning, navigating,
scheduling, contacting…
All from our pockets.

69. Analysts said
mobile devices are only good for
content and contact.

70. But we quickly
discovered we could
create things.

71. We create information.

72. We capture the world around us.

73. We sketch and compose.

74. We remix.

75. We create,
because we can.

76. In the future
our devices will create things
with us and for us.

77. Device Senses
Sound
Light
Touch
Location
Orientation
Motion
Radio

78. Future Senses?
Pressure
Temperature
Humidity
Chemical
IR & UV
Magnetics

79. Sensordrone

80. Devices will
gather information
automatically for us.

83. We will be able to
access and create
information anywhere.

85. Interfaces could be integrated
nearly everywhere, they could be
ubiquitous.

88. The growing network of
sensing devices
will understand us and our context.

89. Google Sky augments our reality.

90. Siri and Google Now understand our context.

91. Devices and interfaces will change
and become more natural,
more organic.

92. Regardless of the
technology,
we are designing
for people.

93. Motivation
Behavior
Emotion
Creativity

94. People first.

95. Thank You
David M. Hogue, Ph.D.
VP Experience Design
Fluid, San Francisco