Into the Darkness of Your User’s Minds: Creating a User Friendly UI

Take a journey into the darkness of the human mind. Have you ever wonder why users do what they do? Why they don’t see instructions or why they have such a hard time filling out a form? Learn about the real science and research that is used to study human behavior and how that research informs good UI design. Gain a whole new understanding of how humans see and how the brain processes information. This session will give practical and simple examples to help you improve your UI designs and the reasons behind it.

Transcript

1. Into the Darkness of Your User’s Minds Creating a User Friendly UI
6. Research helps us understand people.
8. We learn by studying users.
9. Basketball Study How we focus on tasks
11. 16 times Correct answer
12. Did you see the Gorilla?
14. Designing for Inattention
15. Help users focus on the task.
16. Path to Completion
18. Takeaways !   Don’t assume people will see everything on the screen. !   If the users need something to complete the task, put it in their visual path. !   Give users a clear starting point. !   Provide clear next steps !   Indicate when the task is complete.
19. How We See
21. What you think you see.
22. What you really see.
23. What you really see.
24. What you really see.
25. What you really see.
26. What you really see.
27. What you think you see.
31. Takeaways !   Reduce clutter on the screen. !   Reduce the number of focal points. !   Increase white space around objects or groupings of objects to allow the eye to rest.
32. Working Memory
33. Seven is not a magic number.
34. 712-569-4532
35. The 3-Click-Rule
38. Takeaways !   People can only remember 3-4 items at a time. !   Break down tasks or information into small chucks. !   Memory is fragile. It degrades quickly and is subject to lots of errors. !   Don’t ask people to remember something from one task to another.
39. Context
42. 53RV35 7O
43. You can read this.
47. Give Users Context
50. Takeaways !   Context is more important than the number of clicks. !   The users should be able to see at a glance where the are.
51. People Need Feedback
52. Mom is working hard.
53. Baby is working hard.
54. Nobody is happy.
55. Design to give users feedback.
56. Confirm Actions
57. Explain the absence of data.
58. Provide meaningful error messages.
59. Takeaways !   Give users feedback !   Give good error messages !   Tell them when they have successfully completed a task
60. Things that are close together are related.
62. 500 X longer to use.
63. Fast with fewer mistakes.
64. Takeaways !   Group related items together: labels and fields or Headings and text. !   Put less space between items that do go together. !   Put more space between items that don’t go together. !   Group icons/tools with related functions together
65. We look for patterns to identify words.
66. Aoccdrnig to rscheearch at Cmabrigde Uinervtisy, it deosn't mttaer in waht oredr the ltteers in a wrod are, the olny iprmoetnt tihng is taht the frist and lsat ltteer be at the rghit pclae. The rset can be a toatl mses and you can sitll raed it wouthit a porbelm. Tihs is bcuseae the huamn mnid deos not raed ervey lteter by istlef, but the wrod as a wlohe.
67. You read differently than you think you do.
68. We look for shapes.
69. You jump around when you read.
71. White space around objects increases comprehension.
73. Takeaways !   Increase white space around objects and groupings of objects. !   Use headers and short blocks of text. !   A line length of 50 -75 characters is optimal. !   People scan more than they read.
74. Questions Questions