Advanced Simplicity Workshop from UX London (Giles Colborne)
74 likes22,212 views
The document discusses the concept of 'advanced simplicity' in design, emphasizing the balance between simplicity and complexity in user experiences. It explores how meaningful simplicity can enhance usability and emotional engagement while avoiding blandness. The author proposes strategies such as removing, organizing, hiding, and displacing features to create effective and intuitive interfaces.
Advanced Simplicity Workshop from UX London (Giles Colborne)
- 2. Hello! 2
- 3. Advanced simplicity? WTF? 3
- 4. He means: I would not give a fig Dumbing Down for the simplicity this is bad. But GENius side of complexity, simplicity is great. but I would give my life for the simplicity on the other side of complexity Oliver Wendell Holmes 4
- 5. Part 1 Part 2 understanding it achieving it 5
- 6. is your life too simple or too complicated? 6
- 7. Do you always buy the simplest product on offer? 7
- 8. Do you try to do more things than you have time for? 8
- 9. Have your choices made your life too complicated? 9
- 10. You see, we always want to keep it simple... 10
- 11. but temptation often gets the better of us. 11
- 12. If you can’t explain it simply you don’t understand it well enough Albert Einstein so let’s see if we can make simplicity simple again. 12
- 13. 13
- 14. What is minimal? GO about ten years ago, i was working on this online bank statement. 14
- 15. ol the date contr e worked just fin Usable in testing. But ed the more i look at it, the less i liked it. Mar 2011 GO 15
- 16. t you could selec a date in the future. Nov 2011 GO ERROR! 16
- 17. and you could select a date more than 12 ey months ago (th only kept 1 statements for ?) year - who knew Jan 2010 GO ERROR! 17
- 18. Simple Mar 2011 Feb 2011 and it struck m e Jan 2011 there was a Dec 2010 better way to design this. Nov 2010 Oct 2010 18
- 19. simplicity = Extreme usability which made me t realise that jus because something was usable, that as didn’t mean it w simple. 19
- 20. n the web focuses o ne Web Usability getting the job do in the users’ own n’t time. Efficiency is a big factor - even when you watch users. Effectiveness Satisfaction Efficiency ISO 9241-11 perceived efficiency 20
- 21. if you’re aiming fo r Extreme Usability extreme usability, it then you try to h high scores in all areas. Effectiveness Satisfaction Efficiency ISO 9241-11 21
- 22. e So an interface lik this, which seems fine online... 22
- 23. e ends up looking lik this - efficiency, effectiveness and ll satisfaction are a important. 23
- 24. Simple! So - that’s all we h need to do. hit hig ee. scores on all thr 24
- 25. not so fast! 25
- 26. ACTIVITY let’s vote on gs whether these thin are simple and d complex. We shoul all agree - right? simplE complex 26
- 27. Looks simple. But ? what does it mean 27
- 28. Simple. On the outside. 28
- 29. e but complex on th inside. 29
- 30. do do one thing and it well. That’s the ity. mantra of simplic Right? 30
- 31. So what happens when you have a kitchen full of ‘do it one thing and do well’? 31
- 32. Complex? if you’ve a ever tried ‘typing’ URL with a Wii-remote the n this looks a lot better. (although i have to t ake issue with any re mote control with two on/off buttons.) 32
- 33. Simplicity is not the answer Donald Norman simplicity is a slippery e concept. mayb we need to reconsider.
- 34. Simplicity is the ultimate sophistication Leonardo Da Vinci but this guy also k has a great trac record and he thinks it’s important. So let’s not give up yet.
- 35. er can we find a bett the way of explaining ex dual simple-compl e nature of all thes things? 35
- 36. Simplicity isn’t a solution or a quality. simplicity rs’ happens in the use head. Simplicity is experienced 36
- 37. Strong What using it feels like What it looks like Weak How it’s made and with e e xperiences, som things matter s. more than other 37
- 38. works for any experience but today, we’re talking about simplicity great. but if we aim fo r simplicity all the t time, won’t we jus get... bland? 38
- 39. Simplicity does not mean want or poverty. It does not mean the absence of any decor or absolute nudity. It only means that the decor should belong intimately to the design proper, and that anything foreign to it should be taken away. Paul Jacques Grillo, Form, Function and Design 39
- 40. Simple so we can add another layer to e simplicity to creat . richer experiences We do that with e motion and mood. modern traditional elegant 40
- 41. in the business world, we’re not ing very good at talk about emotion. 41
- 42. two identical products - mastercard with added loyalty benefits. and both brands have a reputation for r. m aking stuff simple he but you’d expect t experience to be ere different if you w eir to call each of th call centres. 42
- 43. name of product / service Practical: it makes simple Emotional: it makes me feel Social: it makes me look y here’s a simple wa nd . of capturing a bra 43
- 44. ACTIVITY Pick a brand MARKS & (or any SPENCER other) and a product (or any other) and describe the experience 44
- 45. how did you get on? 45
- 46. Can you make this simple & Friendly? how does brand + te simplicity transla into designing ? better interfaces to the first thing is find the points of friction. 46
- 47. name of product / service Photojojo Buying Photo Practical: it makes simple supplies Emotional: it makes me feel playful great so take a Social: it makes me look creative online store like photojojo... 47
- 48. Photojojo.com f and at the point o friction, that’s e where they choos to do something y. simple and friendl 48
- 49. 49
- 50. ACTIVITY Think of an experience that felt complicated to you what and why? 50
- 51. Find anything interesting? let’s pick out a couple of key points from ... what we found 51
- 52. things feel complex when w e’re acting like r a mainstreame Expert and the system mainstreamer r is designed fo perfection experts. completion precise control Ease of control take it apart, explore afraid of breaking it Exact match good enough Principles examples, stories detailed mental model loose mental model deferred gratification i want it now! Read the manual What does RTFM mean? 52
- 53. if you’re ‘geek like ed me’ then you’re us to feeling like an d e xpert. Let’s remin ourselves what it feels like to be a mainstreamer. ou so tell me what y do when you drive nd through a right ha did bend in your car. you say ‘turn the wheel’? 53
- 54. on this is jackie stewart rld his way to being F1 wo champion in the 70’s. He says that by the time he he’d reached the top, saw each corner as having seven distinct phases. When you’re a d mainstreamer, it’s har to understand how . experts see the world 54
- 55. desire for system there are more experts knowledge ers. than mainstream Experts parad ox: experts have Customised the status. experience mainstreamers us. nat urally want stat so they gravitate to en high -spec models. Th em. they can’t use th Mainstreamers Simple, Stable, Fast User (n) 55
- 56. these world views are useful when ou t you’re thinking ab personas. 56
- 57. Can you make an expert behave like a Mainstreamer? 57
- 58. in 1990 steward k pearce is a free kic s pecialist. 20 goals in two seasons - not bad for a defender. 58
- 59. he travels to italy wit h england’s world cup squad. in the w. semi final against o Germany, it goes t penalties. 59
- 60. pearce puts his le p enalty in the midd e of the goal and th s ge rman ‘keeper save it. England are e eliminated. (and w on never stop going about it.) 60
- 61. r u nder pressure, ou s p erformance break down. the more complex the task, to the faster we fall pieces. Yerkes-Dodson Law 61
- 62. So i can look at this now and it makes . per fect sense to me g But when i’m tryin to print out documents on a ter deadline, the prin always ‘breaks’. 62
- 63. s what other device do we use when we’re under pressure? 63
- 64. we had three really great design exercises at this point. you’ll have to come to one of these workshops some time! Create a simpler user experience for... 64
- 65. report back 65
- 66. Part 1 Part 2 understanding it achieving it 66
- 67. Part 1 Part 2 understanding it achieving it 67
- 68. k so let’s try a quic exercise. take els something that fe a complicated - like ol DVD remote contr and... http://www.flickr.com/photos/redjar/136216608/ 68
- 69. Simplify this! 69
- 70. On/Off Quick OSD (On-Screen Display menu) FL Select (change the display on DVD player) Open/Close (Eject DVD) Advanced Disc Review (Review playlist) AV Enhancer (Adjust audio and video) Repeat (Repeat play) Multi Re-Master (Improve audio quality) Numeric Keypad Depth Enhancer (Reduce picture ‘noise’) Manual Skip (Skip 30 seconds forward) Quick Replay (Skip back a few seconds) Cancel Skip Forward Skip Back Slow Forward Slow Back Stop Pause Play Direct Navigator/Top Menu (Main menu) Play List/Menu (Show a disk menu or play list) Functions (Change on screen menu) Return (Return to previous menu) Up Arrow Down Arrow Left Arrow Right Arrow Enter Subtitle Audio (Change soundtracks) Angle/Page (Change angle/advance still pictures) Setup (Quick setup menu) Play Mode (All/group/random play) Play Speed (Changes play speed) Zoom Group (Selects groups of items to play) simpleandusable.com 70
- 71. 71
- 72. The four solutions 72
- 73. 73
- 74. Remove 74
- 75. 75
- 76. Perfection is achieved not when there is nothing more to add but when there is nothing more to take away Antoine de Saint Exupery o great - but how d you know what to n take away and whe to stop? 76
- 77. Expert mainstreamer perfection completion precise control Ease of control take it apart, explore afraid of breaking it Exact match good enough Principles examples, stories detailed’s a clue - tamodel loose mental model mental ke here deferredallnthot trol. a away gratification i want it now! c n precisio f There are 5 ways o fast-forwarding. most of them can go. 77
- 78. n’t mainstreamers do n want customisatio and fine-grain control. in places t like this, you’ll ge clues to what . experts only want 78
- 79. u i’ll bet lots of yo got rid of the but su btitles button. e for some peopl that ’s essential. it’s e, a pattern of us . So not a use style y it’s hard to justif it’s removal. sous titres sont disponibles 79
- 80. s a nd s ome interface ed n eed to be pack full of stuff. st W almart just lo bn an estimated $1.8 - in sales by ‘de cluttering’ its ov e s helves. So rem is n’t always the . right solution 80
- 81. Organise 81
- 82. i like ‘organize’ because it’s cheap and really powerful. 82
- 83. and even when something works well in testing - like this interface... 83
- 84. ... a little bit of ‘organize’ makes things feel a lot simpler. 84
- 85. Hide 85
- 86. hide: either using a hatch - like this or by using a touch-screen and putting the additional controls in hidden ‘layers’ 86
- 87. Back in office 2000, microsoft tried to hide by only revealing the ‘most frequently used features’. 87
- 88. but what i use frequently isn’t the same as what you use frequently. so this approach led to confusion. so, again, a better way of hiding is based on expert versus mainstreamer. 88
- 89. the other thing about hiding is, people are afraid to hide stuff properly. as i read this article in the NYT, i wondered ‘what’s a bodega’. So i highlighted the word ready to google it... 89
- 90. and this feature popped up - NYT will define any word you highlight. but the feature is hidden. the trigger is your behavior. Anything else would distract from the reading experience and make it feel complicated. 90
- 91. Displace 91
- 92. one other solution is to turn the remote into a kind of mouse and displace all the complex stuff to an on-screen menu. of course you need to make that on-screen menu simple. By removing, hiding and organizing. but you can also displace to another part of the system - the user. 92
- 93. My Travel Plan STRATFORD-UPON-AVON OXFORD LONDON BATH a few years ago i was asked to create a travel planner. So i wireframed an interface where users could add journeys and destinations to an itinerary and it would tell them when they had the perfect itinerary. 93
- 94. My Travel Plan click on an activity... STRATFORD-UPON-AVON OXFORD LONDON BATH The Roman Baths Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi commodo, ipsum sed pharetra gravida, orci magna rhoncus neque, id pulvinar odio lorem non turpis. Mon-Fri 0900-1830 (includes Bank Holidays) Sat-Sun 0900-1730 Christmas: Closed £10 Adults, £5 Children / Student / Over 65 Allow 1 hour minimum Add this 94
- 95. My Travel Plan build up a LOCATION ACTIVITY TIME travel plan STRATFORD-UPON-AVON Excelsior Bath N/A Hotel OXFORD The Roman Bath 0930-1030 Baths LONDON BATH Train to Bath 1042-1153 Oxford The King’s The Roman Baths Oxford 1230-1400 Head Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi commodo, ipsum sed pharetra gravida, orci magna rhoncus neque, id pulvinar odio lorem non turpis. Oxford Punting 1415-1515 Mon-Fri 0900-1830 (includes Bank Holidays) Sat-Sun 0900-1730 Ashmolean Christmas: Closed Oxford 1530-1700 Museum £10 Adults, £5 Children / Student / Over 65 Train to Oxford 1722-1835 London Allow 1 hour minimum Add this 95
- 96. My Travel Plan LOCATION ACTIVITY TIME STRATFORD-UPON-AVON Excelsior Bath N/A Hotel OXFORD The Roman Bath 0930-1030 Baths LONDON but the system tried BATH Bath Train to 1042-1153 Oxford to do too much. users felt constrained. it Oxford The King’s 1230-1400 Head was like trying to complete a jigsaw Oxford Punting 1415-1515 puzzle without knowing what the picture was. it Oxford Ashmolean 1530-1700 Museum didn’t work in testing and we decided to put Oxford Train to 1722-1835 London our effort elsewhere. 96
- 97. when i next tackled the problem, i just gave users a set of folders which they could name as they pleased and Tuesday save whatever they thought would fit. People set their own goals and used it in ways i’d not expected. Kid’s things Travel discounts 97
- 98. these kinds of interface - a few simple rules that people can easily learn and put to use - are remarkably adaptable and develop in unexpected ways. For me, that is the essence of advanced simplicity - the ‘so simple it’s genius’ kind of simplicity. 98
- 99. 1. Remove features 2. Organise features 3. Hide features 4. Displace features 99
- 100. Let’s try! so, take what you’ve learned and apply that to the design exercises. 100
- 101. Defining simplicity (or any user experience) Making it emotional Experts / mainstreamers Four strategies 1. Remove features 2. Organise features 3. Hide features 4. Displace features 101
- 102. No matter how cool your user interface, it would be better if there were less of it Alan Cooper 102
- 103. Thank you! @gilescolborne 103