UsabilityOne - Eye Tracking and Website Usability Research

Eye Tracking and Website Usability Research

Eye tracking in usability research has become somewhat of a polarising force among both usability practitioners and clients. In one camp we have those who see no value in eye tracking what so ever and consider it a gimmick and on the other end if the scale, are those who see the technology as such an integral part of the research process that it cannot be done without.

We feel that eye tracking is an extremely powerful tool and can be used to provide valuable insights; however, eye tracking is not a tool that is best employed in every project. We find deciding on whether eye tracking is suitable is best taken on a case by case basis and we will not discuss where it is applicable here. This article seeks to provide some tips to keep in mind during preparation and execution of an eye tracking study which will help to ensure that the research yields clear and insightful results.

The materials

Similar to standard usability methodologies, our eye tracking methodology is extensible to test materials ranging in their level of development from flat screen visual prototypes  and navigable wireframes right through to live websites. The use of live websites or fully developed prototypes is the most natural in terms of presenting test participants with the same interface that your real users will see, however, this is not practical when developing a new interface or validating changes to an existing one.

Visual concepts, wireframes and navigable prototypes allow the interface to be tested without the effort involved in full development and eye tracking can be an invaluable part of that process. While insights can be gathered for any type of test artefact, the following are some pointers on how visual concepts and prototype test materials can support the research process and improve the outcomes.

Visual design concepts:

Visual design concepts are flat prototypes used to represent new website designs or a change to the design of an existing website. These materials are a product of the early stages of the visual design process and while they are generally not navigable they can be very useful in assessing the usability of the design at an early stage

Eye Tracking is very effective in testing of website design concepts particularly in testing design variants at the early stages of development and assessing whether a visual design change will impact the usability of an existing website.

  • Avoid leaving blank spots. Large blank spots on visual designs where content or imagery would appear in the final implementation serves to funnel participant attention to the surrounding areas and can influence the research outcomes
  • Use representative imagery. Using imagery that is clearly out of place with respect to the brand of the organisation and the purpose of the website often draws the participant’s attention unnaturally and so muddies the data set
  • Use appropriate place holder text. Place holder content should be reasonably representative of the type of content that will appear on the page. Content that is clearly out of context often draws participant attention, not because they are interested in it but because it is out of place.

Wireframes and navigable prototypes:

Wireframes are produced as part of the interaction design process and are used to model the navigation structure, layout and information architecture of a new website. Wireframes and navigable prototypes range from basic black and white layouts with limited navigability to fully navigable prototypes which have visual design applied.

Wireframe prototypes often have no visual design, however, this not preclude the use of an eye tracking methodology to test these materials and it’s use is extremely useful in gaining insight into placement of page elements, the effectiveness of the navigation scheme and in providing direction for layout changes.

The following guidelines apply to all types of prototype interfaces when used in an eye tracking study.

  • Make layouts as consistent as possible as the user navigates through the prototype. While these materials by nature are not 100% developed,  making the layout as consistent as possible helps the analyst to identify trends in participant attention as they navigate through workflows in the interface
  • Avoid large blank spots. As with visual concepts blank spots can be troublesome and affect the data
  • Avoid including visually prominent, interactive or colourful page elements on an otherwise black and white or flat wireframe. Such elements will attract undue attention in this context
  • Do not edit in between sessions. It can be tempting to make small or obvious changes to prototypes in the middle of testing, especially with wireframes, however, this can affect the validity of the data set across all participants.
Eye tracking heat map

Execution and analysis

Observing an eye tracking session is similar to observing a standard usability session with the key difference that the observers can see the real time eye movements of the participant as they interact with their website. Observing user sessions is always an enlightening experience, however, seeing the participant’s eye movements adds another valuable layer to the observers understanding of how their users view and use their website.

Our clients find this experience extremely engaging, however, as with standard user testing, it is important not to jump to conclusions. It’s easy to begin to form opinions and draw conclusions based on the behaviour of a few participants, especially when you can see exactly where they are looking in real time. It is important to remember that you are seeing only a very small part of the whole data set and that the real value that eye tracking provides comes from analysis of the data across the entire participant sample. What can appear clean cut at first glance often turns out to be something completely different or to be nothing at all. Often we find that seemingly clear cut issues have a completely unexpected root cause once the data has been reviewed and analysed.

UsabilityOne observation rooms

In our experience when eye tracking is employed in a strong methodology the result is much more than just pretty heat-maps.  It results in the discovery of real and objective insights to your user’s behaviour and the usability of your website.  Ultimately this quantifiable evidence can be used to facilitate improvements to the site.

Whatever business or design challenge you are working on, we'll put together the right approach to suit your specific situation.

Please contact us to discuss your needs