In my last article, I described the value of psychology for web and UX designers and provided examples of some things it can reveal about human bodies and behaviors. The title is a decent summary of the findings: “Let’s be honest, people suck.” In this article I'd like to present some practical ways to take that understanding of psychology and use it in your work.
How I Learned To Worry More And Love Limitations
In part one I described (maybe even ranted about) how people have unfairly high expectations, even though their own performance is limited: in their cognitive abilities, attention spans, vision, and reading, to name a few. But not all of these limitations are that problematic; they serve a purpose. Life is really hard, and it can be overwhelming to get through the day. Imagine being endlessly caught within analysis paralysis, or following an obsessive-compulsive loop. We are lucky to have shortcuts to keep us moving (even if those shortcuts are imperfect).
UX designers can make things easier if we work within these limitations. Designers have a responsibility to consider human complexities and build things that can work across the greater gamut. Allow me to repeat my plea from part one:
Stop designing experiences for us, for the “interactive 1%”.
I try to always remember that I’m coming from an industry that is much more familiar with web patterns than my typical user. The director of my college’s Graphic Design program would label anyone outside of a design domain a “pedestrian.” At the time, I thought it was pejorative, but now I see his point: imagine bringing a random person right off the street into your design process: they have no design background or project context. How successfully could they interact with your work?
By thinking about these less informed users, we can enhance usability for everyone. Take sidewalk curb cuts as an example: this real world solution for assisting the disabled also benefits a much larger group. I appreciate them on those days I’ve tricked myself into wearing heels. Ask yourself if your experiences are accessible enough to help all types of pedestrians get around (see what I did there?).
How To Help Humans Succeed
What follows are some guidelines to keep in mind to keep your designs work easy to interact with.
1. Simplify everything. Every. Thing.
People don't want to buy a quarter-inch drill. They want a quarter-inch hole! - Theodore Levitt
Don't lose sight of the purpose of a design. Define the goals it serves, and break them down to their most basic form (a good way to do this is to ask “why?”, five times). Keep this handy, maybe on a post-it, to reference as you build your flows and pages.
Once you get into the nitty gritty, ask yourself how to reduce cognitive load. Don't use ten words when five will do. Replace the cheeky marketing jargon for clear labels and calls to action.
Be ruthless in removing design elements that are only decorative and not informative. Present a limited number of choices (this one can seem counter-intuitive, because users might request more options, but deep down, they don't want them and the analysis paralysis that too many choices lead to; check out the jam study, if you don’t believe me). One method Jason Fried describes that can be helpful as you try to simplify is to begin grouping things (tasks, needs, features, etc.) into what needs to be obvious, easy and possible.
2. Make a great first impression
The saying “never judge a book by it’s cover” exists for a reason: people are naturally judgemental, and form their initial impressions of a website in under a second. But designers can use these snap judgments to their advantage. The most cited factor used when evaluating whether a website is credible is the appeal of the visual design! The right layout, typography, and color can make a huge impact and make it immediately.
3. Get users where they’re going
Users need to know where they are, and where they can get to. Create navigation that helps users peruse and get a sense of the kinds of content they could access, without forcing them to click to and view every page. And show them where they are. Breadcrumbs are a great example of how to help users understand their current context and how the site is structured around it.
This sounds obvious, but sometimes the easiest way to help a user find something is by putting it on the page. It requires a lot more mental effort for a user to read a link in the navigation, decide it’s relevant to their current task, bring the mouse over to it, click it, and wait for the page to load, compared to say, flicking their finger on the mouse, wherever it may be, to scroll down the page. Your clients will often focus their concerns on keeping the right things "above the fold," but be sure to encourage them to not be overly concerned with that. Remember, scrolling is as cheap as it gets.
Sometimes you need a user to find something very specific, for example, an error message within a form. In these cases, keep this feedback in close proximity to their most recent action, such as locking it up with the Submit button they just clicked. If you do have to place important information elsewhere, make sure it’s going to get noticed in their peripheral view by creating additional cues like animation or—dare I say it—sound.
4. Provide opportunities for focus
People have a hard enough time paying attention, so make things easy to find during quick, half-hearted skimming. Break things up into clear sections, with whitespace in between. Use labels, lists, and graphics to make hunting even easier. Test that your hierarchy is clear by seeing what stands out first, second, and third, making sure it aligns with the user's priorities for that page. Hopefully, you’ve already put the most important thing right at the top.
And take out any distracting cruft to reduce cognitive load. This might be in the form of too much content, or design elements that add clutter, or a decorative typeface that is hard to read. This goes back to keeping it simple, but again we should ask ourselves if our experience is getting in the way of the A-to-B journey most users are actually on.
5. Leverage existing patterns
It can feel icky as a designer to take the road most traveled, but we have to be very careful and intentional when creating new whiz-bang. Users are coming to your site with preconceived expectations (like where they will find the shopping cart), so you'd better have a really good reason for reinventing the wheel. Otherwise, put content and navigation where users expect to see it. Make links look like links, and buttons look like buttons. Don’t make static titles blue and suggest interaction.
If you do need to teach something new, you can still leverage existing patterns to relate to something a user is already comfortable with. My favorite example of this is the simplicity of dragging files into your computer’s trash can. And of course, once you have your patterns set, maintain consistency across the entire experience, as users will be jumping from across multiple pages and different devices.
6. Plan for mistakes
First of all, of course, you want to try to reduce mistakes in the first place. Make sure all your copy is super duper clear, like a button with a “Process Order” label, or text explaining when a person’s card is going to be charged. Consider what slips could occur; are your buttons large enough and far apart enough to prevent accidental taps on mobile? If someone came back to this tab in three weeks, would they have any idea what they were doing? Are you confirming when something is actually going right, with progress bars and confirmation messages, or are you leaving users to press an unresponsive button three and four times?
Hopefully, you’re done all of that, but sadly, mistakes will still happen. Part two is building backup plans and working through those error flows to get users back on track. Try to clearly explain what went wrong, so they have better luck with their next attempt. For really complicated systems, build in undos instead of making users start over. And for really important, terrifying systems (like piloting aircraft), create layers and layers of design redundancy.
James Reason knew what was up when he created the Swiss Cheese Model to illustrate the importance of design redundancy,
7. Put users in a good mood
Amazingly, creating an experience users enjoy can help with reliability and usability. Users perceive enjoyable experiences as easy to use and efficient, as the state of flow that they create promotes flexible thinking and problem solving. And if a user doesn’t create a workaround in their cool state of mind, they are also more forgiving and more likely to excuse any hiccups they might encounter. There are lots of ways to create fun, and I don’t want to make it too formulaic, but consider starting points like inspiring designs and photography, humor, novelty, and creating flow.
8. Know your audience
These steps go a long way toward usability, but you have to validate your specific work with real users within your target audience. Whether it's two hours, two days or two weeks, spend some time talking to real people that will use what you’re making: first to understand your personas and the types of problems they experience, laying the groundwork for your design process; then touch base with them as designs progress, to see how they use things and complete (or struggle with) important tasks. The insights you'll gain are extremely valuable and the time spent doesn't have to be great.
Accept Human Behavior As It Is
So there you have it, a few gadgets for your toolbelt. I hope you find them useful and wish you luck with tackling these usability challenges. Had enough metaphors? No? You can equip yourself even further by combining these fundamentals with specific persona knowledge to understand your users’ problems more holistically before you get building. Good for one more? To truly solve users’ problems, we need to make ourselves familiar with the realities of this rocky usability terrain and adapt to it.