1. How can I increase the
appeal of a design?
Golden Ratio 101
Brought to you by

2. Golden Ratio is a proportion
that can be used to increase the
appeal of a design
Golden Ratio (0.618) is also known as: golden mean, golden
number, golden section, golden proportion, divine proportion,
and sectio aurea. Adding the number 1 to the Golden Ratio = Phi
(φ=1.618). Both 0.618 and 1.618 are used interchangeably to
represent the golden ratio because they represent the same
geometric relationship. (Lidwell, Holden, and Butler, 2010, p.114)
Image Source: http://www.dummies.com/how-to/content/how-
to-use-the-golden-ratio.html

3. In a Golden Ratio the proportion of
length and width is the golden ratio
In 2008, Vitaly Friedman of Smashing Magazine wrote: “Since the
Renaissance, many artists and architects have proportioned their
works to approximate the golden ratio — especially in the form of
the golden rectangle, in which the ratio of the longer side to the
shorter is the golden ratio. The rationale behind it is the belief that
this proportion is organic, universal, harmonic and aesthetically
pleasing. Indeed, being evident everywhere in the universe (in fact,
many things around us can be expressed in this ratio), divine
proportion (which is also called Golden ratio, divine section, golden
cut and mean of Phidias) is probably the most known law of
proportion which can dramatically improve the communication of
your design.”
Image and Annotations by Elizabeth Brown

4. SmashingMagazine.com uses
the Golden Ratio to organize
information
Smashing Magazine's web layout is well organized and easy to
navigate.
Annotations by Elizabeth Brown
Image Source: www.smashingmagazine.com

5. Apple’s designers use the
Golden Ratio in the iCloud logo
to create balance
The Golden Ratio as seen in the annotated circles that make up
the iCloud logo create an aesthetically pleasing and well
balanced image.
Image Source and Annotations: http://www.quora.com/What-
are-some-fine-examples-of-golden-ratio-principles-used-in-web-
design

6. A poorly organized website
that could benefit from use of the
Golden Ratio
This website does not seem to use any type of grid. Use of the
golden ratio could not only make this site easier to look at, but
also to help the site owner to better communicate their
purpose.
Image Source: http://www.businessblunder.com/wp-
content/uploads/2010/09/arngren.png

7. Use these links to learn more
about Golden Ratio or even
download your own transparent
Golden Rectangle to use in your
screenshot
http://www.joshuagarity.com/web-design/the-
golden-ratio/
http://designshack.net/articles/graphics/applyin
g-the-golden-ratio-to-your-web-
designs/http://designshack.net/articles/graphic
s/applying-the-golden-ratio-to-your-web-
designs/

8. References
Friedman, Vitaly. Smashing Magazine.Web
<http://www.smashingmagazine.com/2008/05/29/applying-divine-
proportion-to-web-design/>.
Lidwell, W., K. Holden, and J. Butler. Universal principles of design, 125
ways to enhance usability, influence perception, increase appeal,
make better design decisions, and teach through. Rockport Pub,
2010.
Brought to you by