Creating Pleasurable Interfaces: Getting From Tasks to Experiences

Slide 1: Creating Pleasurable Interfaces Getting from Tasks to Experiences presented by Stephen P. Anderson

Slide 2: STOP! You must be over 21 to view this presentation. (just kidding)

Slide 3: Meaningful? Emotional? Creating Pleasurable Desirable? Interfaces Getting from Tasks to Experiences presented by Stephen P. Anderson

Slide 4: A story...

Slide 6: Interesting for another reason...

Slide 9: How does this evolution relate to web interface design?

Slide 10: Joy of Use Hedonic Design Fun Affective Computing Emotional Interface Persuasive Pleasure Design Narrative User Interfaces Social Computing Funology Seduction Emotional Design Desirability Beauty, goodness, and usability Scent

Slide 11: http://www.poetpainter.com/thoughts/article/designing-for-more-than-tasks

Slide 12: Good interaction design focuses on what people want to... ✓ Know (content, good IA) ✓ Do (tasks, UI Design) ? Feel... “feel?#!!??”

Slide 13: "At this point in experience design’s evolution, satisfaction ought to be the norm, and delight ought to be the goal. So how do we do this as experience design professionals? If the word “experience” is in your title or department, it implies you’re considering these issues." Parish Hanna (2002)

Slide 14: “I am finally seeing that concept [whole product design] come to fruition as we move from a focus on product usability, where ease of learning, ease of use, and satisfaction with the interface and documentation are paramount, to broader issues that include branding, aesthetics, fun, and pleasure. This evolution follows a hierarchy of user needs...” (2005) Chauncey E. Wilson "Usability and User Experience Design: The Next Decade"

Slide 15: SUBJECTIVE / QUALITATIVE Focused on Experiences (People, Activities, Context) Have a believable story Co-create value with customers Connect people in community Prioritize Aesthetics (no, not Graphic Design) Are part of a bigger system (visual, behaviors, sounds, psychology) Appeal to emotional, spiritual, and Design for FLOW (boredom vs anxiety) social values Leverage Game Mechanics/Learning Theory Create a tolerance for faults at (completeness) lower levels Have a Personality Are tied to a person’s self-image, Meaningful Create conversational and context aware highly personal interactions Has personal significance (“Adaptive Interfaces”; narrative IA structures) Pleasurable Elicit Desire (Limited availability, limited access, curious and Memorable experience worth sharing seductive experiences) Simplify, organize, and clarify Convenient information THIS IS THE “CHASM” THAT HARD FOR ORGANIZAT Display information visually Super easy to use, works like I think Reduce features and complexity Usable Are easier to understand Creating Pleasu Can be used without difficulty Use language for more natural Getting fom Tas Reliable interactions Add features that support desired Is available and accurate behaviors (offline browsing) presented by Stephen P. Functional (Useful) Works as programmed Focused on Tasks (Products, Features) OBJECTIVE / QUANTIFIABLE

Slide 16: Let’s clear the air... Marketers were half right. & Usable + Useful ≠ Desirable

Slide 17: Some things I’ve learned... All of this... 1. Is not new -- this has been a popular topic in academia for years (Jakob Nielson was writing about "Seductive User Interfaces" in 1996) 2. Is given no attention in corporate environments (that I’ve seen) 3. Is being done (implicitly) within the ‘Web2.0’ community (if only because people are asking, "What would I want to use? How would I want it to work?") 4. Requires inverting the process 5. Is difficult to sell and seen as a luxury (it’s critical) 6. Is highly subjective and personal, with centuries of different opinions... (since at least the Greeks, with discussions of beauty)

Slide 18: The ‘Levels’

Slide 19: Usable Can be used without difficulty Reliable Is available and accurate Functional (Useful) Works as programmed Focused on Tasks (Products, Features) OBJECTIVE / QUANTIFIABLE

Slide 20: Pleasurable Memorable experience worth sharing Convenient THIS IS TH HARD Super easy to use, works like I think Usable Can be used without difficulty Reliable Is available and accurate Functional (Useful) Works as programmed

Slide 25: “Once their requirements for functionality and reliability have been met, customers begin to redefine what is not good enough. What becomes not good enough is that customers can’t get exactly what they want exactly when they need it, as conveniently as possible. Customers become willing to pay premium prices for improved performance along this new trajectory of innovation in speed, convenience, and customization.” - Clayton Christensen, The Innovator’s Solution

Slide 26: Meaningful Has personal significance Pleasurable Memorable experience worth sharing Convenient THIS IS TH HARD Super easy to use, works like I think Usable Can be used without difficulty Reliable Is available and accurate Functional (Useful)

Slide 27: 16826054074 +1 682 605 4074

Slide 28: Most of ‘convenient’ is Information design. Somewhere in limbo between usability, information architecture, visual design.

Slide 30: http://www.aiga.org/content.cfm?CategoryID=258

Slide 31: http://www.airbagindustries.com/archives/005675.php

Slide 34: http://37signals.com/svn/archives2/the_long_road_to_simple_creating_debating_and_iterating_add_an_event.php

Slide 35: http://www.uxmatters.com/MT/archives/000015.php

Slide 36: http://www.uxmatters.com/MT/archives/000015.php

Slide 38: http://www.23hd.com/2006/02/02/makeover-osx-firefox-software-update-alert/

Slide 40: Not just information design...

Slide 41: helpful (real-time) cues

Slide 42: conversational interactions...

Slide 43: conversational interactions... http://www.pandora.com/

Slide 45: ...that guide and clarify http://www.lukew.com/resources/articles/web_forms.html http://www.lukew.com/ff/entry.asp?246

Slide 47: it’s simplifying what you ask for...

Slide 48: ...and it’s simplifying how you present things

Slide 49: ...and offering visual cues

Slide 51: And also information visualization...

Slide 52: http://www.farecast.com/

Slide 53: http://www.filebrowse.com/

Slide 59: and yes, more tech stuff... better performance the ability (for web applications) to work offline single-sign on not having to reload a page, especially for simple edits.

Slide 60: Meaningful Has personal significance Pleasurable Memorable experience worth sharing Convenient THIS IS TH HARD Super easy to use, works like I think Usable Can be used without difficulty Reliable

Slide 61: Pleasurable interfaces... place an importance on aesthetics. How do we select our cars? Why is decorating our homes so important?

Slide 62: http://www.subtraction.com/archives/2003/0512_stuck_on_sti.php

Slide 65: BUT...

Slide 66: Aesthetics: More than just visual design, anything that appeals to the senses.

Slide 68: Recognize this sound? “ba bump ba bump ba bump”

Slide 70: Aesthetics: More than just visual design, anything that appeals to the senses. More about the psychological response to sensory stimulus, than the actual trigger.

Slide 71: “Aesthetics (also spelled esthetics or æsthetics) is a branch of value theory which studies sensory or sensori-emotional values, sometimes called judgments of sentiment or taste.”

Slide 72: http://www.frogdesign.com/?p=13

Slide 73: http://www.poetpainter.com/thoughts/article/the-ipod-shuffle-and-wrigleys-doublemint-gum

Slide 74: http://www.fastcompany.com/magazine/104/moto.html

Slide 76: Aesthetics are not necessarily a luxury but more of a basic human need.

Slide 77: Why buy a green burka if you’re a poor peasant who already has two blue ones? Why paint your nails red if you’re a destitute widow begging on the streets? These indulgences seem wasteful and irrational, just the sort of false needs encouraged by commercial manipulation. Yet, liberated Kabul had no ubiquitous advertising or elaborate marketing campaigns. Maybe our desires for impractical decoration and meaningless fashion don’t come from Madison Avenue after all. -Virginia Postrel

Slide 78: “Attractive things work better.”

Slide 79: Pleasurable interfaces... are fun to play with! Yes, Behaviors. AJAX. RIA.

Slide 81: Why are Goggle earth, Google maps (maps.google.com), the Beta version of Yahoo! maps (maps.yahoo.com/beta) and Microsoft’s Windows Live (local.live.com) so compelling, addictive, delightful? They provide the same information as the older, static maps from Yahoo!, MapQuest, MSN, and others, and the very same driving directions. They aren’t any more usable or easy to understand than the older, more static sites – some people have even found them more difficult, especially in their beta deployments. But they are more fun and engaging... The immediacy of response is both fun and useful. The fluidity of the graphics is engaging. These are visceral experiences: viscerally exciting websites. The traditional map sites, with sensible, reasonable interaction and instructions are behaviorally appropriate, but they lack excitement. I believe that a good deal of the visceral excitement comes from the graceful movements. Donald Norman: "Emotionally-Centered Design" http://www.jnd.org/dn.mss/emotionallycentered.html

Slide 82: Pleasurable interfaces... are subtle influencers “Ambient Signifiers” http://www.boxesandarrows.com/view/ambient_signifi

Slide 84: Pleasurable interfaces... have personalities: “Dominant vs Submissive.”

Slide 85: • People attribute personality to products based on their appearance and how they interact (Reeves and Nass 1989) http://www.affectivedesign.org/ http://iasummit.org/2006/conferencedescrip.htm#88

Slide 86: http://www.affectivedesign.org/ http://iasummit.org/2006/conferencedescrip.htm#88

Slide 87: Pleasurable interfaces... manage perceptions (not reality)

Slide 88: I Hate it as i am on dial up this dude seems to bounce forever.Sometimes i wish i had a virtual pin to pop the bouncing ball would be a laugh to see him fall off.

Slide 89: Pleasurable interfaces... offer interesting, human conversations

Slide 90: http://www.simplyhired.com/

Slide 91: http://www.last.fm/

Slide 92: http://logopond.com/resources/

Slide 94: these guys are poor conversationalists

Slide 95: better, but...

Slide 99: "Welcome aboard our Southwest Flight . To operate your seat belt, insert the metal tab into the buckle and pull tight. It works just like every other seat belt; and, if you don't know how to operate one, you probably shouldn't be out in public unsupervised." "The weather at our destination is 50 degrees with some broken clouds but we'll try to have them fixed before we arrive. Thank you, and remember, nobody loves you, or your money, more than Southwest Airlines." Pleasurable interfaces... ...don’t have to be so darn ‘nice’ all the time. "We'll be dimming the lights in the cabin," he says quickly. "Pushing the light-bulb button will turn your reading light on. However, pushing the flight-attendant button will not turn your flight attendant on." There may be 50 ways to leave your lover, but there are only 4 ways out of this aircraft..." "Ladies and gentlemen, if you wish to smoke, the smoking section on this airplane is on the wing and if You can light 'em, you can smoke 'em." http://gosw.about.com/od/resortsandtours/a/swjokes.htm

Slide 100: Pleasurable interfaces... arouse curiosity

Slide 101: (tease people)

Slide 102: http://www.stolen.la/jessey

Slide 103: Pleasurable interfaces... ...keep you coming back for more!

Slide 107: Pleasurable interfaces... make you laugh

Slide 109: Pleasurable interfaces... create ‘FLOW’

Slide 111: Pleasurable interfaces... can learn a lot game interfaces

Slide 113: http://www.linkedin.com/

Slide 115: Typology of Cognitive Pleasures (in no particular order) 1. Discovery User experience as exploration of new territory 2. Challenge User experience as obstacles to overcome, goals lying just beyond current skill and knowledge levels 3. Narrative User experience as story arc (user on hero's journey) and character identification 4. Self-expression User experience as self-discovery and creativity 5. Social framework User experience as an opportunity for interaction/fellowship with others 6. Cognitive Arousal User experience as brain teaser 7. Thrill User experience as risk-taking with a safety net 8. Sensation User experience as sensory stimulation 9. Triumph User experience as opportunity to kick ass 10. Flow User experience as opportunity for complete concentration, extreme focus, lack of self-awareness 11. Accomplishment User experience as opportunity for productivity and success 12. Fantasy User experience as alternate reality 13. Learning User experience as opportunity for growth and improvement http://headrush.typepad.com/creating_passionate_users/2006/04/cognitive_seduc.html

Slide 116: Meaningful Has personal significance Pleasurable Memorable experience worth sharing Convenient THIS IS THE HARD F

Slide 117: Q: How do you know if something has meaning’?

Slide 118: A: It’s the only option.

Slide 120: =

Slide 122: What makes something meaningful?

Slide 123: If you want to create meaning... have a story that people believe in

Slide 127: SUBJECTIVE / QUALITATIVE SUBJECTIVE / QUALITATIVE Focused on Experiences Focused on Experiences (People, Activities, Context) (People, Activities, Context) A product can be... Meaningful Meaningful Has personal significance Has personal significance Pleasurable Pleasurable without being... Memorable experience worth sharing Memorable experience worth sharing Convenient THIS IS THE “CHASM” THAT IS REALLY, REALLY Convenient HARD FOR ORGANIZATIONS TO CROSS Super easy to use, works like I think THIS IS THE “CHASM” THAT IS REALLY, REALLY HARD FOR ORGANIZATIONS TO CROSS Super easy to use, works like I think Usable Usable Can be used without difficulty Can be used without difficulty Reliable Reliable Is available and accurate Is available and accurate Functional (Useful) Functional (Useful) Works as programmed Works as programmed Focused on Tasks Focused on Tasks (Products, Features) (Products, Features) OBJECTIVE / QUANTIFIABLE OBJECTIVE / QUANTIFIABLE

Slide 130: If you want to create meaning... Connect people “We’re social animals”

Slide 132: If you want to create meaning... have really meaningful stories

Slide 133: ’80s ’90s ’00s Consumer Meaningful Brands Experiences Experiences “Toward meaningful brand experiences” David W. Norton, PhD, Vice President, Experience Strategy and Research, Yamamoto Moss

Slide 134: “Toward meaningful brand experiences” David W. Norton, PhD, Vice President, Experience Strategy and Research, Yamamoto Moss

Slide 137: If you want to create meaning... Co-create value with your customers

Slide 139: If you want to create meaning... limit availability or access

Slide 142: If you want to create meaning...

Slide 143: (I’ll stop here)

Slide 144: So, what have we learned? Interfaces DON’T have to be... • easy • nice, or • consistent

Slide 145: User Experience Design • Seeks to understands , their , and the of those Activities • Explores those activities, leveraging technology-based products and services While designing interfaces, the UX team focuses on Animation Focus on Emotions... these 6 (+1) elements: Visual Design BEHAVIORS Copywriting AESTHETICS For Persuasion [ BASIC HUMAN Visual Trends Narrative/ PSYCHOLOGY ] Storytelling (Context and LANGUAGE Information Change Cues) METAPHORS Design PATTERNS STRUCTURE For Technical Focus on Comprehension Writing Usability Patterns / Information Architecture Heurisitcs (Taxonomies / Processes) © Stephen P. Anderson / poetpainter.com

Slide 146: Some closing advice? • Start collecting more examples, for ideas • Invert the design process: think from the "outside in" Start with the experience, work backwards from there... forget internal politics, constrainsts, packages, and products-- just think ideal experiences, and THEN figure out how to fit the technology and politics to that experience • Roleplay: “If I was the customer, what would I want?” • Identify things that make you smile [cry, surprised, curious, delighted, etc. ] in the real world. Deconstruct these. Then figure out how to introduce similar ideas to your virtual product. • Consider the “entire experience” - your product / service is part of a larger context. • Start learning more about psychology... (or at least learn some basic principles)

Slide 148: Questions? All slides will be posted at: www.poetpainter.com