As a kid, I used to love playing Where’s Wally (although in Germany we’d call it Where’s Walter). But every now and again, I just couldn’t find that red-striped shirt, hat and nerdy glasses. It would drive me crazy. I knew he was there somewhere on that jam-packed beach, but I just couldn’t see him. Today I don’t play Where’s Wally anymore. But every so often I play a variation of it: ‘Where’s the login’ or ‘Where’s the email address’ or ‘Where’s the link’. And just as back in the Wally-days, it can get very frustrating.
There are a number of reasons why finding something on a page can be hard work: navigation options might be buried in complicated menus, the information can be hard to understand, or the design of the page can be visually noisy.
Conducting user testing helps us understand what the problems are. But while watching people interact with a website can tell that something is not working, we can’t always tell why. Every now and again we’ll report that participants didn’t “see” something. But how do we know whether users literally didn’t see a button or a link? Could it be they saw it and ignored it because they didn’t know what it would do? The answer is that we don’t always know.
This is where eye tracking comes in. Tracking eye movements using sophisticated sensors allow us to tell exactly what people are looking at.
For example, if I am looking at a Where’s Wally picture, researchers can follow my gaze as I go hunting for him. After I find him, they can analyse my eye tracking data to reveal which paths I used to track him down and in which sequence. They can also see which faces and objects in the crowd catch my attention and where I centre my search. Then, after watching more people look for Wally in the same picture, they can analyse the patterns and understand how people generally view the image.
These eye tracking patterns can tell you a lot about the state of your page design. Here are the gaze paths of two users looking at the xero.co.nz homepage for 25 seconds. Each dot on this screen represents a step on the visual journey across the page:
The users gaze moves systematically from element to element. Both users start their exploration on the logo and the key message, before their attention is drawn to the large image on the right. Then they see the elements further down the page, maybe looking for keywords of personal relevance.
This design works well. The important stuff looks more important, and things that are related logically are also related visually (we call this having a clear visual hierarchy). In other words, the design leads the user’s eye through the page.
Compare this result to the gaze plot of two users on telstraclear.co.nz:
The plot is less systematic. Like on the Xero homepage, users start looking at the large picture at the top, but then their gaze scatters, moving back and forth between various elements. Perhaps most disturbingly, their attention is drawn to an orange banner that implies that they may have trouble calling TelstraClear. In 28 seconds, the main navigation (the purple box on the left) is hardly noticed at all.
This is a definite Where’s Wally scenario. Instead of quickly getting an overview of what TelstraClear offers, users have to dig through a pile of visual clutter.
Eye tracking can tell interesting and sometimes surprising stories about your users’ unconscious interaction with a website. Understanding where people look and in what order can reveal insights that no other research method can. However, the real strength lies in combining these stories with the user’s verbal and non-verbal responses, including their comments, body language and facial expressions. This combo will help ensure that your website visitors can always find Wally.
- Want to do eye tracking on your website? Email [email protected].
