Don't Design Like a Programmer

Presented by Everett McKay on May 9, 2012

Transcript

1. Everett McKay Principal UXDesignEdge
2. Who is this guy? • I’m Principal of UX Design Edge • Based in St Albans VT! • I offer UI design training and consulting services, primarily to teams that don’t have sufficient design resources • Previously was a Windows PM at Microsoft, where I wrote the Windows UX Guidelines • Before that, was a developer of Windows and Mac UIs Copyright 2012 UX Design Edge
3. So, yes, I am a programmer!! Copyright 2012 UX Design Edge
6. Users! Users! Users!
7. Users! Users! Users!
8. Users! Users! Users!
14. “I don’t want to copy over all that crap!”
16. The revelation We were focused on the mechanics! The user was focused on his goals! Copyright 2012 UX Design Edge
19. “We need a wizard to copy files & settings to a new PC.”
24. “What am I supposed to do here?” “What does this page do?” “What am I supposed to do here? “Am I even in the right place?” “What does this label mean?” “Is this going to meet my needs? Do I trust it?” “Is this really going to do what I want?” “Why is this button red? Did I do something wrong?”
25. Users aren’t stupid • They are busy, focused on their work • Unlike us, they have fundamental questions and challenges that we take for granted • Unlike us, they don’t know how our UIs work • They do know how to click on stuff!! None of the previous UI changes addressed any of the fundamental questions! Copyright 2012 UX Design Edge
26. Users won’t proceed in a task until they are confident! Copyright 2012 UX Design Edge
27. The classic programmer design mistakes • Designing for yourself • Focusing on technology and features, not users and their goals • Thinking that solving problem mechanically is good enough • Having unintuitive, non-standard interaction • Having unnecessary complexity • Designing by copy (or committee) Copyright 2012 UX Design Edge
28. Don’t play UI Tetris
29. Why do we do this? • It’s easier to develop • We don’t notice the usability problems • We aren’t aware that there are better solutions Programmers don’t create bad designs intentionally Copyright 2012 UX Design Edge
30. What can we do about this? • Scenarios help you make design decisions from the user’s point of view • Let’s talk about scenarios! Copyright 2012 UX Design Edge
32. A scenario A specific target user trying to achieve a specific goal or task in a specific environment Scenario = user + goal/task + environment Copyright 2012 UX Design Edge
34. Don’t be random! Random people doing random things for random reasons in random contexts Leads to random designs! Copyright 2012 UX Design Edge
35. Feature-based design We need a file and settings transfer wizard Copyright 2012 UX Design Edge
36. Task-based design Transfer files and settings from old PC to new PC Copyright 2012 UX Design Edge
37. Scenario-based design? Joe just bought a new PC. He discovered the FAST wizard, which enables him to copy programs, files, and settings from his old PC to his new one. Joe is thrilled! Copyright 2012 UX Design Edge
38. Scenario-based design, Part 1 Joe just bought a new PC. While he was thrilled with his old PC when he first bought it, its performance has degraded over time. He isn’t entirely sure why— perhaps it just has too much junk installed, or perhaps it has viruses and malware. Regardless, Joe has decided to upgrade. Copyright 2012 UX Design Edge
39. Scenario-based design, Part 2 Joe would like to copy the programs and files from his old PC that he still uses and leave all the other stuff behind. He knows the programs and documents that he uses frequently from memory, he can recognize files he uses occasionally, but isn’t too sure about the rest. He doesn’t know the specific file names and locations. Copyright 2012 UX Design Edge
40. What does this scenario tell you? • Joe doesn’t want to transfer everything—just what he still uses • He doesn’t know specifically what to transfer • His PC might have malware! Copyright 2012 UX Design Edge
41. Environment is essential to good scenarios! • The old PC’s files and settings aren’t good! • The old PC might be infected! Just copying everything is a bad idea! Copyright 2012 UX Design Edge
42. New requirements • Tool must assist users in selecting programs and files to transfer • Tool must scan everything transferred for security and performance • Tool must not infect new PC! Copyright 2012 UX Design Edge
43. Without scenarios, we are doomed to thinking about features and technology, and solving problems mechanically! Copyright 2012 UX Design Edge
45. Wait a minute—you’ve gone and changed the product! Copyright 2012 UX Design Edge
46. Exactly! Copyright 2012 UX Design Edge
47. A UI isn’t a thin veneer Copyright 2012 UX Design Edge
48. “Design is not just what it looks like and feels like. Design is how it works.” Steve Jobs Copyright 2012 UX Design Edge. All rights reserved.
49. The user experience needs to drive It’s UX  features, technology Not features, technology  UX Copyright 2012 UX Design Edge
50. “I need a tool to securely transfer the programs I use and the files I care about.”
51. “I need a wizard to infect my brand new PC with viruses, malware, and bloatware.”
53. How many ways can we mess up a date?
54. Typical date problems • Not providing a date picker control • Displaying using wrong format for locale • For reservations: Users want both number days and departure date • For projects: Users want to know days until next deadline • For physicians: Users want to know the patient’s age If users need a calendar or have to do math to understand the date, it’s not usable! Copyright 2012 UX Design Edge
55. How many problems can you find?
56. Can you see the data structures? Copyright 2012 UX Design Edge
57. A better solution
59. Summary • Don’t let features and technology drive the user experience • It’s not enough to enable a task mechanically • Don’t expose the raw internal data structures • Don’t expose everything all at once • Make it clear what to do • Scenario-based design is a great way to view a task from the user’s point of view Copyright 2012 UX Design Edge
60. Everett’s Law of UI Design: If a UI merely exposes the raw technology to enable a task, it’s not usable! Copyright 2012 UX Design Edge
61. Want to learn more? Check my website uxdesignedge.com Contact me at everettm@uxdesignedge.com Subscribe to my blog Read the Don’t Design Like a Programmer series Copyright 2012 UX Design Edge
62. “I hear and I forget. I see and I remember. I do a UX Design Essentials Workshop and I totally get it!” Confucius
63. Questions?
64. Thank you!