Design Tips / How to Apply Fitts' Law in UX
Resource slide 1
Resource slide 2
Resource slide 3
Resource slide 4
Resource slide 5
Resource slide 6
Resource slide 7
Resource slide 8
How to Apply Fitts' Law in UX
🎯Today let's talk about how to apply Fitts' Law to UX! - 📜This law states: - - ⏱️The time to acquire a target is a function of the distance to and size of the target. - ___________________ - ▶️Now - 🤔This just sounds like common sense, right?? - ⏳Of course, it takes longer to get to a smaller button than a larger one. - ☺️Stating the obvious, aren’t we?! - 👩‍🏫But remember what we are doing is explaining the whys of human behaviour that underlies our UX decisions. - 👩‍🎨Design decisions that may come ‘naturally’ to us, still need to be effectively communicated with by logic & data. - 🥩This increases 'buy in' from all stakeholders, decreases conflict in the product process + shows UX is both a science & an art. ___________________ - 🔦To demonstrate - ---- 1. Why do we want to fill in form fields that are designed as empty rectangles? - -It creates a perceived larger target area than a plain line -- - 2. There is a conundrum on mobile e-commerce product pages. If you did a 'card sorting' exercise you would find that the 'buy now' btn is the highest priority. But in order for a user to 'do' this action, he needs to understand how much the product is, why he should buy it & what it look like. Pushing the 'buy now' btn down the visual hierarchy line. - - What's the solve? - Sticky BUY NOW buttons! - Plus this solution utilises Fitts' law, increasing surface area & decreasing distance for a primary user goal :)) - ----- - 3. A key influence Fitts’ law had on desktop software, was the right click, pop out menu. Displaying actions needed in context of current tasks. Effectively reducing ‘travel time’ - -A trend on mobile is for options to appear as an icon task bar with the ones 'they couldn't fit' inside the infamous meat - hamburger, kebab, meatballs - mobile menus. By using action sheets, we decrease travel time & no. of clicks + increase clarity too!