Skip to main content

Icon Size Effect on Selection Speed and Accuracy

Introduction​

This study investigates how icon size affects selection speed and accuracy on mobile devices. The experiment involved 52 participants who completed icon selection tasks with various icon sizes, ranging from 16px to 96px. Results indicate that both selection speed and accuracy improve with larger icon sizes, though accuracy tends to decrease with longer selection times.

Target​

The findings are useful for designers of mobile and small-screen applications where icon-based navigation is critical, particularly for audiences requiring high usability, such as older adults or users with visual impairments.

Key Insights​

  • Larger Icons Improve Selection Speed: Larger icons (above 48px) are selected more quickly than smaller ones. For example, icons 64px or larger had faster average selection times.
  • Higher Accuracy with Larger Icons: Accuracy rates were highest for icons 48px and above, with selection inaccuracy significantly higher for icons smaller than 48px.
  • Negative Impact of Extended Selection Time: The study found a notable drop in accuracy for icons selected after 5 seconds, indicating that prolonged search times are associated with increased errors.

Supporting Data​

  • Selection Speed and Accuracy: The 2-second selection period had the lowest inaccuracy rate at 0.84%, while the inaccuracy rate rose to 8.86% for selections over 5 seconds.
  • Icon Size Impact: Icons below 48px saw markedly higher error rates, with only 20.1% of 16px icons selected accurately within the shortest time frame, compared to 41% for 96px icons.

Other Insights​

  • Cognitive Load and Search Efficiency: The findings suggest that smaller icons require more cognitive effort to locate and identify, possibly due to visual strain or increased difficulty in distinguishing icons at smaller sizes.

Practical Applications​

  • Optimal Icon Size: For interfaces emphasizing quick and accurate navigation, designers should use icons of at least 48px, ideally 64px or larger, to reduce cognitive load and improve usability.
  • Time-Based Adjustments: In applications with time-sensitive tasks, consider using visual cues or error-preventing feedback for icons that may take longer to locate.
  • Targeted Design for Accessibility: Larger icons should be prioritized for interfaces catering to users who may struggle with visual or motor impairments, ensuring accessible and efficient icon interaction.

Reference​

Satcharoen, K. 2020. Icon Size Effect on Selection Speed and Accuracy. International Journal of Computer Theory and Engineering, 12(6), 151-154.