Throughout my varied career as a designer, I have often been asked by clients “why did you choose to design it that way?”, or “I’d like to make that bigger and move it slightly, can you do that?”. As the designer, if you truly believe in the quality of work you’ve produced and fundamentally it complies to the Golden Ratio – you can defend and explain the rationale behind the design. I am not saying you should stand by this ratio at all costs, however, its a great rule of thumb when creating a new brand or simply a visual composition, whether it be photographic or graphical.
The Ancient Greeks were one of the first to discover a way to harness the beautiful asymmetry found in plants, animals, insects and other natural structures. They expressed this mathematical phenomenon with the Greek letter phi, today, we call it the Golden Ratio.
Closely related to the Fibonacci Sequence, the Golden Ratio describes the perfectly symmetrical relationship between two proportions. Without getting too mathematical, it is best understood as the proportions 1:1.618 (or as an equation – a/b+)a+b)/a – if you want to embrace GCSE maths). Fibonacci sequence is a naturally occurring sequence of numbers that can be found practically everywhere in nature, from the number of leaves on a tree to the spiral shape of a seashell. Starting with 0 and 1, add the last number of the sequence to the number that preceded it to create the next number in the sequence. So it goes 0, 1, 1, 2, 3, 5, 8, 13, 21, and so on to infinity. From the Fibonacci Sequence, the Greeks developed the Golden Ratio to better express the difference between any two numbers in succession within the sequence.
The Golden Ratio isn’t an exact science when it comes to the Fibonacci Sequence – the difference between two numbers on the sequence isn’t always exactly equal to the Golden Ratio, but it is pretty close.
With this understanding of the basic numbers in the sequence, we can construct this into a visual tool on which we can design to – visually.
We’ll start with a width of 1,000 pixels and divide it by 1.619 to get a height of about 618 pixels. Now add a 618 x 618 square on the right side of the canvas, leaving behind a 382 x 618 rectangle on the left side – another golden rectangle! If you take that new rectangle and create another square within it, you’ll end up with another golden rectangle in the leftover space, which you can then divide up again and so on and so forth.
Notice how each time you divide your golden rectangle, the largest dividing line kind of spirals in on itself? That’s no accident – it forms the shape of a “golden spiral”, one of the more ubiquitous shapes that you’ll deal with when working with the Golden Ratio. See the featured image above for an example of this.
The Golden Ratio isn’t just a mathematical theory: it shows up all the time in the real world.
Taking the Golden Ratio and implementing this into your design is an art form in itself. However, any designer can use it as a general rule of thumb. Using the sequential rationale, we can apply this not only to a visual layout but even to base elements such as typography. For example, if we have a 20pt header (or H1 tag for you SEO people), dividing that by 1.618 will give you a very complimentary 12pt body font size.
Have a look around at brands that resonate with you, you’ll soon realise how the fundamentals of the Golden Ratio have shaped you and the world around you.