UI Design Newsletter – September, 2008

Little-known truths about linguistics papers

Papers on linguistic theory – I used to read a lot more of them – have an interesting characteristic: the real adventure is often not in the main part of the paper. It's in the foot notes. Once you figure that out, reading them becomes much more productive and entertaining.

Web pages can work that way too. Visual designers use design hierarchy parameters (e.g., size, saturation, surround) to move people's attention to key parts of the page but not others. It's the "but not others" part that is the problem. We worry a lot about getting people to the logo, the tagline, the value proposition... and in so doing we risk relegating the real action – the links – to the footnotes.

This is a conundrum. Your visual design / composition needs to be stunning so users engage emotionally. But you also really want visitors to notice the range of what is presented on your pages (Heatmap 2 below, as opposed to Heatmap 1). Otherwise, why is it there? How do you know if your visual design is drawing attention away from the desired content and actions?

Figure 1: Before and after designs for the State Personnel Board of California. In the before image, users looked long at a few places and scanned the rest of the page. In the After image, participants perused the entire page and looked intently at many key opportunity elements.

If they don't see it, will you notice?

One problem with answering this question is that there is no effective way to directly ask it. If you retrospectively ask usability test participants what they looked at, their response will be influenced by their memory of what you asked them to do. You can ask them what they noticed, but self reporting of this sort is notoriously inaccurate – if you ask people to point to what they look at, and meld that with an eyetracking overlay of where their eyes actually went there is a startling gap. Anyway, we would be more interested to know what they didn't look at. And how do you ask that?

If you are willing to work with indirect data (and a slew of assumptions), you might look at your analytics. But looking at clicking patterns to deduce where people looked seems a stretch, too. And again, we are just as equally interested in where they didn't look. Is it reasonable to assume that if they didn't click they didn't look? It turns out, that assumption may not be as far fetched as it sounds.

How the Google checkout icon connected gazing with clicking

A recently reported marketing research study (SendTec, 2008) applied eyetracking methodologies to measure the attention-drawing effects of new and newly modified elements of search results pages. In and of itself, the study is not that interesting. Mostly it reports null or inconclusive results:

• Does putting a Google checkout icon in the right rail of a search result increase looking? No.
• Does placing a Google checkout icon in AdWord position 1,3 or 5 increase viewing? Not for positions 1 and 5. Maybe for 3, but the current study was inconclusive. A lot more data is needed.
• Does the icon draw peoples' eyes to itself (measured as fixations on) or induce increased clicks? No and no, respectively.
• Did changing the background color of the sponsored ads from blue to yellow increase the likelihood that people would look at them? Nope. Although, soothing background color not withstanding, longitudinal analysis over studies appears to indicate that people are becoming more willing to interact with sponsored ads.

However, mentioned as what seems to be an aside and detailed in the appendix (ok, not the footnotes, but...), the study also reports that there is a strong correlation where people look and where they click on search results pages*. OK, perhaps they didn't feel like they should amplify a finding that seems, well, obvious. But it's really the other side of their finding that is more important to designers: People are less likely to click where they don't look. Still seems too obvious?

It's interesting to watch people look at eye-tracking findings. They look a bit like hurricane maps. People get most excited about findings where the gaze patterns are highly organized... and look a bit like a well-formed hurricane. "See, the key element grabbed and drew participants attention. They lingered there. They were really drawn into the message. The visual design works!"

Maybe, if you are doing eyetracking analysis for print advertising. Think about it this way: The goal of a print ad is to convey one clear message. So print designers strive to draw you to and through one path (as was discussed in a previous newsletter). The eyetracking analysis of a print ad should look like a hurricane map: hot and organized.

In contrast, the goal of a website is to convey the range of information/interactions that provide value. So, the visual design objective of a website is to draw your attention to move around the page. As such, eyetracking results for a well-formed web page would look less like a hurricane and more like scattered (albeit intense) showers.

Hot spots – concerted looking – are good. But well distributed green spots – exploratory gazing – are equally important. Because, as the SendTec team points out, if you never look at a link, you are rather unlikely to click it.

Footnote

References

California State Personnel Board case study, Human Factors International, (2007).

Eyetools Study Report: Does the Google Checkout icon attract more visual attention to right hand rail advertisements? SendTec.

Having worked with eyetracking data since 1976, I am both very familiar and profoundly skeptical of its value. We can't tell if people are processing what they "see" and we can't tell what they feel by where they scan. But Kath points out an outstanding value for eyetracking. If there is no fixation we cannot possibly process the content. If there is no fixation we can't be influenced. Amazing, but the part we should pay attention to in our eyetracking results is probably the area that is NOT highlighted!! Fantastic insight Kath!