AttentionWizard – Attention Prediction Tool for Landing Pages
If you’re a designer, things are never as easy as “making things pretty”. More often that not, a graphic designer has to design something that will sell. A lot of times the design experience will help with optimising a design for conversion; however there are times when experience and flair will only take you that far. Anyone who ever struggled to squeeze a higher conversion rate from a landing page knows this.
So I recently came across AttentionWizard and I think this may be an answer to our conversion optimisation problems. AttentionWizard is a “Visual Attention Prediction Tool for Landing Pages” – in other words it creates an “attention heatmap” of a web page that predicts where someone would look during the first few seconds of their visit. Apparently, AttentionWizard uses advanced artificial intelligence algorithms to simulate human visual processing and attention. Can be used midway through the design process, as it doesn’t require actual viewers or mouse clicks.
Obviously, since all it requires is an image to analyse this can be used not only for landing pages but for flyers or brochures as well.
The Free version
The product can get quite pricey – however, there is a free, ‘Lite’ version available: “AttentionWizard Lite is a FREE product designed for occasional quick-and-dirty “sanity checks” of landing pages or design mock-ups. It is our commitment to you that we will always have a free version of the tool available. AttentionWizard Lite is intended for personal use by designers and is not meant to be shared with co-workers or clients.” (It wouldn’t be, the resulting heatmap has got a large watermark.)
There are some other limitations as well:
- Heatmap Quality – Reduced size and resolution (smaller than original image)
- Frequency of Use – One per day (restricted by IP address)
- Processing Time – 0-2 hours based on number of concurrent Lite users
Testing the product
I gave the Lite version a try on one of the landing pages I’ve done for a client:
The resulting heatmap looked like this:
Interpretation
A few aspects are immediately apparent:
- The head of the guy in the background seems to polarise attention: a bad thing for a landing page where the focus should be the information and the form area; getting rid of the head seems indicated
- the iiNet logo attracts immediate attention, and the trixbox one none at all; this is actually a good thing, since iiNet is the stronger brand, the one that will drive the conversion
- The other points of attention on the page are the offer (Breakeven and ROI calculator), the contact information in the lower left corner (good), and the download button (excellent)
- Entertainingly enough, following the succession of eye movements reveals that the eye of the hypothetical visitor would return quite a few times to the face of the girl. Note to self: use a less pretty one next time :)
The verdict: definitely a cool little tool to use on a landing page design to make sure there are no things distracting attention from the conversion elements; I will be using this in the future. Even more so considering the alternative involves recruiting an audience, sitting them down for a test and monitoring their eye movenets and mouse clicks – and operation that may very well yield a much more precise result, but would also cost you upward of USD3,500 per landing page.
For a more in-depth presentation, check out the video below (it goes on for some 10 minutes, but it’s worth watching):
More info on the AttentionWizard website: http://www.attentionwizard.com
