The Net Effect: Eyes That Buy

At StomperNet, where I serve as staff and faculty, we're giving away Stomping the Search Engines 2, a rewrite of the original empire launching STSE from Brad Fallon and Andy Jenkins.

Shown at right is Page 2 of Eyes That Buy from The Net EffectVolume 1, Issue 1

Check out the video for some of StomperNet's success stories -- it's amazing. These guys launched their internet business training program after creating successful online e-commerce sites, and have become a juggernaut of internet business success -- see the StomperNet Universe of freely available content.

So you can get an 8 hour DVD course if you take us up on the ask to you try a subscription to our new print publication, "The Net Effect" (and pay shipping & handling).

Here's a snapshot of a moment from the video where my article in the first issue of the Net Effect is featured:


The first page is full of an explanation of how humans interact through vision with web pages, while page 2 focuses on take-aways. You see 3 of about 7 tips here.

  1. Use color smartly. A single item varying in color is processed by hardware early in the processing flow, or pre-attentively, and creates visual popout, drawing the eye.
  2. Chunk with implied boundaries: Forget horizontal rule (HR) tags, they're useless to the peripheral vision. Use implied borders and Gestalt principles visual completion.
  3. Break the Grid: Symmetry is pleasing to humans, and a well balanced page communicates ease of use to the user, but you can break this symmetry very strategically to call attention to a location.

So, you can get the first issue and a full course on SEO from some of the best over on this salesletter. (Yes, somehow the sales letter genre manages to break many of the rules of web design, but it is chunked!)

Why the Mouse Doesn't Always Keep Up with the Eye

There's a lot of buzz around "mouse tracking" and analytic tools that record mouse position, like the super nifty Robot Replay. It's natural to wonder if mouse tracking might offer some of the value of eye tracking at much lower cost and much greater scale. I've written about the state of understanding of mouse and eye synchronization before; this post looks at a different viewpoint, setting a maximum bound on the potential relationship between the mouse and the eye.

Fitt's law states that the time to move the mouse from one point to another is heavily influenced by both the distance of the mouse from the target and the size of the target. While it's very easy to over-apply this to site and software design, it is a solid truism of human computer interaction.

This relationship between time and distance doesn't hold in the same way for eye-movements. Given this, research from Google surprisingly shows an increased duration of "sweeps", or leftward motions like carriage returns homing the eye to the next line of text.

Beymer, D., Russell, D. M., Orton, P.Z. An Eye Tracking Study of How Pictures Influence Online Reading, INTERACT Conference, Rio de Janerio, Brazil (September, 2007) PDF-515Kb.
While the researchers do see time increase with distance, looking at the data more closely shows this is due to a large number of correction saccades, not an increase in the duration of the first saccade.

To illustrate this point in another way, when the font size changes from 10 to 14 point, the average distance of saccades increase. So, you read very similarly with different font sizes -- the increased size neither speeds or slows your saccades, despite changing the total distance.

This finding is also supported by Silbert, Jakob, et al. (2000):
Evaluation And Analysis Of Eye Gaze Interaction - Sibert ... 5 Speed and accuracy of saccadic eye movements: Characteristic. ... 2 Fitts' law and the microstructure of rapid discrete movement..
Eye movement is largely independent of distance.

However, for visual items that are not well separated by white space, like typical successive lines of text in the Beymer study, the accuracy of saccades does decrease as the distinctiveness of the target decreases.

While operating system designers, and perhaps browser designers -- any highly used software with toolbars -- do need to pay attention to button size, the key for good design for vision is not distance. It's an elusive property of contrast, shape, color, and even typographical semantics.

To return the the title theme of this post, the mouse simply can't keep up in many cases. The eye is a capable of moving more rapidly than the hand can move the mouse. Hence, Silbert, et all, and many other researchers have been able to get user efficiency gains from gaze based selection. The challenge of course, is distinguishing between intentional selection and simple inspection (aka the Midas Touch problem).

So, while mouse tracking can inform on where the users attention is focused, and it certainly is a great way to visualize user activity, the mouse is simply slower than the eye and destined to reveal less of the users behavior than eye tracking.

Eye Miles: Measuring Mental Effort and Design Quality with Eye-Tracking

While eye-tracking is incredibly useful for understanding how humans interact with computers, and websites in particular, it's something of a holy grail to be able to instantly interpret from eye tracking data whether a design is good or bad.

There's a solid amount of prior art here, but no widely practiced & easily obtainable top level metrics. Check out Table 1 from a HCI2007 paper by Ehmke & Wilson titled "Identifying Web Usability Problems from Eye-Tracking Data" for a complete review of metrics considered.

While analyzing the data for the Scrutinizer Click Fu video for a study we did on our Tobii eye-tracker, we computed mouse miles for a couple participants. Here's what we came up with:

This is the distance the eye traveled during a Question/Answer study in which users were asked to choose a search result that had or led to an answer to the question provided.

This "eye miles" metric in concept, if not name, seems to have had it's first appearance in 2002: Goldberg, J. H., Stimson, M. J., Lewenstein, M., Scott, N., and Wichansky, A. M. Eye tracking in web search tasks: Design implications. In Proceedings of the Eye tracking research and applications symposium (ETRA 2002). ACM Press, New York, NY, 2002, 51-58. . Personally, I released a analytics system for measuring mousemiles in 2001. A more robust metric would, to carry the analogy further, distinguish between highway and city miles. For eye tracking, where major and minor saccades (eg. short and long) indicate very different underlying cognitive functions, this might be especially informative.

We'll keep on searching for the best diagnostic metrics from eye-tracking. Perhaps some of them will apply to user activity with our gaze simulating web browser as well?

Scrutinizing the Shopping Experience

Over at StomperNet, we've just released the Scrutinizer browser as a free download.

Here's a (video only) screencast of me using the Scrutinzer browser to shop for the XBOX 360 game "Assassin's Creed" at Amazon. It takes me 2 minutes. First, I find the 360 games category quickly @0:20, but chose the wrong game genre category, fighting @0:43. Next up, I chose adventure @1:08 (turns out it's in action).

After two wrong tries, I resort to search @1:15, but I'm set to search in the adventure category and have to reset it to search all xbox games. I finally reach the page @1:38, and add-to-cart, success.

We produced a super engaging 30 minute video with animation explaining this, but in short, the tool simulates the limited high resolution vision available to humans as they use the computer. The visual simulation allows me to zoom in and out of the page and illustrates the tunnel vision a user has given a specific goal.



The tool is freely available (happy holidays!) and you can learn more about the principles behind it, how to use it, and get the download at http://about.stompernet.com/scrutinizer.

Shout out to the WebMetrics Guru blog who garnered some interesting insights from the video alone, and to The Scobleizer for the generous props.

Gaze Tracking in the Real World: ROI on Physical Advertisements

Roel Vertegaal recounted back at CHI 2003 that he was done with eye fixation tracking and focused on devices with cheap cameras that could simply detect whether they were receiving visual attention, or not. An alarm clock might offer different interfaces, a digital camera display might come on -- all sorts of possibilities.

Looks like Roel's come up with a more lucrative way, at least in the short run, to monetize the detection of attention -- measuring real world advertising. See the EE Times, New Scientist, or Engadget articles for detail.

Wow! That's a lot of action. It's not quite Minority Report, with video ads personalizing themselves, but I expect we may see a return to fashion of sunglasses indoors!

StomperNet: Getting Serious

In the StomperNet "Getting Serious" Series 1 video, I'm lucky enough to provide an opening act to the guru faculty of StomperNet with a conscious raiser on web site design.

We all have an intuitive appreciation for a well designed site, but it's holistic, while the actual truth of the experience of assessing the design is that it's a series of small samples from your visual system stitched together.

The image below is a small excerpt from my segment of the video, the first 6.5 minutes, and depicts the high resolution foveal area of vision and the low resolution periphery. There's also a short video from the discovery phase on this tech over at my surfMind blog.


Check out the video. Following what I hope is a "eye opener" on how site design affects user behavior, there's some great stuff from the other Stomper faculty on nofollow attributes, web analytics, and AdWords.

Digg It -

Eye Tracking vs Mouse Tracking

With more and more tools available to monitor mouse movement, like RobotReplay, the question of whether mouse tracking can be substituted, or at least partially replicate, eye tracking is active.

This eye tracking video of Squidoo by ETRE demonstrates both times of synch between eye and mouse and times where they diverge. If you watch carefully, you'll see that given an intent / opportunity to click in the current user activity, the mouse is much more likely to be close to the eye.

This is a basic rationality that says "If I might click, I might as well keep the mouse close to my eyes." Where there's no potential to click, either because the user is in an evaluative mode or the content of interest is devoid of links, the mouse and eye diverge.

The scientific literature is closing in on this interpretation with results which show that mouse position is predictive of gaze, sometimes. How this partial mapping can best be turned into value is to be determined, but take a peek at robot replay's demos as watching the user's mouse interact with the page does create a powerful interpretation of the experience.

Update: Summary of research on eye - mouse synch available from: Edmonds, A., White, R., Morris, D., Drucker, S. Instrumenting the Dynamic Web. Journal of Web Engineering (JWE), Vol. 6, No. 3 (2007), 243-260.

Button Gravity Caught in Eye Gaze

A learning from commercial usability work in the nineties still holds true. Button gravity describes the tendency for users to home to the bottom submit button on a form page.

One of our early designs for the new e-commerce transaction flow suffered from an unfortunate case of button gravity. Note: This is a phenomena that you can use to aid your site's efficiency, by making it work for you, not against you.

The image below shows a step in the checkout process where the user can select "same as billing" for ship-to, or enter an alternate ship-to address. The green numbered circles, and the blue "meta steps", show the ordering of user attention while working through a checkout.

The user first checks out the billing address, quite in detail, and should have determined that this was the desired outcome. He proceeds to check the price and order contents and is drawn into the last submit button on the page by sheer force of gravity! He realizes this is not the right option and eventually makes his way back to the correct button at the top of the screen.

Built with BlogCFC, version 5.9. Contact Andy Edmonds or read more at Free IQ or SurfMind. © 2007.