Inattention Blindness – Maybe Users Really Don’t See

Summary

Have you ever wondered why users find your app frustrating? Why they don’t use some new feature(s) you’ve rolled out recently, or why they just seem to miss the blindingly obvious?

It’s not necessarily anything wrong with the application, but in the user’s ability to perceive it. Why? Because of Inattention Blindness. Let’s discuss this interesting phenomenon.

Consider a scenario

You mapped out a brilliant new feature, worked through it with your design and development teams, implemented it, tested it and rolled it out the door. Then, you waited; and waited; and waited – Nothing. Based on your application tracking, the feature is not even being touched – except perhaps – by your power users.

Alternatively, instead of a chorus of praise and well-wishes for the new options available in the app, users are voicing an increasing level of frustration to your helpdesk.

What’s going on?

Maybe users are suffering from Inattention Blindness. If you’ve not heard of it before, according to Wikipedia, Inattention Blindness, otherwise known as perceptual blindness, is:

… failure to notice an unexpected stimulus that is in one’s field of vision when other attention-demanding tasks are being performed … This typically happens because humans are overloaded with stimuli, and it is impossible to pay attention to all stimuli in one’s environment. This is due to the fact that they are unaware of the unattended stimuli.

There is a lot to the concept, so I’ll do my best to summarize it. Inattention Blindness is a phenomena that is related to people’s perception of the information they receive through their senses.

Irrespective of something clearly being in plain sight or–in slang terms–right in front of their eyes, people may not actually perceive it. They physically see it, whether it’s a new button, error message or warning notice, but they don’t consciously register it’s there (or that it’s important enough to them to warrant their attention).

End result? It is effectively forgotten about.

The Invisible Gorilla Test

One of the most famous tests on the subject is the Invisible Gorilla test, which was conducted by Daniel Simons and Christopher Chabris. If you’re not familiar with the test, watch this video.

Users are asked to watch the video, which has two teams passing balls between each other, and count the number of passes by one team.

What they’re not told is that during the video a person in a gorilla suit walks through the middle of the crowd, beats its chest, then walks off. You’d think this would be pretty obvious right? Well the reports differ, but around 50% of people don’t indicate they see the gorilla.

You might think this is strange right? A person in a gorilla suit walks clearly into view, struts around, and walks off. How could anyone miss something so obvious?

Well, without going in to too much depth, there are a number of theories as to why. The scientists have theorized a set of four possible reasons. These are:

  • Conspicuity: If an item is not particularly obvious or lacks meaning to the beholder, it may be missed
  • Mental Workload and Working Memory: People can only consciously concentrate on a limited amount of information at any given time
  • Expectation: The gorilla being so unexpected, it’s filtered out
  • Capacity: People only have a limited amount of ability to concentrate at any given time

With so much in our lives to concentrate and focus on, it only makes sense that we have to filter out a large percentage of stimuli, so we focus on the information that is both important and meaningful.

Here are some common examples for us as developers and consumers of web and mobile applications:

  • We consume a lot of news from a wide variety of sources
  • We send tweets and emails, post Facebook, Instagram, Google+ and other status updates
  • There are always new apps or handhelds to try
  • There’s new technology to learn or existing technology to improve at

Just from this small list, you can see it can be pretty demanding to know what’s important. And that’s not even including the normal day-to-day work and obligations we have, such as eating, chatting with colleagues and friends, cleaning, work and so on.

So it makes sense that the less we have to focus on, the easier it us for us to perceive the stimuli we receive. This then makes it easier to ensure we pay attention to it and give it the time it needs. Rather at odds with the modern world, wouldn’t you agree?

How does this relate to web applications?

The theory’s all well and good, but how does it relate to web development? Based on an awareness of this phenomena, I believe we need to keep three things in mind:

  • Simplicity
  • Clarity
  • Familiarity

How?

Consider a common aspect of a standard web application: Errors, Warnings and Informational Messages.

In any web application, the user will need to be notified at different times based on events occurring within it.

For example:

  • They’ve put incorrect information in a form
  • They’ve missed filling out a form field
  • Something’s gone wrong in processing a form or page
  • You have a new feature to announce

Each of these situations is outside of the normal course of events, so the user is not expecting it. Therefore, you need to bring it to their attention in a clear and meaningful way. I’m not a UI expert, nor am I a professional graphic designer, but here’s a starting set of suggestions for what to do:

Color

Use colors that are synonymous with the intent of the notification:

  • Red typically indicates danger or demands attention
  • Yellow typically indicates a warning or to beware
  • Green or blue typically indicate success or something not too serious

Icons

  • Use icons which are synonymous with the intent of the notification
  • A stop sign indicates something a user needs to know
  • A lightbulb indicates helpful information, an update

Whitespace

  • Don’t cram everything in at once.
  • Too much information forces the user to filter things out (maybe your new feature)
  • You increase the chance something will be overlooked

Emphasis

  • Draw attention to the most essential choices the user has to make
  • Play down the choices that aren’t really required or the user can skip over. This will help users be more efficient
  • Provide a progress indicator, yet don’t make it the central focus of what’s required
  • If something’s important, don’t make it subtle

Consistency

  • Consistently apply interface elements throughout your application

You may consider animations, fancy colors and icons a waste of time and energy. They may even seem too artistic for your application or client’s budget. But a proper use of them can draw a relevant change or UI element to your users attention. Through doing so, you make the application more meaningful and valuable to the user.

And isn’t the true goal of applications to help users?

Why Not Use a Framework?

Why not make it easy on yourself and use a framework, one that provides a lot of this functionality in-built. Some regularly cited ones are Twitter Bootstrap, HTML5 Boilerplate, Mobile Boilerplate and HTML KickStart.

Out of the box you’re provided with a series of UI components which you can reuse, through your application. You have layout, buttons, breadcrumbs, alerts, tables, forms and more. Additionally, they’re setup to use commonly accepted heuristics which people will understand.

Take a look at the examples below:

Here the buttons have a good size, weight and color choice which is semantically meaningful.

buttons

The alerts below are large without being overly generous, convey a clear indication of intent, and don’t look too bad to boot.

success notice

information notice

warning notice

error notice

Conclusion

I hope this rather brief discussion about Inattention Blindness has helped open your eyes as to what may be limiting the use and user satisfaction of your application. I don’t know you nor your application personally, but I’d suggest if you’re having user interaction issues, Inattention Blindness may be a culprit.

The best thing about it however, is it’s not a disease, plus there are practical steps that can be taken to help alleviate it. If you have time, I encourage you to read the links below in the further reading section, as it is a truly fascinating field of study.

So, do you think your applications are being limited by IB? How can you revise your UX strategy to better reflect its impact on human cognitive processing? Add your thoughts in the comments and let’s get a healthy discussion going.

Further Reading

http://en.wikipedia.org/wiki/Inattentional_blindness
http://www.slideux.com/inattentional-blindness/
https://medium.com/design-ux/4b1105b4a212
http://blog.enchant.co/post/19214649861/inattention-blindness
http://www.codeproject.com/Articles/467719/Inattentional-Blindness-Missing-in-Plain-Sight

Win an Annual Membership to Learnable,

SitePoint's Learning Platform

  • http://theheatexchange.wordpress.com/ H.E.A.T.

    Excellent article!

    This is the type of information that’s important to review at the start of any project. The principles you talk about is easy to forget or put aside when new design features and capabilities are possible.

    “Wow! I can add this button. I can add this widget. I can add this animation, too.”

    In the effort to display your technical prowess and your ability to keep up with the latest and greatest, you end up with a design that falls short to benefit the end user.

    I look at this as the early MySpace platform. Users were allowed to add all kinds of graphics, gadgets, and skins to their pages. Some pages would be so overloaded that visitors wouldn’t know where to find the simplest thing as the screen name.

    Your article breaks it down for me in a way that makes a lot of sense. You will more than likely have people claiming to know these principles already, but knowledge and practice are two different things. Sometimes, being reminded of the fundamentals is just as important as learning new techniques.

    Again, excellent article.

  • http://www.maltblue.com Matthew Setter

    Hey H.E.A.T.,

    thanks for some pretty solid feedback. I’m not sure whether it’s something in the psyche of the kind of person that becomes a software developer, it’s in the wider environment, or a combination of the two.

    But there seems to be a pervasive atmosphere in tech circles of the rightness of forever adding new, latest, tricky & flashy in to our apps. “That we can” seems to outweight “whether we should”, or “Do we need to…really?”.

    I can’t speak much for MySpace (never really got in to it). But I have similar experience with other applications that sang from the same hymn sheet.

    I agree, sometimes we all need a gentle reminder about what’s important, which ultimately are our users, whether we acknowledge them or not.

    Thanks for your feedback and I’m chuffed that you enjoyed the article so much.

    Matt

  • http://www.brothercake.com/ James Edwards

    Very interesting article.

    However your buttons and alerts would fail accessibility requirements, because they’re using colour alone to convey information. Some users don’t perceive the same range of colours (or indeed, any), so for example, a person with the most common form of colour blindness will perceive many shades of green and red as the same — either black or brown.

    You can mitigate this to some extent with shade variations (e.g. a dark red vs a light green), but even then, that doesn’t convey the same information. Colour associations are also cultural — red means warning in western colours, but not in oriental cultures (iirc).

    So for the alerts example, I would say that they should also have icons. If the icons are implemented as IMG elements then they can also have ALT text for the benefit of screenreaders, which says “ERROR” or whatever, to give context to the message.

    • http://www.maltblue.com Matthew Setter

      Hi James,

      I appreciate the buttons and alerts aren’t necessarily going to work across the board. They’re more to highlight the point. However, what fascinates me is your point about the cultural associations. That’s something I’ve wondered about for quite some time. Is it feasible to create an application that truly works cross-border? That aside, thanks for the feedback. I agree with the points that you’ve raised and may look to refine the article based on them.

      Matt

      • http://www.brothercake.com/ James Edwards

        Is it feasible — I have no idea, nor do I know whether there’s been any significant research on this subject.

        I mean if you were localizing a site or application, I guess you’d want to take advice from someone who lives in that locale. But whether we could amalgamate all that kind of information into a set of (as it were) cross-cultural user cues — I really don’t know. Be nice if we could :-)

      • http://www.maltblue.com Matthew Setter

        On thinking about it more without specifics to back it up, I’m doubtful an app could be made which is truly cross-cultural. This blog post highlights how differences in attitudes, opinions and methods from one culture to the next make it really difficulty: http://hothardware.com/m/News/Intel-Linux-Developer-Requests-More-Respect-From-Torvalds-But-Linus-Isnt-Buying/default.aspx