Wednesday, August 21, 2013

Hollow Icons

Aubrey Johnson:

Icons without this empty core are processed as definite and only the outer lines are processed. Depending on the outline of the shape, this happens pretty fast. No matter the shape, though, the hollow icons take more time to process.

I’m not familiar with the science behind this, but it certainly rings true to me.

Update (2014-06-23): Curt Arledge (via Khoi Vinh):

As a graduate student in human-computer interaction and a UX intern at Viget, I saw an interesting opportunity to test Johnson's claim with evidence from real users. To find a definitive answer to the question of whether hollow icons require more cognitive effort for users, I created a web app that measures users’ speed and accuracy in selecting icons with different visual styles. By studying the data from more than a thousand test participants, I found that hollow icons are not necessarily less usable than their solid counterparts. However, the results are actually a bit more complicated.

See also the full paper (PDF).

1 Comment RSS · Twitter


[...] icons (except for System Preferences). I’m not fond of the bright blue folders, the thin and hollow toolbar buttons, the translucent and sidebars and title bars, or the readability of Helvetica [...]

Leave a Comment