Emotional Interaction Design (Giles Colborne)


Published on

Given at UXPA-DC's User Focus Conference, Oct. 19, 2012

Published in: Technology
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Emotional Interaction Design (Giles Colborne)

  1. 1. Imagine what it must feel like togrow up in a slum like this.This kind of building was thrownup all over Britain in the 1950s.To create this, you’d need to haveno sense of the emotions of thepeople living here.Welcome to emotionalinteraction design. @gilescolborne
  2. 2. Emotional interaction designGiles Colborne Before we talk about interaction design, we should talk about emotion in design in general. http://www.flickr.com/photos/jamesclay/2264414513/ 2
  3. 3. When you look at this pictureyour stress levels will drop andyour ability to concentrate rises(see for example, At Home withNature: Effects of ‘Greenness’ onChildren’s Cognitive Functioning”by Nancy Wells, Environment andBehavior, 2000). But emotional design is about more than sticking pictures of trees on your website. We respond to far deeper patterns in nature. @gilescolborne
  4. 4. Like the beautiful arrangementof seeds in this flower. @gilescolborne
  5. 5. And the same arrangement ofleaves in this succulent. A spiralbased on the golden ratio. @gilescolborne
  6. 6. The golden ratio is the ratio oftwo lines that fir this equation. a b a+b = a a b @gilescolborne
  7. 7. You can use these lines to draw aseries of squares... a b @gilescolborne
  8. 8. Which, in turn, define a spiral.Which is what we saw in thoseplants. But the Golden Ratiocrops up throughout nature. @gilescolborne
  9. 9. Like... the bones in your hand.The Golden Ratio defines oursense of perfect proportionand beauty. @gilescolborne
  10. 10. Which is why people have beenusing it to create beautifulthings for centuries. Peoplejudge beautiful things to begood, true, honest, simple. Itwould be a cool idea if someoneused this in web design. @gilescolborne
  11. 11. @gilescolborne
  12. 12. Many of our notions of beautyare hard wired into our brains.Like the baby face effect - peopleassociate child-like features withinnocence, honesty, friendliness. @gilescolborne
  13. 13. And Aaron Walter points out inEmotional Design that he’s usedthis to good effect throughouthis design. Most obviously inMailChimp’s mascot. makingboring email newsletter adminseem fun and friendly. @gilescolborne
  14. 14. Of course we see faceseverywhere. But this doesn’tmean ‘design everything to theGolden Ratio’ or ‘put faces oneverything’. Rather, it means youmust ‘understand the importanceof line and form in design’. Okay, that was 2,500 years of art and mathematics and industrial design in a dozen slides. @gilescolborne
  15. 15. Hey, good looking –what about interaction? But this is design as object what about design as interaction? @gilescolborne
  16. 16. This guy’s interaction with hiscomputer is certainly emotional. http://www.youtube.com/watch?v=HtTUsOKjWyQ @gilescolborne
  17. 17. Something about computersbrings out the devil in us. @gilescolborne
  18. 18. In response, some interaction designers act like Nurse Ratched in One Flew Over the Cuckoo’s Nest. They see emotion as the enemy. But I think that misunderstands the importance of emotions. @gilescolbornehttp://www.flickr.com/photos/thomashawk/54164255/
  19. 19. AI pioneer MarvinMinsky sees emotions as‘ways to think’. Emotionstune the machinery ofthe brain.Even a ‘negative’ emotionlike anger is useful. Itgives us the energy toaddress a threat andsends out social signalsthat warn others we’dbetter get our way. @gilescolborne
  20. 20. People without emotionsare less effectivethinkers. AntonioDamasio describes onepatient, Elliot, withabove average IQ butfrontal lobe damage thatmeans his emotions areimpaired making him akind of Mr Spock. When faced with a ‘rational’ task like scheduling an appointment, he endlessly weighs and compares choices. He doesn’t feel boredom, frustration or embarrassment. He takes for ever. Emotions are vital to decision making. @gilescolborne
  21. 21. This design from HP isoverly rational. The focuson numbers andspecifications flips usinto rational evaluationmode. Can I find acomputer that weighs 10grammes less? Can I finda computer that’s 3 mmthinner? We findourselves in a rationalspiral.A better approach wouldbe to connect on a gutlevel - as light as ahardback book would tellmost people what theyneed to know. @gilescolborne
  22. 22. This classic ad shows achick being put in aheatproof box... andboiled for what seemslike ages before it’srevealed alive and well.Why make your audienceso anxious?Because we rememberstressful events. They’replaying with ouremotions to fix the ideaof the heatproof box inour memory. @gilescolborne
  23. 23. I’ve found that when I askpeople about delightfulexperiences, theyremember onesassociated with stressfulevents.Like dropping your iPod –and discovering that itpaused automaticallywhen the headphonespopped out.How delightfully clever.How memorable.So I look for stress pointswhen I design because Iknow users will rememberwhat my products donext. @gilescolborne
  24. 24. Why do we like to watchhorror movies? Becausethey help us extend ouremotional range andunderstand ouremotions.Emotions are importantto people. They’re linkedto our strongestmemories and the mostmeaningful events in ourlives. What if we accept thereSo we’re right to reject will be ups and downs inthe Nurse Ratched view the relationship betweenthat we should eliminate humans and computers?emotion. What if we try to give our designs the emotional intelligence to ride those waves? @gilescolborne
  25. 25. Marvin Minsky wants tocreate artificialemotional intelligence bybuilding an artificialbrain. Awesome!But that’s a few decadesaway. Meanwhile, I havea website to design.So are there ways I cancheat? @gilescolborne
  26. 26. Back to this guy. Theword that describes himis ‘postal’.So maybe we can learnhow to deal with thissituation by talking tosome experts. @gilescolborne
  27. 27. These folks trainnegotiators to deal withcrisis situations. Maybe FBIthey can help us. @gilescolborne
  28. 28. Behavioural Change Stairway Model They use this model to get through hostage negotiations. It recognises that if you want to get to ‘behaviour behaviour change’ you need to start with ‘listening’ and ‘empathy’. change influence rapport empathy active listening @gilescolborne
  29. 29. Clearly his computer isn’tlistening to him.When interfaces don’tlisten we get angry. @gilescolborne
  30. 30. It looks like you’regiving a presentation Get help with giving the presentation Just give the presentation without help. Don’t show this tip Clippy has all the elements that we’re supposed to include in emotional design. He’s again informal yet direct. He’s cute looking. I’ve always thought there was a lot of good thinking behind him. But people hated him. Why? Because he’s so bad at listening. @gilescolborne
  31. 31. My hero Clifford Nassredesigned Clippy verysimply to listen andempathise.When Clippy offeredadvice, he would ask ‘wasthat useful?’. If peoplesaid ‘no’ Clippy would say‘that really ticks me off.Let’s tell the folks atMicrosoft I need to bereprogrammed.’ andClippy would encouragethem to write in and venttheir dissatisfaction.And it worked: usersliked Clippy. Clifford Nass @gilescolborne
  32. 32. When you watch thisvideo, you notice thatthere are lots of signsthat things are goingwrong. Our guy begins bygiving the screen a hardstare. Then he seems toswear. He slaps thekeyboard. And then hereally starts to lose it.A more sophisticatedcomputer might havepicked up on thosewarning signs and saveditself a beating. @gilescolborne
  33. 33. In Affective Computing,Rosalind Pickard suggeststhat computers could useinput from many sensors(facial recognition, audioinput and so on) andpattern matching todetect users’ emotions.She recognises this iscomplex (even peopleoccasionally misreademotions). We’re a fewyears away from this.But Clifford Nass showsus that listening can be assimple as saying ‘how amI doing?’. @gilescolborne
  34. 34. The FBI knows there’s a right way to empathise. Don’t say ‘I know how you feel’. It’s too easy for other person to say ‘Oh no you don’t’.Wrong: Instead, show you care and create opportunities for dialogue. You don’t need sophisticated technology for this. In fact,‘I know how you feel’ it’s been around since the 1960s.Right:‘I’ve never been in your situationbefore, but I imagine you must befeeling very depressed and lonely’ @gilescolborne
  35. 35. Eliza is a computer ‘therapist’ that asks users how they feel and uses pattern matching to respond and draw them out.ELIZA It’s crude, but good enough to pass a basic Turing test - some people think Eliza’s answers come from a real person. @gilescolborne
  36. 36. FBI negotiators know they need to project the rightBe positive, upbeat personality.Reassure hostage-taker that Now imagine if you hooked up Eliza’s pattern matching to an online database andthings will work out well gave it an upbeat personality with a bit of edge to it.Be credible That sounds familiar...Show you understand theirreasons but don’t be too eager toplease @gilescolborne
  37. 37. Siri is an evolution of Eliza’spattern matching approachbut with better jokes.That creates a personalityand a basis for empathy. @gilescolborne
  38. 38. Clifford Nass ran anexperiment where he gaveparticipants blue wrist bandsand asked them to completetasks a computer.For half the participants heput ablue border on thecomputer screen and said‘you and the computer aretheblue team’. For the other half,he gave the computer a greenborderand said ‘you’re theblue guy working on thegreen computer’.When the colours matched,people tried harder andthought the computer wassmarter.Building rapport doesn’trequire complex technology.Just good psychology. @gilescolborne
  39. 39. Excellent. We’re half way upthe FBI’s behaviouralchange model and we’ve nothad to build an artificialbrain.Listen and empathise @gilescolborne
  40. 40. The FBI has a lot to tell usabout how to handleemotions that arise fromsituation.But sometimes conflictarises from personalitydifferences. @gilescolborne
  41. 41. For managing relationships,this book wasrecommended to me.I love it because it centreson a simple model. (Whichwe can use when we’redesigning interactions.) @gilescolborne
  42. 42. You have to understand Task focuspeople’s disposition(passive - aggressive) andmotivation (task -relationship). It can’t be done Tank Passive Aggressive Yes person Think they know it all Relationship focus @gilescolborne
  43. 43. In the centre is the ‘normal zone’. At the Task focusedges of the graph are extreme typeswho can be difficult to get along with. Whiner Tank Passive Aggressive Yes person Think they know it all Relationship focus @gilescolborne
  44. 44. What I find normal and acceptable will Task focusbe different from what you find normaland acceptable.Everyone is someone’s difficult person. Whiner TankWe need to tune our behaviour andresponses to get the best out of thoseconflicts. Passive Aggressive Yes person Think they know it all Relationship focus @gilescolborne
  45. 45. And the secret to that is understanding Task focusthe intention that drives thosepersonality types. Get it right Get it done Passive Aggressive Get along Get appreciated Relationship focus @gilescolborne
  46. 46. Maja Mataric has built socially assistive robots that coach stroke victims through their physiotherapy. She tried tuning the coaching to each patient’s personality. The robots would tell extroverts ‘Come on, try harder’. But introverts would be told ‘I know it’s hard, but it’s for your own good’. And... it worked! Patients preferred the robots that were tuned to their personality and tried harder for them.Maja Mataric @gilescolborne
  47. 47. You don’t need to give your users apersonality test before they start. Youcould learn their personality in thesame way that Pandora learns yourtaste in music. @gilescolborne
  48. 48. And you might even be able to pickup information about users’personality from specialist services. @gilescolborne
  49. 49. Task focus Get it right Get it donePassive Aggressive Get along Get appreciated Relationship focus @gilescolborne
  50. 50. If you need to be appreciated, you’ll likethe fact that TripAdvisor tells you whenpeople have read your reviews.If you’re a ‘get it done’ kind of person,you might feel this was unnecessary andspammy. @gilescolborne
  51. 51. And if you’re the kind of personwho needs to get along, you’dappreciate this error message thatsays ‘It’s my fault’. (Personally, Ifind it rather craven.) @gilescolborne
  52. 52. Task focus So instead of designing fixed patterns of behaviour, maybe we should design flexible patterns that adjust to users’ disposition. Get it right Get it donePassive Aggressive Get along Get appreciated Relationship focus @gilescolborne
  53. 53. Behavioural Change Stairway Model And we’ve seen how a model like this can help us think about behaviour listening, empathising and building rapport, rather than change rushing towards outcomes. influence rapport empathy active listening @gilescolborne
  54. 54. A lot of the discussion of emotionaldesign today centres around ideas of‘brand’. And on old-fashioned, static,monolithic brands.But I hope I’ve shown you that we can domuch more.We can create a flow of emotions andmore dynamic, adaptable personalitiesfor our designs.We’re designing responsive web layouts,why not responsive interaction rules? @gilescolborne http://en.wikipedia.org/wiki/File:Coca_Cola_ad_ca._1943_IMG_3744.JPG
  55. 55. If we put some emotional intelligence into theinteractions we design, we can disarm conflict,create richer, more memorable experiences,and improve performance for our users.The future may bring us better ways of readingemotions.But the tools we need to get started arealready in our hands.Let’s use them. @gilescolborne
  56. 56. By the way, Samsung just patented this. Sosoon your smartphone will be able to use itscamera to detect your emotion - one of six‘universal’ facial expressions that correspondto common emotions. @gilescolborne
  57. 57. Researchers have identified six orseven universal emotions. But noteveryone who sees these photoshas the same experience. @gilescolborne
  58. 58. When you see the fear in others, youramygdala lights up. You experience stress. Thatempathy stops you from wanting to dominateothers by manipulating them.Psychopaths don’t have this response. Theybecome charming manipulators.This is the final part of emotional intelligence:empathy. Without it you’re just a manipulator. @gilescolborne
  59. 59. Which brings us back to this. Tom Cordelltracked down the architects of the 1950s andasked them what they thought they weredoing. @gilescolborne
  60. 60. We were trying to build heaven on earth Their dream of building tower blocks surrounded by parks was subverted by the money men who used the space to cram in more roads, shops and tower blocks. We should learn from their lesson. @gilescolborne
  61. 61. We need to make sure that we, the companieswe deal with, and the systems we create feelfor the users we’re serving.If we don’t we’ll end up using these powerfultools to manipulate them.And we’ll be no better than the architects of1950s Britain who, like us, thought they werecreating a better world. @gilescolborne
  62. 62. What are emotions and how Still the go-to text on using emotions Applying the triune brain model How law enforcement agenciescould we create them in a in computing. to the problem of creating negotiate in highly charged,machine? emotionally resonant designs. criminal situations.A guide to recognising A refutation of the idea that How your mood - and even your Applying theories of story toemotionally charged relationships emotions have no place in higher facial expressions can affect your interaction designand to getting the best from thought. experience of a situation.them. @gilescolborne