"Reaction [beta]"
Virgin on successful 28 Apr 2006
Before:
After:
Since we released our eye tracking demo video last month, we've been inundated with emails about Virgin Megastores' "DVDs from £4.99" banner. Most people can't believe that a banner of that size, positioned above the fold and placed slap bang in the middle of the page, could be overlooked by users. Yet it happened (We were there! Honest!).
Several theories have been put forward as to why this element was ignored, yet none provides the definitive explanation. Perhaps the red didn't contrast enough with the website's grey background colours? Perhaps users were distracted by other page elements, like the tabbed navigation at the top of the page? Perhaps, this was just another example of "banner blindness" - the usability theory that states that users will avoid anything that looks, sounds or smells like an ad?
We have to admit, we were perplexed too. We've seen page elements ignored many times before, but none that were so seemingly obvious. So when we saw that Virgin had updated its homepage with a green "3 for £20" banner, we decided to run another eye tracking study.
As you can see from the results above, the green banner outperforms the old banner - attracting far more attention. So, as the rest of the page remains largely unchanged, it seems that many of our theories regarding the original red banner's invisibility were incorrect (or at least, less important than we had thought). The only theory that still holds weight is that pertaining to colour usage - green certainly does seem more vivid in the new design.
A cautionary note however, further analysis of the study data reveals that the green banner was seen by less than 25% of users - so it looks like there's more work to be done.
(It's also interesting to note how the green banner has seemingly drawn attention away from the main tabbed navigation menu at the top of the page, and that focus has shifted towards the search feature. Just goes to show that even the simplest of design tweaks, can change our experience of a page significantly.)
Next article: What iSay and what iDo...
Previous article: Somebody needs a hug
Bookmark this page
Trackbacks
To create a TrackBack to this entry simply append ping/ to the permalink URL for this page.
14 comments so far
Sam Anz 30 Apr 2006 02:46 AM
Personally, I think it might happen to be that the in the red banner the word that stands out is SALE.
Damien 2 May 2006 06:19 PM
Yeah, I think its the word SALE written huge. "Sale" to me says "here is some crap you aren't interested in, at low low prices".
The second banner, with the price as the biggest letters, feels like something that might be valuable to me. I think maybe there is less artificial urgency projected, you don't seem quite so desperate to unload merchandise ("SALE!!!!"), and I'll feel like I'm more likely to have a good experience with the whole thing.
paul 3 May 2006 12:09 AM
Obviously it is the word SALE which has the largest bearing. The viewer can grasp the entire concept of the red banner through their periphal vision. To see that viewers comprehend the advertisement, just note the different directions from which they approach the DVD tab. What this means is that the red banner is effectively communicating its message, while the green banner is less soluble.
Etre 3 May 2006 10:19 AM
Something else to bear in mind is that the red banner was animated - albeit quite subtly. The yellow tag line beneath the word "SALE" changed to display pricing for CDs and games, in addition to DVDs (as shown in the image above). The green banner wasn’t animated.
Robert-Jan 4 May 2006 07:21 PM
About the test setup. How many participants did you use? Did you use the same goup of participants on both webpages?
Etre 4 May 2006 10:26 PM
Robert-Jan: Both pages were tested with 30 participants. Different groups tested the two designs.
Sam Anz 5 May 2006 06:34 AM
What I had in mind was a matter of digestion. I'm going to guess that the amount of time that is spent at a certian area has some baring on the outcome in the test. No digestion is needed for the word SALE. Its meaning is quite transparent, compared to the green banner. The fact that the Red banner was animated though shouldn't change much. The user knows that the prices listed are intended to reflect a lower pricing. The idea has already been conveyed. To me, and remember I have no experiance with any of this, this lends me to believe that eye tracking isn't a totaly reliable tool by itself. For one, I would love to see, if you could isolate other variables, if in this case one or the other banners leads to increased sales.
Etre 7 May 2006 12:27 PM
Sam: Thanks for your comments. Unfortunately, Virgin Megastores isn't a client of ours, so we're unable to tell you how the two banners performed in terms of sales.
As the heatmaps above show the distribution of attention, your theory stands up well: It does seem plausible that the red banner received less attention because its message required little digestion.
Intrigued by your interpretation, we decided to dig a little deeper into the data. What we found was quite interesting: It seems that no user looked at the red banner text for longer than 100ms.
Research conducted in the 1980s states that a duration of less than 100ms is sufficiently short enough to render the person effectively blind. This suggests that the red banner wasn't seen by our users - at least, not consciously.
This doesn't rule out your theory - perhaps, our users were able to process the banner on some subconscious level - however, I doubt this is the effect that Virgin would have wanted.
Iain 7 May 2006 04:40 PM
Being cynical, I'd say that Virgin won't have cared whether users saw their red banner or not. I'm sure they'd rather users pay for full-price DVDs than take advantage of their sale.
Sam Anz 7 May 2006 05:59 PM
Thanks 'Etre' for your great reply.
I find this eye tracking idea quite interesting, so while I have you intrigued, maybe I can pick your brain a little bit.
I was wondering how peripheral vision fits in to the whole scheme. I had in the back of my head while I was writing the last post that the way I move throughout a website is the culmination of two phases. The first is determining if a section is worth focusing my attention toward - an process which is subconscious and perhaps taking part of in my peripheral vision -, and the next is actually looking at it.
The Word SALE, as I've said, needs no digestion, so perhaps my subconscious determined no use in focusing on it, not the case in the green banner.
Saying that, I agree with you that you are right that subconscious peripheral vision is not as good as a direct look. What I am interested in is the fact that my deranged logic here came to the theory that perhaps making a section more complicated is helpful.
Etre 8 May 2006 03:29 PM
Sam: Research suggests that visual attention may comprise two phases - a "Where" phase and a "What" phase. It sounds to me like you're describing the "Where" phase.
The "Where" phase works like so: When you look at a stimulus - e.g. a webpage - you immediately take in the entire scene in parallel via your peripheral vision. This brief "snapshot" is mostly low resolution, yet it allows the interesting features of the stimulus to pop out in your field of view. These features are then selected for detailed inspection during the "What" phase.
The "What" phase sees you repositioning your eyes over each interesting feature, engaging your attention so that they may be perceived at high resolution. The "What" phase is what our heatmaps capture (if that makes sense!).
Unfortunately, this theoretical model is incomplete, as it suggests that directing our attention is largely an involuntary process. It suggests that it is the interesting features of a stimulus that directs our eye movements. This is only part of the story. We all know that we can voluntarily direct our attention too (For example, if I told you to look at the top left corner of the page, you could. The interesting features of the page would not prevent you from doing so).
Hopefully these mad ramblings answer your questions around where peripheral vision fits into the scheme of things.
As for your question on whether making sections more complex would be helpful in attracting users attention: Well, there is evidence to suggest that smaller type encourages longer, more-focused viewing behaviour (i.e. reading); while larger type promotes faster and lighter scanning. However, I wouldn't advocate setting your entire site in 6pt type. This would make for extremely uncomfortable reading and pose some real accessibility issues!
Josh Peters 10 May 2006 06:46 PM
Have you considered taking copies of each banner and photoshopping the color so that the red one is green and the green one is red? Perhaps there's something to the color that makes people ignore it if it's in their peripherial vision?
Etre 11 May 2006 10:15 AM
Josh: That's a really good idea - we'll see what we can do - stay tuned! Red is Virgin's signature colour and is used widely throughout the site, so its quite possible that over-exposure led users to filter it out.
Steve Graham 1 Jun 2006 10:50 PM
Could you please explain, or expound on the statement that "100ms is sufficiently short enough to render the person effectively blind."
Blind to what? Color, Light, ??
Also, do you know who was conducting and or paying for the study? (was it military research, or civilian)
Thanks,
Steve