How to Design for the Brain’s Strengths
One way to think about designing for web users is to consider what the brain is good at, and to design to take the best advantage of those strengths.
One way to think about designing for web users is to consider what the brain is good at, and to design to take the best advantage of those strengths.
Your brain has just completed an extremely complex task that would stretch some of the most powerful computers. You just analysed a complex image, identified recognisable shapes and matched them against models stored in your brain, and summarised the results.
You just did some more extremely high-level computations. Not only did you identify, position and enumerate the impala, you also projected where their eyes might be pointing, judged which of them might be moving, and created a mental map of relative risk. You did all that in a few moments – WOW!
The minds of higher order animals are highly skilled at recognising things by their shape, or outline. We have an amazing ability to associate shapes with their meanings very quickly. This can be helpful for spotting your quarry when hunting in thick vegetation or in poor light. We’re more likely to use this skill when associating the shape of an icon with ‘I can make a printed version of this page if I move my mouse and click on that’, or to decide to ignore a banner ad based on its shape.
Our brains are great at spotting associations between objects, based on similarities, alignment and grouping. This is helpful for working out where to move in order to separate an animal from its herd, or for telling which strangers belong to which tribes. Today, we’re more likely to use this ability to find the navigation on a new site, or to tell at a glance how many unopened emails we have.
When we match shapes and patterns, we quickly sort what to focus on from what to ignore. This is a talent we share with all natural predators. If the brain loses its ability to filter out noise, we go mad. We use this skill every time we look at a web page, by scanning for clues that help us get nearer our goal.
When faced with new problems, we’re great at working out new ways of addressing them, even by abstracting patterns that have worked for different problems. Our minds are tuned for computing available information, and quickly choosing a most likely solution. (This capacity is one of the things that distinguishes the intelligence of apes from monkeys.)
Our brains have evolved over millions of years to be extremely good at these kinds of tasks, learnt in wild situations where survival is critical. However we’ve only had a tiny amount of time to learn how to negotiate an online browsing situation. How do we respond when faced with an unfamiliar web site? (Remember, nearly all web sites are unfamiliar) That’s right – we use those same advanced mental skills we’ve honed for millions of years, and which are hard-wired into our minds.
Web designers can’t do much about the user’s minds, but understanding the way the mind works, we can do a lot to make our pages easier to interact with, to maximise the user’s chance of success.
We can use the power of shape-recognition to convey desired meanings. We do this by applying recognisable signs where appropriate, using tone, colour and contrast to help direct the user’s eye toward the most important elements.
We can take advantage of the user’s pattern-matching ability, by using techniques of alignment, proximity, hierarchy and containment to create correct visual messages.
One of the things we do when scanning is quickly to group elements, based on their proximity and patterns. This is easier when different elements are clearly distinguishable. Elements are more distinguishable when they:
When you see a new web page, you use your hunter’s skills to scan for what’s relevant to your task. You use mental rules to filter out what is less important. This saves you time and mental energy. You’ve developed the mental rules mainly from your web-browsing experience.
When designing a page, we can help users be successful by making the most useful elements more noticeable, and making less important elements recede. We can make pages easily scannable, by using mechanics like whitespace, colour and contrast. We can make use of design conventions, putting mundane elements in conventional places and giving them conventional styles, which helps the user instantly identify them and their purpose.
We can help the user quickly come up with correct interpretations to visual problems, by accurately identifying different elements and promoting the things the user is most likely to need. Useful techniques include:
Buy the entire Basics of Web Design section as a PDF e-book:
only £1.50 GBP
Do you love our approach to crafting simple & effective web sites that just work for people?
We'd love to hear about your web strategy.
Contact one of our team today!
Sign up for my regular newsletter to keep updated on everything I'm doing and thinking about in web design.
