{"id":1317,"date":"2010-06-26T12:19:07","date_gmt":"2010-06-26T06:49:07","guid":{"rendered":"http:\/\/sumankumar.com\/blog\/?p=1317"},"modified":"2010-06-26T12:19:07","modified_gmt":"2010-06-26T06:49:07","slug":"demystifying-fittss-law","status":"publish","type":"post","link":"https:\/\/sumankumar.com\/blog\/2010\/06\/demystifying-fittss-law\/","title":{"rendered":"Demystifying Fitts’s law"},"content":{"rendered":"

Fitts’s law<\/a> states that acquiring a target is a function of the size of the target and the distance between the pointer and the target. In other words, bigger, closer the better. If you have anything to do with user-experience design you would have come across this ‘law’. What most practioners of UX design probably don’t know is this: why are bigger, closer targets easy to acquire?
\nThe probable answer lies elsewhere, in neurology. A few years back I stumbled upon Dr. V.S. Ramachandran’s BBC Reith lecture<\/a>. It was a defining moment for me: it suddenly dawned on me that design is not so much about focus groups, surveys, and collected opinion. Design is about your brain.<\/p>\n

Dr. Ramachandran explains how human vision is a complex process that involves thirty visual centers in your brain. What you see is not actually what you get. What you see is what you want. Case in point is this famous puzzle<\/a>. Go ahead, give it a look.<\/p>\n

Okay, what this must tell you is that vision is not as straightforward as you probably think it was. There’s a great deal of latent bias involved in rendering a simple scene. Why is it this way? Dr. Ramachandran says that human vision evolved to defeat camouflage and discover objects:<\/p>\n

“But imagine your primate ancestors scurrying up in the treetops trying to detect a lion seen behind fluttering green foliage. What you get inside the eyeball on the retina is just a bunch of yellow lion fragments obscured by all the leaves. But the brain says – so to speak – “What’s the likelihood that all these different yellow fragments are exactly the same yellow simply by chance? Zero. They must all belong to one object, so let me link them together, glue them together. Oh my God, it’s a lion – let me out of here!” And as soon as you glue them together, a signal gets sent to the limbic system saying: “AHA, there’s something object-like, pay attention here”.<\/p>\n

So there’s an arousal, and an attention which then titillates the limbic system, and you pay attention and you dodge the lion.”<\/p>\n

So, this primordial bias is still with us. Your brain’s primary function is survival. Your survival. Your brain hates to process any piece of information that is not directly contributing to performing its primary duties. In Dr. Ramachandran’s words, your brain strives to minimize computational labor.<\/p>\n

There you have it. The reason why buttons or links that are too small don’t get too many clicks: it involves precision-pointing and clicking. That’s unwanted labor. And that is why bigger and closer objects are ‘easier’ to acquire.<\/p>\n

There’s another angle to it. An important angle. Users “like” clicking bigger buttons. They may not realize it but they do like it. That’s because your brain ‘rewards’ you when you fall in-line with it and not hamper the way it works. Your brain sends a signal, a reward, to your emotional center because you chose to click the bigger button. Dr. Ramachandran says:<\/p>\n

“The Dalmatian dog example<\/a> is very important because it reminds us that vision is an extraordinarily complex and sophisticated process. And even looking at a simple scene involves a complex hierarchy, a stage by stage processing. At each stage in the hierarchy of processing, when a partial solution is achieved – “Hey it looks a bit dog-like right here” – there is a reward signal “AHA”, a partial “AHA”, and a small bias is sent back to earlier stages to facilitate the further binding of the features of the dog. And through such progressive bootstrapping the final dog clicks in place to create the final big “AHA!” ”<\/p>\n

Conversely (probably) your brain sends a ‘distress’ signal when you encounter poorly designed buttons or navigational aids in a software product or website.<\/p>\n

To conclude, efficiency, aesthetics, and desirability are deeply inter-linked. So if you want to make your customers go “Aha!” don’t burden them with small buttons or links. Bigger, closer, the better.<\/p>\n","protected":false},"excerpt":{"rendered":"

Fitts’s law states that acquiring a target is a function of the size of the target and the distance between the pointer and the target. In other words, bigger, closer the better. If you have anything to do with user-experience design you would have come across this ‘law’. What most practioners of UX design probably […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_uag_custom_page_level_css":"","advanced_seo_description":"","jetpack_seo_html_title":"","jetpack_seo_noindex":false,"ngg_post_thumbnail":0,"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[9,23,43],"tags":[154,156,207,155],"class_list":["post-1317","post","type-post","status-publish","format-standard","hentry","category-usability","category-user-experience","category-ux","tag-fittss-law","tag-neuro-usabiity","tag-ux","tag-visual-design"],"jetpack_featured_media_url":"","uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false,"jetpack-portfolio-admin-thumb":false},"uagb_author_info":{"display_name":"Suman Kumar","author_link":"https:\/\/sumankumar.com\/blog\/author\/suman-kumar\/"},"uagb_comment_info":1,"uagb_excerpt":"Fitts’s law states that acquiring a target is a function of the size of the target and the distance between the pointer and the target. In other words, bigger, closer the better. If you have anything to do with user-experience design you would have come across this ‘law’. What most practioners of UX design probably…","jetpack_shortlink":"https:\/\/wp.me\/p2Gbk8-lf","jetpack_likes_enabled":false,"jetpack_sharing_enabled":true,"jetpack-related-posts":[{"id":1458,"url":"https:\/\/sumankumar.com\/blog\/2011\/09\/wanted-ux-researcher-espn-digital-media\/","url_meta":{"origin":1317,"position":0},"title":"Wanted: UX Researcher for ESPN Digital Media","author":"Suman Kumar","date":"September 12, 2011","format":false,"excerpt":"We're looking for a Contractor for 6 months (extendable). You get to work on various sports portals from the ESPN network of sites, including ESPNcricinfo.com, ESPNF1.com, and ESPNsoccernet.com. If you have a passion for sports and your profile matches the criteria below, write to sumank\/gmail Essential functions: Play a role\u2026","rel":"","context":"In "ux"","block_context":{"text":"ux","link":"https:\/\/sumankumar.com\/blog\/category\/ux\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":1419,"url":"https:\/\/sumankumar.com\/blog\/2011\/03\/notionink-adam-user-survey-ni-refuses-learn\/","url_meta":{"origin":1317,"position":1},"title":"Notionink Adam User Survey: Or How NI Refuses to Learn","author":"Suman Kumar","date":"March 15, 2011","format":false,"excerpt":"I saw on http:\/\/www.notioninkfan.com\/ a link to a survey. Adam developers want feedback from Adam users and they created that survey. I immediately thought 'Why isn't this featured on Notionink's official website?' People at NotionInk Hacks forums too expressed similar sentiments. So I told myself \"Come on! Don't be a\u2026","rel":"","context":"In "design"","block_context":{"text":"design","link":"https:\/\/sumankumar.com\/blog\/category\/design\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":1408,"url":"https:\/\/sumankumar.com\/blog\/2011\/03\/notion-inks-adam-dream-nightmare\/","url_meta":{"origin":1317,"position":2},"title":"Notion Ink’s Adam: Dream or Nightmare?","author":"Suman Kumar","date":"March 10, 2011","format":false,"excerpt":"Very rarely a product comes along, gathering tremendous support and anticipation even before it's launched. A huge fan base is built even before anyone has seen the product. Product companies fail to get that sort of PR even after spending millions. Adam was one such product. It was touted as\u2026","rel":"","context":"In "usability"","block_context":{"text":"usability","link":"https:\/\/sumankumar.com\/blog\/category\/usability\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":1247,"url":"https:\/\/sumankumar.com\/blog\/2010\/03\/yak-pad-2-0\/","url_meta":{"origin":1317,"position":3},"title":"Yak Pad 2.0","author":"Suman Kumar","date":"March 9, 2010","format":false,"excerpt":"After much procrastination, here it is. The Yakpad 2.0 (beta). Runs on Wordpress. Also, I've merged all my blogs into this one (tech writing blog, usability blog). This is a work in progress children.","rel":"","context":"In "blogs"","block_context":{"text":"blogs","link":"https:\/\/sumankumar.com\/blog\/category\/blogs\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":230,"url":"https:\/\/sumankumar.com\/blog\/2004\/09\/neuro-aesthetics-perceptual-grammar-art-and-usability\/","url_meta":{"origin":1317,"position":4},"title":"Neuro-aesthetics, Perceptual Grammar, Art, and Usability","author":"Suman Kumar","date":"September 27, 2004","format":false,"excerpt":"Last evening I was watching an interview of Vilayanur S. Ramachandran on BBC. Ramachandran explained how the human brain perceives, processes, and acts, when exposed to art. Why do we like a Picasso? A Davinci, or a Henry Moore? Why do we tap our feet while listening to a particular\u2026","rel":"","context":"Similar post","block_context":{"text":"Similar post","link":""},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":262,"url":"https:\/\/sumankumar.com\/blog\/2006\/01\/first-impressions-count-in-website-design\/","url_meta":{"origin":1317,"position":5},"title":"First Impressions Count in Website Design","author":"Suman Kumar","date":"January 20, 2006","format":false,"excerpt":"\"Web users form first impressions of web pages in as little as 50 miliseconds (1\/20th of a second), according to Canadian researchers. In the blink of an eye, web surfers make nearly instantaneous judgments of a web site's \"visual appeal.\" Through the \"halo effect\" first impressions can color subsequent judgments\u2026","rel":"","context":"Similar post","block_context":{"text":"Similar post","link":""},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]}],"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/sumankumar.com\/blog\/wp-json\/wp\/v2\/posts\/1317","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sumankumar.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/sumankumar.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/sumankumar.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/sumankumar.com\/blog\/wp-json\/wp\/v2\/comments?post=1317"}],"version-history":[{"count":2,"href":"https:\/\/sumankumar.com\/blog\/wp-json\/wp\/v2\/posts\/1317\/revisions"}],"predecessor-version":[{"id":1319,"href":"https:\/\/sumankumar.com\/blog\/wp-json\/wp\/v2\/posts\/1317\/revisions\/1319"}],"wp:attachment":[{"href":"https:\/\/sumankumar.com\/blog\/wp-json\/wp\/v2\/media?parent=1317"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sumankumar.com\/blog\/wp-json\/wp\/v2\/categories?post=1317"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sumankumar.com\/blog\/wp-json\/wp\/v2\/tags?post=1317"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}