Technology : The Vision of Future: Eye Tracking and Web Designing

Eye tracking is one of the UX approach to be considered while building UI.

Eye tracking in UI referes to the behaviour of user's eye while traversing UI. There are some useful eye tracking tips that could be followed to develop a sucessful UI.

It takes users about 2-3 seconds to rate your website based on content , look and feel. And an optimized use of this 2-3 seconds by an UI developer can result in success and failure of UI.

Find out where user see first while opening your website, what draws the maximum user attention.
To find out this, eye tracking study plays a vital role.

1. 'F' shaped :

Top left part is the first point where users normally fix their eyes after opening your website. After that according to a general tradition user moves his eyes from left to right and then narrow down their fixation towards the bottom of website. This forms 'F' shape, thus 'F' shape should be considered while putting your website content.

2. Golden Triangle :

As mentioned above 'F' shape is the general way user fix their eyes while traversing the content of your UI. When you'll join the edges of the 'F' , the traingle is formed. Typically content placed in this triangle can result in the success of UI. Pictures, videos, and audio are more useful if they are embedded in this area. Reading and scanning content takes effort, and placing multimedia content in the golden triangle relieves the need to scan for relevant information. The users just have to sit back and immerse themselves in the experience.

3. Single Column before Multi Columns :
Studies also show that one column formats on a page tend to perform better than many columns side by side. Multi column formats can be overwhelming to viewers, so better just to keep it simple and straightforward.

4. Headings get attention :
Similar to newspapers, an attractive heading draws attention of users. In case of an huge heading, starting 2-3 words should be appealing to user that makes him to make an effort to read whole heading.

5. Navigation goes up top :
Navigations are more effective when placed on the top. The point may be that anything at the top of a page will be seen immediately. And since top navigation must be simple because of space limits, top navigation is probably much simpler to use.
However studies does show that side navigation also helps.

6. Paragraphs, White space , remove irrelevant images :
Irrelevant images consumes precious space and does not serve any purpose. These images should be replaced with whitespaces. As recent studies has proved that white spaces supports users to relax their minds and grasp relevant information.
Same as in our print media, paragraphs should be made with proper interval to help users to scan the information. Breaks should be logical, and organized into a flow of ideas rather than distinct paragraphs.

7. Images :
What this means to you: Be very careful when putting important visual cues or content near pictures of faces. If you want to draw attention at some very important message on try putting an image person's face. often face grabs the attention of users.

Reference Links:

Wednesday, October 5, 2011

Eye Tracking and Web Designing