Wednesday, March 10, 2010

User Attention Heatmap

Couple of services offers “ Creating visual heatmaps “ for certain document. They are able to analyze website or photo and highlight areas getting most of the attention.

squidoo clickdensity heatmap crazyegg

Some services are able to directly analyze WebPages using their statistics, frequently visitors clicks.

Tools like FENG or attentionwizard are able to analyze certain document or photo using "Eye Tracking Without the Eyes" algorithms to simulate human visual processing and attention.

They are not directly designed to analyze desktop GUIs, which are dynamic, and content of 3D window naturally gets most of the attention. I wonder how interface like Inventor Fusion may look like under eye-tracking study, where technology appeared to be presenting options based on the task with some predictive choices based on contextual next step/options for the selected feature. Preview looks futuristic like a movie interfaces.

Eye-tracking studies are used for desktop UIs interaction research. I advise anyone interested to watch interesting presentation about Office Ribbon story (slide to 110).

I decided to test and play with some of the tools available for free, FENG-GUI and attentionwizard .

Nemetschek Scia website

This is attention heatmap result for Scia Engineer website. It is well organized, and actual content – Release of 2010 - grabs most of the attention. But you can also notice, that there are lot of different hotspots, which is generally evaluated as negative aspect – it is hard to keep focus on most important ones. Hotspot with second most attention points is not linked to any other page.

image

Microsoft Office

In MS Words empty document, main user focus is on most frequently used text formatting tools – font properties. Situation is different when you use same analysis for document with content – content naturally grabs your attention, since then it is all about the content. Results are similar to available real results for ribbon attention heatmaps.

0e92b2e3-bf4c-4d82-9f6c-e7e6347eccfa

70437f4f-ef83-4a7c-8180-da6379096a00

4354741e-a962-4ed2-9550-dfaaa80f4f92

Scia Engineer

Not frequently used scroll bars holds too many space, it is also most attention hotspot. It makes no difference if different layout is used.

eb1cd535-b6b6-45ff-8cfc-bcf7dbd6a8ea (1)

a3df96c4-3074-43f6-b52b-a713b9689c2f

In single check, the natural focus is on the beam stirrups schematics with detailed graphic and text. Results and calculation options are not in main focus.

9fdbd851-3e73-4529-8c08-f0ad4ed8100a

663700f0-cb46-402d-9343-b73f54486393

library

63b7ac9c-89b2-4e82-9fe1-b2a6b0e48730 a792884e-e3c4-4deb-aef9-2dabe6c3696b

Others

35d68ff3-3887-4af6-a7aa-25c3215f7b4bsolidworks

revit_heatmap

1 comment:

Andrea said...

This article is highly informative. I got to know the importance of attention heat maps. Using attention heatmaps the website developer can easily identify the problem and boring area of the website. In this way the developer can make changes to design it in more interactive way.
attention tracking