Eye Tracking for Design

I recently read an article on eye tracking and how it relates to usability in technical communication. Prior to reading this article, my only knowledge of eye-tracking was the issue it presented for some children that struggle with reading. Sometimes children with eye-tracking issues tend to read at a slower pace. Research has led to exercises and techniques to help resolve eye-tracking issues in children.

Eye-tracking technology

Eye-tracking technology uses two different systems to collect eye movement data. The information collected from eye tracking technology can unveil habits of the human eye that otherwise may not be detected in other data collection tools. Two different types of hardware, head-mounted and remote systems, are used to record eye movement at any given moment and for how long the eye spends looking in any one place. Head mounted systems measure pupil glint to distinguish eye movement from head movement. Remote systems measure the position of the eye compared to a fixed point of reference. Because of this, remote systems, require the person's head to remain motionless. Recent innovations in remote systems are allowing for more head movement.

After data has been collected it is run through eye tracking software. There is a range in the eye tracking software, but most have some common features. Data can be compared in a video format like ERICA's Eye Gaze (TM), where eye movements and fixations are measured with a moving, small read x. In another format, data is tracked on x/y coordinates on a computer screen.

Information acquired through this technology

Data retrieved from this technology can be organized in different ways, but focus on fixations and saccades, which in turn give us the path that the eye follows - scanpaths. Eye fixations are points where the eye is focused on a specific point on a screen for a period of time (250 to 500 milliseconds). Fixations are examined for duration and frequency. Saccades are the movement of the eye between fixed points, which can last between 25 and 100 milliseconds). Together in sequential order, fixations and saccades are organized into scanpaths that allow for the tracking of eye movement that may not be otherwise attainable. Scanpath analysis can then be used to interpret how people visually proceed through a document.

How eye tracking is used for web and user interface design

As designers seek to increase usability in their websites, eye tracking could be that missing element that they need to consider. Web designers should utilize eye-tracking studies that examine web page screens and layouts and their effects on usability in order to create more efficient sites.

A study conducted by the Poynter Institute in conjunction with Stanford University tested 66 online newspaper readers' eyes and the conclusion was that readers "prefer text over graphics as entry points into Web sites. The research team concluded "... it appears a (news)paper provider's first and best chance to engage the reader is through text," this kind of eye-tracking information can be invaluable to an online newspaper looking to increase its viewership.

There are several examples and conclusions that further illustrate the importance of eye-tracking for website design as outlined in later collaborative study by the Poynter Institute:

• another major conclusion of eye-tracking studies show that people's first scan of a website is performed in "z" pattern in order to view all of the content before they continue on in a website.
  

• smaller text resulted in attentive reading, while larger text encouraged browsing
  

• Underlined information created distraction, bolder text for headings is more effective
  

• users preferred shorter blocks of text
  

• links should offers descriptions

• larger images (210 x 230 pixels) were preferred over smaller ones, when images and text are paired together they should link to the same location

In commonly used drop-down menus, eye-tracking research has shown that people read in a common scan pattern. Users largely tended to read the first couple of choices, then skip to the bottom and then conclude by reading the middle. In application for designers, they would want to put their most commonly used options at the top or the bottom of a drop-down menu in order to increase their ability to be located.

Unlike in drop-down menus, people's scanpaths do not always follow a similar pattern. User' s scanpaths differ based on the type of the website. Different websites cause readers to view and scan in different patterns. The orientation and purpose of the website changes eye-tracking in the user. Current eye-tracking studies seem to suggest that form may need to follow function for web sites to increase usability. In other words, the nature of the site needs to be in harmony with the viewer's scanpath for optimal usability.

Now that eye-tracking research is documented to support usability, there are many emerging companies that are offering eye-tracking methods to evaluate websites. Etre Limited measures users' eye movement in real time and converts the visual activity into heat maps. Heat maps use a color scheme to show what users are paying attention to and what they miss. In this two minute video, Etre demonstrates an eye-tracking session and its effect on usability.



Designers have always linked form and function but until recently, habits of the eye had not been fully considered for usability purposes. As designers continue to seek greater usability for their sites and solve usability issues, eye-tracking adds another facet to create the most effective websites. Eye-tracking research has a firm place in usability design.