All user interfaces are designed, some better than others, but ultimately decisions are made by the designer to create a look that ‘ feels right’. Each user interface is different so different rules apply when designing websites, apps and software, however, to make the end user experience harmonious a sense of balance is always necessary. This balance can be achieved in many ways, whether it's through a complementary colour palette, a consistent grid or even typography and icons. Often designers use clever tricks to make interfaces look more balanced and create a better experience.
As the saying goes, the devil is in the details, and often a user interface can be made to look ‘ unbalanced’ through poorly designed iconography. Despite being small, icons can completely change the look and feel of the web page or app. They carry their own language and set of rules that need to be immediately apparent to the end user; the user should be able to understand an icon without having to read a manual or even a description of it. Because icons come in so many different shapes and sizes, it's important that they have a balanced overall look so that a heavy icon on the left side of the page does not overpower a delicate icon on the opposite side. In this example below showing a ‘play’ button, the icon on the left has an equilateral triangle perfectly centred in a circle. Because the triangle tapers to the right, The left side of it looks heavier, creating an illusion that the triangle is placed too far to the left, when in fact it is perfectly centred. The triangle on the right has been skewed, so it is no longer equilateral. Although it is slightly thinner and not equal, to the human eye, it looks as if it is perfectly centred and brings a balanced look to the overall icon.
1.618 is the magic number. Mathematically speaking if an object is 1.618 bigger or smaller than it's counterpart, it should create a balanced look that just ‘feels right’. Known as the golden ratio, when a spiral that gets smaller in increments of 1.618 is used to measure design elements, it can create a proportionally balanced look to the overall image. This was used heavily by Leonardo DaVinci, who was also a mathematician alongside a skilled artist. he used the golden ratio in many of his paintings and although they may not be immediately noticeable, once the spiral is overlaid, you can see why his work look so proportionately balanced. The golden ratio has been used in the world of product design too. It is no secret that Apple uses the golden ratio to inform the design of its products, shown in this example below of the iPhone 4 camera, the perfectly sits in the corner of the phone. The golden ratio shows it is just the right distance from the sides of the device, unlikely a coincidence. This old screenshots of Twitter and National Geographic show how their web designers have used the ratio to create a balanced feeling. Everything is aligned right down to individual lines of text to make sure it perfectly adheres. I find this fascinating as when using a website, you would not imagine how much work has gone into aligning individual line of text to a mathematical formula hundreds of years old.
The beauty of these design tricks is that if they are done correctly, you'll never even noticed that they exist. It's up to the designer to use the right tools for each job and make there own creative decisions based on what ‘looks right’. The idea of imperfecting an icon to make it look perfect sounds odd at first, but ultimately it takes into consideration how our eyes view things and how they may differ from different distances. Being aware of some of the tricks and involved to create design perfection can inform my work especially when looking at user interface design.