fitts-law

Apply Fitts's Law distance-width model to size and place interactive UI targets.

6|3|Updated May 3, 2026
One-click install
npx skills add https://github.com/HDeibler/universal-design-principles --skill fitts-law
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: fitts-law
Source: https://github.com/HDeibler/universal-design-principles/tree/main/plugins/interaction-and-control-principles/skills/fitts-law
Command: npx skills add https://github.com/HDeibler/universal-design-principles --skill fitts-law

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

It fixes slow, frustrating, and error-prone clicking or tapping by ensuring interactive targets are sized and placed to minimize aiming effort and misclicks.

Core Features & Use Cases

  • Target sizing for speed & accuracy: Applies minimum hit-area guidance (e.g., touch-friendly 44×44) so users can reliably hit buttons, icons, and controls.
  • Distance-aware placement: Reduces “cursor traversal” by placing high-frequency actions near where the user’s pointer naturally lands and grouping related actions.
  • Edge and touch-specific tuning: Uses screen-edge advantages appropriately and accounts for touch realities like finger occlusion and thumb reach.

Use it when designing or reviewing buttons, icon-only controls, toolbars/menus, drag handles, scrollbars, and mobile touch targets, or when debugging “users keep mis-clicking” and accessibility/motor-impairment concerns.

Quick Start

Ask an AI design reviewer to audit your UI for Fitts’s Law issues by checking target hit sizes, spacing, and whether edge-anchored/high-frequency actions are placed to minimize pointer travel.

Frequently Asked Questions about fitts-law

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
What is the best way to size touch targets to prevent misclicks?▼

To prevent misclicks, size interactive targets using Fitts's Law by enforcing minimum hit-area heuristics like the 44×44 pixel standard, ensuring users can reliably hit buttons, icons, and controls without aiming frustration.

How do I optimize UI button placement to reduce pointer travel time?▼

Reduce pointer travel time by placing high-frequency actions near where the user's pointer naturally lands and grouping related actions together, minimizing cursor traversal and speeding up target acquisition.

Does Fitts's Law apply to mobile thumb-reach and touch occlusion?▼

Yes, Fitts's Law applies to mobile contexts by tuning for touch-specific constraints like finger occlusion and thumb reach, ensuring edge-anchored interactions and touch-friendly layouts account for physical realities.

How do I audit my toolbar layout for target acquisition speed?▼

Audit your toolbar by checking target hit sizes, spacing, and whether edge-anchored or high-frequency actions minimize pointer travel, identifying interaction design issues that slow user actions.

When should I use screen-edge advantages for interactive UI elements?▼

Use screen-edge advantages for interactive UI elements when designing edge-anchored interactions like menus or toolbars, as edges effectively increase target hit area, allowing faster acquisition without overshooting.

Can I use this approach for accessibility-sensitive motor impairment contexts?▼

Yes, you can use Fitts's Law for accessibility-sensitive motor impairment contexts. By optimizing target sizing and distance-width models, it reduces aiming effort for pointer and touch tasks, improving accessibility.