PRINCIPAL UX DESIGNER
Change blindness shows how even a great design can do unnoticed by the user. So how do you overcome it?
There is a well documented phenomenon in Cognitive Psychology known as "Change blindness". It occurs when large changes in an on screen picture go undetected by the observer when they occur at the same time as a brief visual disruption such as a blink of the eye or a brief disruption on the screen.
Here's an excellent online demonstration of change blindness that you can try for yourself.
Did you notice the change? Probably not the first time!
A similar phenomenon, called Navigational Blindness occurs on websites, where users ignore standard navigation tools placed at the top and left of the web page.
I recently experienced this phenomenon for myself, when trying to make a purchase on art.com. I needed to make a change to my credit card details which had expired since my last purchase. I actually experienced a number of problems with the site however I will focus on the issue of navigational blindness today!
The screenshot below shows the page I was presented when trying to check out my purchase. The error message at the top the page indicates my card is expired but gives me no hint as to how to fix the issue (problem number 1 - no scent of information!).
After searching around a bit I clicked on "Change this payment type" which brought me to a new page with a drop-down containing just 1 element and two options: Update and Cancel. At this point my attention is focused on the centre of the screen and the two options presented to me.
"Update" seemed the closest to what I was looking for, but unfortunately it brought me straight back to the original check out page (problem number 2 - badly labeled buttons!).
So I clicked back, clicked the other option "cancel" which brought me to another new page, what looks like my main account page. Not what I'm looking for either! I click the back button. Again.
Despite a number of attempts at logging in to my account and looking for a way to add new CC details, I was lost. Eventually, I spotted a link in the "My Account" navigation menu on the left hand side called "Credit Cards", bingo! Finally, I was able to add my new Credit card details.
Like a lot of things in life, once I noticed the link, I couldn't understand how I'd missed it. It was right there in front of me - despite not being labeled too well, I wouldn't have noticed it even if it had said "Add new card"!
So how does this happen?
Kevin O'Regan, who has conducted many experiments in change blindness over the years notes the following:
"It seems that looking at something does not guarantee you 'see' it."
The critical factor which determines whether you see something or not is attention; in order that you see something change you must be paying attention to it.
In the case of websites, if you are paying attention to the area of the screen where the content is (generally the centre) and you are searching for the next step in completing a goal, navigation elements that are placed outside the area of focus aren't being attended to and so are ignored until such time as the goal is completed or the user comes to a dead end (as I did).
Henrik Olsen, in his article on Navigation Blindness calls this a "goal-directed click-link-or-hit-back-button" strategy.
In the case of art.com, not only were navigation elements placed completely out of my area of focus, but the lack of "scent of information" meant that I was completely lost when it came to updating my credit card details!
Integrating navigation elements into your web pages rather than creating a completely separate navigation section gets around this problem by placing navigation tools right at the centre of the user's attention.
Jason Withrow of Boxes and arrows has written an excellent article on other similarities between Cognitive Psychology and information architecture.