This post is also available in: हिन्दी (Hindi) العربية (Arabic)
The first step of the design phase is the schematic design. The schematic design is where the designer gathers information on the project’s needs, style, and wants. While there will never be a one-size-fits-all approach for design, there is a concrete mathematical approach that can help us get one step closer to creating amazing design experiences every time and it is the Golden Ratio.
The Golden Ratio is a mathematical ratio you can find almost anywhere, like nature, architecture, painting, and music. When specifically applied to design, it creates an organic, balanced, and aesthetically pleasing composition.
This article will explore what the Golden Ratio is, how to calculate it, and how to use it in design.
What is the Golden Ratio?
Also known as the Golden Section, Golden Mean, Divine Proportion and represented by a Greek letter Phi (𝜙), Golden Ratio is a special number that approximately equals 1.618. The ratio itself comes from the Fibonacci sequence, a naturally occurring sequence of numbers that can be found everywhere, from the number of petals in a flower to sea waves.
The Fibonacci sequence is a pattern of numbers obtained by finding the sum of two numbers before it. It goes: 0, 1, 1, 2, 3, 5, 8, 13, 21, 34, and so on. The Golden Ratio is derived from this pattern.
If you divide any two consecutive numbers (bigger number by smaller number), the ratio is approximately equal to 1.618
1/1 = 1
2/1 = 2
3/2 = 1.5
5/3 = 1.67
8/5 = 1.6
13/8 = 1.625
21/13 = 1.615
If you proceed further, the ratio becomes constant at a value of 1.618.
How Does Golden Ratio Relate to Design?
You can find the Golden Ratio when you divide a line into two parts and the longer part (a) divided by the smaller part (b) is equal to the sum of (a) + (b) divided by (a), which both equals 1.618. This formula can help you when creating shapes, logos, layouts, and more.
(a + b)/a = a/b = 1.618 (𝜙)
You can also use this idea to create a golden rectangle. Take a square and multiply one side by 1.618 to get a new shape – a rectangle with a golden ratio.
If you lay the square over the rectangle, the relationship between the two shapes will give you the Golden Ratio.
If you keep applying the Golden Ratio formula to the new rectangle, you will end up with an image made up of increasingly smaller squares. If you draw a spiral over each square, starting in one corner and ending in the opposite one, you’ll create the curve known as the Golden Spiral.
Mathematics and the Golden Ratio
Golden Ratio is an irrational number (1 + √5)/2, approximately equal to 1.618. The origin of this number can be traced back to Euclid, who mentions it as the “extreme and mean ratio” in the Elements. In terms of present-day algebra, letting the length of the shorter segment be one unit and the length of the longer segment be x units gives rise to the equation (x + 1)/x = x/1 (as mentioned above).
Now, (x + 1)/x = x/1 => (x + 1) × 1 = x × x => x + 1 = x2 => x2 – x – 1 = 0
Solving the equation, we get x = (1 + √5)/2.
The ancient Greeks recognized this “dividing” or “sectioning” property, a phrase that was ultimately shortened to simply “the section”. It was more than 2,000 years later that both “ratio” and “section” were designated as “golden” by German mathematician Martin Ohm in 1835.
The Greeks also had observed that the golden ratio provided the most aesthetically pleasing proportion of sides of a rectangle, a notion that was enhanced during the Renaissance by, for example, the work of the Italian polymath Leonardo da Vinci and the publication of De divina proportione (1509; Divine Proportion), written by the Italian mathematician Luca Pacioli and illustrated by Leonardo.
The Golden Ratio occurs in many mathematical contexts. It is geometrically constructible by ruler and compass, and it occurs in the investigation of the Archimedean and Platonic solids. It is the limit of the ratios of consecutive terms of the Fibonacci number sequence 1, 1, 2, 3, 5, 8, 13, …, in which term beyond the second is the sum of the previous two, and it is also the value of the most basic of continued fractions, namely 1 + 1/(1 + 1(1 + 1/(1 + …
In modern mathematics, it occurs in the description of fractals, figures that exhibit self-similarity and play an important role in the study of chaos and dynamical systems.
Golden Ratio in Design
Golden Ratio is widely used in the design. Here we will discuss the four areas where Golden Ratio is used.
Topography and Defining Hierarchy
The Golden Ratio can help you figure out what size font you should use for headers and body copy on a website, landing page, blog post, or even print campaign.
Let’s say your body copy is 12px. If you multiply 12 by 1.618, you’ll get 19.416, meaning a header text size of 19px or 20px would follow the Golden Ratio and balance the 12px body font size.
If you want to figure out how big your body text size would be, you could do the opposite. If your header text is 25px, you can divide it by 1.618 to find the body text size (15 or 16px).
Cropping and Resizing Images
When cropping images, it’s easy to identify white space to cut out. But, how do you make sure the image is still balanced after you resize it? You can use the Golden Spiral as a guide for the image’s composition.
For example, if you overlay the Golden Spiral on an image, you can make sure that the focal point is in the middle of the spiral.
Layout
Leveraging the Golden Ratio can help you design a visually appealing UI that draws the user’s attention to what matters the most. For example, a page that highlights a wide block of content on the left with a narrower column on the right can follow the Golden Ratio’s proportions and help you decide where to put the most important content.
Logo Development
If you’re designing a new logo and feeling stuck, turn to the Golden Ratio to help you sketch out the proportions and shapes. Many popular logos follow the Golden Ratio, like Twitter, Apple, and Pepsi.
