Hey, i’m over here! Designing for user focus

image of a target
Image: Flickr and AJC1

In today’s  media-rich society we are constantly exposed to 100’s of things clamouring for attention and demanding our focus.  A study showed that people are bombarded by the equivalent of 174 newspapers of data a day.   These days, we are constantly on the alert, waiting for the next social network update, message or notification.    And it can be mentally exhausting.

Only Human
This constant barrage on our senses is not good for us.  If we let all this data into our brains we would quickly become overwhelmed.  To protect ourselves and our minds, we have evolved to selectively focus on what is of interest to us and to ignore the rest.  This helps prevent sensory overload. The result being that we become rather focused on what we what we want to see or do and filter out almost everything else.

Hiding in plain sight:  Attentional blindness
When we focus on the task at hand and screen out everything else, we often miss obvious information right in front of us.  This psychological phenomenon is called attentional blindness and was made famous by the experiment with the guy in the animal suit (trying not to give the game away, see below).

Directing user focus.
Having an understanding of how we humans process these things helps us, as UX designers, design for these human quirks.     But how can we create a friction-free flow and at the same time direct user’s focus on where we want them to go?

  • Don’t let your important content become a victim of “banner blindness”.  Eye-tracking studies show that users block out anything they perceive to be irrelevant advertising.   We need to ensure that images don’t look too much like adverts or click bait.   Also, including people and particularly faces, in banners can bring user’s focus back to these areas, as we know people like to look at other people.
  • Reduce Cognitive friction (e.g the friction that occurs when the interface doesn’t respond as the user expects) by having a clear IA and a consistent design format throughout e.g For example, keeping all the CTAs the same colour and in the same position on the page (if possible) helps users get things done quicker.
  • Reducing the amount of text on pages and making it scannable appeals to our limited attention spans.

    Steve Krug says “Get rid of half the words on each page, then get rid of half of what’s left.”

  • By limiting distractions or interruptions in the flow, especially at key junctures in your customer’s journey.   Consider Amazon and their somewhat enclosed checkout funnel, where once users press proceed to checkout, the site’s stripped down navigation and lack of features (such as share or search for another item) actively encourages customers to continue straight on to complete the purchase.

Watch out for the bears

The upside of our selective attention and focus is that we can ignore distractions and the tonne of information we are constantly exposed to.   There can be however pitfalls to our single-focused attention when we get particularly caught up in what we are doing. Anyone who has a mobile phone will have experienced this, especially while texting and walking in busy areas.  It can be dangerous.   For example, we need to be careful not to become so engrossed in our task that we fail to notice that there is a giant bear is on the street in front of us.

Designing for limited attention spans. 

We as humans need to be smart about how we expend with our limited cognitive resources and we as UX designers need to be smart as to how best to funnel our customer’s attention.

We see in user testing, time and time again, how task orientated users are.  First understanding what tasks are most important to your customers is vital. The next challenge is to then to create a distraction free journey that allows your customers to complete those tasks as easily as possible.

Related resources 

Daniel Kahneman on heuristic shortcuts, cognitive traps and human biases.    

Robert Cialdini on social psychology, influence and persuasion.



Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s