Create a computer simulated visitor eye-tracking heatmaps of your web page, photo, banner ad and billboard


Feng-Gui is a web service that offers visitors eye-tracking heatmaps of your website/web pages, simulated by a computer algorithm. It simulates what your website visitors see on your page over a period of 5 seconds. Then it maps that out on your website screenshot showing flow of attention over areas that got the eyeballs in color regions red, yellow and green. Red meaning the more time people’s eyes are over that area, while green being the least and yellow the mid level. There’s nothing wrong with green, atleast people are paying few milli seconds of attention on it. They call this the attention heatmap.

To get started, you can use the free attention heatmap on their home page. Make sure you have a screen shot of the website that is less than 500kb. You can create one here. Upload it and you get the heatmap. Below is the heatmap of Yahoo homepage created for free.


It has the paid version starting at 10 images for $25. If you really want to use the heatmaps on your website without the watermark, paid version is the only option available. In addition to web pages, the paid version also has the different view types to perform analysis – photo, billboard and advertisement, Each has its own algorithm for the different view types. You can choose what units of measurement you want to use, centimeters or meters, though the difference is not obvious when I tested. The interface is shown, below,


Let’s take a look at different view types starting from website.

Here’s how the looks like when eye-tracking simulation is performed, the view type is selected¬† as website,



Here’s how the eyes move (simulated not performed) over a pic of Margaret Thatcher, (you should select photo as the view type),


I prefer the heatmaps color overlay be more transparent, as this would let see the photo.

A billboard of “More than just a pretty face” movie, eyeballs simulation would look like, (of course the view type is selected as billboard)



Now, advertisements. We’ll see the Google homepage with ads and then a banner ad. The view type selected to perform the analysis is advertisement.



In addition to heatmaps, it has the Gaze plot, opacity map and areas of interest reports. Gaze plot report shows the path the eyes move quickly from one point to another. Feng-gui calls it the scan path. A Gaze plot report would look like,


Opacity map report illuminates where the eye moves and brightens that area while the other areas would be toned down opaque. The transparent area are the one which attracts more attention. An opacity map report would look like,



And finally the areas of interest report. This report breaks down the entire region into percentage a area gets attention. For some reason the Area of interest(aoi) is not showing up on the amazon homepage, so I am showing you the one they have it on their site. The area that attracts more eyeballs have a greater percentage like shown below,



Eye-tracking your visitors in real needs to have an hardware attached to their eyes, that tracks the eye movement as well as where the eyes look on a screen. The simulated algorithm Feng-gui offers is near accurate not needing a group of human eye balls to conclude a result on a heatmap. The paid version of 10 images for $25 is quite a bit expensive costing $2.5 for an image. Hope they would reduce it down a bit. As well as the heatmaps overlay should be more transparent enough to actually see what the real photo or image looks like. Otherwise you can’t just share the heatmap without the original image. Free preview looks good enough for most purposes. Finally you have to take a screenshot of a website or anything and have it in the jpg, png. bmp or gif form. They should let you just enter the URL and show the result.

Leave a Reply

Your email address will not be published. Required fields are marked *