www.peppersquare.com Open in urlscan Pro
54.68.39.92  Public Scan

Form analysis
1 forms found in the DOM

GET https://www.peppersquare.com/

<form role="search" method="get" class="et-search-form" action="https://www.peppersquare.com/">
  <input type="search" class="et-search-field" placeholder="Search …" value="" name="s" title="Search for:">
</form>

Text Content

 * Services
   * UI UX Design
     * Mobile App Design
     * Web App Design
     * Website Design
     * Usability Testing
   * Software Development
     * Mobile App Development
     * Web App Development
     * Content Management System
   * Digital Marketing
     * Search Engine Optimization
     * Social Media Campaigns
     * Marketing Assets Creation
     * Conversion Rate Optimization
   * * Read blog
     * User Interface Design Inspiration – 9 Websites That Will Get You There
 * Industries
   * All Industries
     * BFSI
     * Technology
     * Education
     * Automation
     * E-commerce
     * Non-profit
     * Food and Beverages
     * Healthcare and Fitness
     * Travel and Hospitality
     * Energy
   * post
   * post
   * * Read case study
     * Diagnostic tool interface for Abbott
 * Blog
 * About us
   * Company Overview
   * Leadership
   * Partners
   * Awards
 * Careers
   * Overview
   * Job Openings
 * Contact us

Select Page
 * Services
   * UI UX Design
     * Mobile App Design
     * Web App Design
     * Website Design
     * Usability Testing
   * Software Development
     * Mobile App Development
     * Web App Development
     * Content Management System
   * Digital Marketing
     * Search Engine Optimization
     * Social Media Campaigns
     * Marketing Assets Creation
     * Conversion Rate Optimization
   * * Read blog
     * User Interface Design Inspiration – 9 Websites That Will Get You There
 * Industries
   * All Industries
     * BFSI
     * Technology
     * Education
     * Automation
     * E-commerce
     * Non-profit
     * Food and Beverages
     * Healthcare and Fitness
     * Travel and Hospitality
     * Energy
   * post
   * post
   * * Read case study
     * Diagnostic tool interface for Abbott
 * Blog
 * About us
   * Company Overview
   * Leadership
   * Partners
   * Awards
 * Careers
   * Overview
   * Job Openings
 * Contact us




GOLDEN RATIO IN UX DESIGN – WHY IT MATTERS FOR BRANDS?

blog UI UX Design 6 min read | 968 Views

by Alka Jha | Jul 8, 2022 | blog, UI UX Design

The Egyptians used it to build the Pyramids.

The Greeks used it to design the Parthenon.

Dan Brown based Da Vinci Code on it.

We designers owe A LOT to it. And brands, must embrace it.

Meet the numeric value 1.61803 39887, also known as the Golden Ratio, or the
Golden Mean.

We also call it Phi after the Greek sculptor Phidias. There’s more than what
meets the eye though, and that’s where you need to go in-depth to understand
what is Golden Ratio and how it impacts a brand.


WHAT IS GOLDEN RATIO IN SIMPLE TERMS?

The Golden Ratio or the Golden Mean or Phi, is an irrational number equaling
1.618. Put it simply, it is the ratio of two numbers , which is the same as the
ratio of the sum to the larger of the two numbers.


HOW TO CALCULATE THE GOLDEN RATIO?

To calculate the Golden Ratio, you divide a line segment into two smaller parts.
The longer part (a), divided by the smaller part (b) is equal to the sum of (a)
and (b) divided by (a), equaling 1.618. This formula helps create shapes,
layouts, forms, structures, logos, etc.

The Golden Ratio or Phi is equal to:

1.61803398874989484820…

With Phi being irrational, the digits placed after the decimal point continue
going on forever without repeating.




HISTORY OF GOLDEN RATIO – A QUICK TIMELINE

Circa 300 BC, Greek mathematician Euclid defined Golden Ratio in his math
textbook Elements. At the time, Euclid called it the “extreme and mean ratio.”

In 1509, Leonardo Da Vinci created illustrations for a dissertation called De
Divina Proportione. This is one of the earliest references to what we know as
the Divine Proportion.

During the Renaissance era, artists kept using the Golden Mean in paintings and
sculptures for both beauty and balance.

Kepler, who discovered the elliptical nature of planet orbits, also mentioned
the Divine Proportion.

It wasn’t until the 1800’s that the term Golden Ratio was coined by Martin Ohm,
who was the first person to describe it in his book – The Pure Elementary
Mathematics. In the book, he called it – term “goldener schnitt” (golden
section).

As for Phi, it wasn’t used in common parlance until 1900s, when Mark Barr used
the Greek alphabet phi (Φ) with the proportion.


GOLDEN RATIO AND THE FIBONACCI SEQUENCE

Wondering what’s the difference between Fibonacci and Golden Ratio? Well, both
are closely connected. The Fibonacci sequence is the sum of the two numbers
before it. Using the pattern, Greeks developed the Golden Ratio to express the
difference between any two numbers in the sequence.

When the Fibonacci numbers increase, the ratio of consecutive numbers in the
Fibonacci series start getting closer to the Golden Ratio.

The Fibonacci sequence is present in how the seeds of sunflowers spiral out of
the center and can predict the number of petals on a flower.

Spooky, but true!

Arthur Benjamin beautifully connects the two in his Ted Talk:




WHAT ARE SOME EXAMPLES OF GOLDEN RATIO?

There are abundant examples of golden rectangles and golden spirals. The former
has sides that are in the Golden Ratio. When you divide the golden rectangle
into square and then the smaller rectangle again, repeating the process
indefinitely, you’ll get what’s called a Golden Spiral. This is obtained when
you connect the opposite corners of the squares.

Best examples of the Golden Ratio include:

 * Flower petals – The number of flower petals adhere to the Fibonacci sequence,
   including the Daisy, which has 34 petals. Each petal is placed on a flower at
   0.618034 b turn. This facilitates best exposure to sunlight.
 * Logarithmic Spirals – Nautilus and snail shells both follow the Golden Mean,
   and so does the horns of some animals, cobwebs, ferns, pinecones, galaxies,
   and so on. All of them are in the logarithmic, Golden spiral shape, spotted
   easily in nature.



 * Paintings – Da Vinci’s “The Last Supper” is one of the best examples of the
   Golden ratio grids
 * in art along with Michelangelo’s “The Creation of Adam”, multiple Georges
   Seurat’s paintings, and “The Golden Stairs” by Edward Burne-Jones.
 * Logos – Apple, Pepsi, Twitter, Google, and even National Geographic follow
   the Golden Mean to the T for their logos.
 * Architecture – From Pyramids to Parthenon to the UN Secretariat Building in
   NYC, man-made marvels also stand testimony to the Golden mean.


WHY DOES GOLDEN RATIO MATTER FOR YOUR BRAND?

In 2010, the first Aston Martin Rapide went on sale. Its successor, the Rapide S
had every detail designed using the Golden Ratio. The Splash Lab even went on to
create intuitive hand wash journey for users using the same principle.

It may have something to do with how people can quickly scan an image when it’s
shaped in a golden rectangle. National Geographic shows us how.



On a website, this leads to better reading and retention, without users even
realizing it. In design, it lends aesthetic appeal to all the elements,
composition, making a statement and a first impression on the users.

Done right, it can help you create an incredible brand identity, make your brand
more memorable, and foster loyalty.

Here’s how you can implement it in UI UX design.


GOLDEN RATIO IN WEBSITE UI UX DESIGN

Impeccable UI UX design is a must in websites. Does website design also follow
the Golden trajectory? You bet! While there are endless ways you can
incorporate, let’s focus on the most important aspects of how to use the Golden
Ratio in design.

 * Typography and hierarchy – Need to figure out font size for your website? The
   first thing is to create a hierarchy for your messaging, irrespective of the
   length of text. The Golden Ratio can be used to figure out the hierarchy in
   minutes. For instance, if your body copy is 12 px, and you multiply it by
   1.618, you’ll end up with 19.416, which will be the apt header text size!
 * Appealing UI – The way you design layouts can drastically improve how your
   users interact with your website. So, how could Golden Ratio in design be
   used to improve form layouts? Take a page highlighting a block of content.
   Set the dimensions to set the dimensions aptly. Take any 960 px width layout,
   divide it by 1.618 and you’ll get 594, which will be the height of the
   layout. Break this into two columns using the Golden Ratio, and you’ll get a
   neat layout.



 * Logo development – The first fundamental requirement of creating your brand
   identity is having a logo for your brand. While creating one for your
   business, turn to Golden proportion and sketch out the best proportions and
   shapes for your logo, following the footsteps of big names in the industry.
   Using the formula, you can easily create minimalistic, balanced, and insanely
   amazing logos that become a part of your brand identity.



 * Resizing – Resizing and cropping are part of a designer’s routine. And that’s
   where they can do with some ‘divine interventions!’ While cropping image,
   they can use the golden spiral as a consistent guide by overlaying it on any
   image, get the focal point right and go ahead to get the perfectly
   proportionate cutouts.
 * Composing images – If the great artists from the Renaissance era can do it,
   what can stop us from using the Golden mean for image composition? Just like
   image resizing, you can overlay the Golden spiral on images to check for
   harmony and balance.


CONCLUSION

By now, you must’ve understood that while it is ubiquitous, the Golden mean will
always remain at the forefront of design. Remember, 1.618…is not just a number.
It’s the driving force behind good designs lending neat aesthetics, which
ultimately become crowd pullers.

Go ahead, take your brand to the next level by striking the perfect balance with
‘divine intervention!’ Contact us to create magic for your brand using the power
of Phi!

Share on FacebookShare on Linkedin
Are you looking for an experience-driven digital solution for your product or
service?
Connect with us
CLOSE Contents
 1. What is Golden Ratio in simple terms?
 2. How to Calculate the Golden Ratio?
 3. History of Golden Ratio – a Quick Timeline
 4. Golden Ratio and the Fibonacci Sequence
 5. What are some examples of Golden Ratio?
 6. Why Does Golden Ratio Matter for Your Brand?
 7. Golden Ratio in Website UI UX Design
 8. Conclusion

Share

     
0
Shares

Author


ALKA JHA



Alka is the Design Director at Pepper Square and she has defined the user
experience for some of the finest global brands over the last seven years.

Alka is the Design Director at Pepper Square and she has defined the user
experience for some of the finest global brands over the last seven years.



MORE BLOGS

08 Apr 2022 | 6 min read | 164 Views


GREEN UI - DESIGNING FOR THE FUTURE

18 May 2022 | 6 min read | 105 Views


PLAGUED BY PROBLEMS: BAD UX OF CDC’S $44 MILLION VACCINE ADMINISTRATION SYSTEM

Over the last 19 years, we have helped 300+ leading companies maximize their
outcomes with UI UX Design,UI Development, Software Development, and Digital
Marketing.

Dallas . San Francisco . New York . Bengaluru


530.522.8714

connect@peppersquare.com

 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 

SERVICES

 * UI UX Design
 * Software Development
 * Digital Marketing

INDUSTRIES

 * All Industries
 * BFSI
 * Technology
 * Education
 * Automation
 * E-commerce
 * Non-profit
 * Food and Beverages
 * Healthcare and Fitness
 * Travel and Hospitality
 * Energy

ABOUT US

 * Company Overview
 * Leadership
 * Partners
 * Awards

CAREERS

 * Overview
 * Job Openings

BLOGS

 * Contact us
 * Blog

SUBSCRIBE TO OUR NEWSLETTER

Subscribe
© 2002 - 2022 Pepper Square
 * Terms of Use
 * Privacy Policy
 * Cookies
 * Site Map