It’s seamlessly built into our everyday life. The Golden ratio is special because we can find it everywhere, from mathematical geometry, arts, and buildings to our bodies. When we use it in designs, it gives them an artistic edge that has always appealed to human eyes. In design, the Golden ratio meaning is that the elements are balanced, but are still aesthetic. The Golden ratio is a great tool to make images and objects more appealing. However, when we talk about design, the Golden ratio definition is to make organic or natural designs that are pleasing to look at with the proportions or elements being in harmony with each other. It’s also called the Greek letter Phi, Golden Mean, and Divine Proportion – after how much it’s found in nature. In mathematical terms, the Golden ratio equals 1.618, and Phi (Ф) – a Greek letter – represents it.
The Golden Beauty: Brain Response to Classical and Renaissance Sculptures.
Learn more at our course on Visual–Design Fundamentals at the UX Conference.ĭi Dio, C., Macaluso, E., and Rizzolatti, G. Regardless, the golden ratio can be a helpful reference to new visual designers or designers wanting to improve their skills with a concrete, mathematical approach. Others believe that the golden ratio is no more valid than any other method used to derive sizes and proportions. Some designers are fascinated with the golden ratio and use it to create and edit all sorts of interface-design elements.
How to create a loose page grid using the golden ratio .
(The line height is the font height plus the white space between lines of text - it basically governs how tightly arranged the lines of text are in a paragraph.) For example, if you had a font size of 16px for your body copy, the line height could be 16 φ = 16 x 1.618 = 25.88 or, again, roughly 26px. Some also use the golden ratio to determine the line height needed for a particular font size to be in a golden ratio. The header-font size could be a golden-ratio multiple of your body size - that is, it could be 16 φ = 16 x 1.618 = 25.88 or roughly 26px. Let’s say the body-font size on your website is 16px. How is the golden ratio used in interface designs? Let’s consider a couple of common examples: Text Sizesĭifferent font sizes can be in a golden ratio. Examples of the Golden Ratio in UI Design The golden spiral is found within many naturally occurring elements such as plants and in weather patterns like hurricanes. The golden spiral is formed by connecting the opposite corners of the resulting squares. Then repeat the process for the smaller golden rectangle EFDC. To obtain a golden spiral, start by dividing a golden rectangle ABCD into a square ABEF and a smaller golden rectangle EFDC. When used, it is often assumed to create an organic, balanced, and aesthetically pleasing composition, thought to be favored by the human eye.Įxamples of buildings and works of art that have proportions in the golden ratio range from the pyramids in Giza, the Parthenon in Athens, and Da Vinci’s Mona Lisa. The golden ratio has been used to analyze quantities found in nature, architecture, painting, and music. The original image strongly activated sets of brain cells that the distorted images did not, suggesting beauty is partly an innate quality. The original statue’s proportions reflected the golden ratio. In the study, participants with no background in art, were shown an original image and distorted versions of a statue. (You can check that 1/0.618=1.618.)Ī study by Giacomo Rizzolatti and Cinzia Di Dio suggests that human brains are hard-wired to prefer human bodies with proportions in the golden ratio. The golden ratio φ can be shown to have a special property:Īnd is equal to 1.618033… (an irrational number).
Two segments in the golden ratio (a/b = φ)