Optical Effects in User Interfaces: An Illustrated Guide
Optical Effects in User Interfaces: An Illustrated Guide
Share this Post:
Mathematically centred is rarely visually centred, and every designer discovers this the first time they place a play triangle inside a circle. The fixes are old, well documented and almost never taught.
The corrections that matter most
Circles need to overshoot the cap height of the letters beside them. Triangles need to shift toward their visual mass. Pure black text on pure white reads heavier than the same weight reversed, so reversed type wants a lighter cut.
Type designers have compensated for all of this for centuries. Interface work inherited the problems without inheriting the vocabulary, which is why so many icon sets look subtly unbalanced at small sizes.
None of these adjustments are large. Most are one or two pixels, and all of them are the difference between a set that looks drawn and a set that looks placed.



French
Arabic
Thailand
English