Feng GUI Viewfinder Heatmap is a free web service that uses an artificial intelligence algorithm to emulate human eye movements and generate heatmaps for websites and images.
It allows you to define a URL or upload an image and then superimposes a heatmap on it which displays the ’hot spots’ on the image or URL that the human eye will gravitate to.
This service can generate heatmaps that web designers, designers, or visual artists of all kinds can use to get an insight as to the areas and/or design elements in their images or websites that the human eye automatically gravitates to.
Here are some notes on this:
- What is a heatmap: colored, semi-transparent areas superimposed on an image or snapshot of a website that identify the areas where the eyes gravitate to or tend to linger using warm/reddish colors and other areas less likely to attract attention using cooler bluish colors (with green as the middle).
- Usage: enter a URL address in the designated box or click the upload button to upload an image. After that all you have to do is click the ’Heatmap’ button to see the result.
- The Technology: the service employs the neuroscience concept of “saliency” and claims to “simulate human visual attention and create an attention heatmap”. From reading the site and blog you get the feeling that there is a high degree of confidence in the validity of generated results (i.e. that the modeling and the concepts are well established and accepted). There isn’t much information with respect to verifying the generated results or comparing with heatmaps made through actually observing the eye movements of human subjects. Face and text detection is promised but not employed yet.
- The output: there’s a little slider on the left of the generated heat map image that can be used to increase/decrease the contrast of the heatmap to make it more or less visible. Note that the generated heatmap will encompass only the top visible part of the website screenshot without scrolling down.
- Browser integration: you can install a Firefox add on to instantly generate a heatmap of the site you are visiting. You can also create a javascript bookmarklet. Go to the tools section.
- The gallery: a really cool section of the website that illustrates interesting visual concepts from so-called smart thumbnails to focal centers, etc.
So, what did I learn after generating a heatmap for Freewaregenius? That the orange lightbulb in the Freewaregenius logo is apparently the most attractive element to the human eye, followed typically by the screenshot thumbnail; nothing really unexpected but still I like this service if just for the potential for interesting insights. Check it out for sure.
Version tested: the site as of 9/18/2007
Go to the Feng-GUI page.
