USER INTERFACES

Optical Effects in User Interfaces

How to make optically balanced icons, correct shapes alignment, and perfect corner rounding

Our eyes are weird and often mislead us. But if you know the peculiarities of human vision, you can create better designs. Not only do type designers utilize optical tricks for creating readable and well-balanced fonts, but it’s also helpful for designers who craft user-computer interaction.

In the 1920s, the Gestalt theory of visual perception appeared. It explains how our eyes process different images and how our brain interprets them. You might have already heard about such things as the principle of proximity or the common fate rule. This article highlights aspects of the Gestalt theory that a designer can use in their work.

1. Measured and optical size

What is bigger: a 400-pixel square or a 400-pixel circle? Geometrically speaking, their width and height are equal. But look at the picture below. Our eyes immediately detect that the square outweighs the circle.