The beauty of design

What is the common thread between the golden ratio, Rihanna, and a pair of Crocs?

Nil Thyrion
UX Collective

--

Beauty has always been a very important theme in my work. When creating a product or a service, I always seek to deliver an emotional value to users through the work I do. But while I believe only beautifully crafted experiences can deliver this emotional value, I will agree that beauty is a rather ambiguous term and therefore difficult to define. These next few lines discuss the many meanings and shapes of beauty in design and question how the aesthetic of design impacts the way users feel and behave.

A typographic composition with the article’s title

Signs of beauty

Before I moved to London 5 years ago, I had a chance to work and live in Paris. What I always loved to do in this city was to try spotting the different signs that you can find in its streets. During these typographic safaris, what specifically caught my attention is the contrast between the letters you find at the entrance of the metro stations and the ones you find inside some of the stations. The Art Nouveau letters which are post-signing the entrance of the stations are a bit extravagant; close to an element of decoration, they are a bit difficult to read at first.

Decorated entrance to a Paris metro station
Entrance to Abbesses, Paris Metro. Art Nouveau design by Hector Guimard. Photo: Steve Cadman

Oppositely, looking inside some stations on the platform, you’ll see some massive tiled geometric capital letters that can’t be missed. And what I found interesting was this conflict between 2 designs that have roughly the same role but are fundamentally opposed; The first one is made by artists who are trying to do something beautiful and unique. The second is made by engineers who have worked on a more accessible visual system.

A big sign on a metro platform
The impressive tiled nameplate of Solférino station, Paris Metro. Photo: ClicSouris

Beauty vs. Function

As I remember, that was the first time in my career as a designer, that this question of beauty versus function came up. I asked myself: am I making a design to be unique and beautiful, or am I making a design to be clear and accessible? This was the first time I was asking myself this question, but obviously not the last. This question has been haunting me since. Today, when I am presenting my work to creative directors I often get this reaction: “Well that’s a very slick and polished design but where is the beauty?” And I think they are right to be fair, it sometimes feels that beauty and function have become some sort of enemies. Beauty seems to have been displaced by functionality in design.

“Am I making a design to be unique and beautiful, or am I making a design to be clear and accessible? ”

Principles for good design

In the 70’s, Dieter Rams, a German industrial designer defined the principles of good designs. He defined an ideology that is still largely influencing today’s leading design companies. The Dieter Rams’ T3 radio for example has clearly influenced Apple’s first-generation iPod released 40 years later. For Dieter Rams, beautiful design is, amongst other characteristics a design which is innovative, aesthetic, unobtrusive, as little design as possible. Rams is probably what we could call a minimalist and a functionalist for who beauty is all about simplification and only keeping what is essential. And whilst I agree with Rams, and became a big fan of his work, I believe beautiful design is a bit more complicated than that.

A minimalistic radio
Braun T3 pocket radio by Dieter Rams, 1958

Moving away from a conventional idea of beauty

Last year, I came across this interesting initiative from Google design team. They’ve asked their designers what they were considering as good design. Amongst a series of products including a Polaroid, a Lego brick and a Hammer, the Crocs were mentioned. And that can be a surprising answer because, the design of the Crocs seems to go a little bit against some of the so influential Dieter Rams principles of good design. Some would consider that the Crocs are a bit gross; they are big, they have flashy colors, the appearance may look a bit clumsy. Crocs are controversial in their aesthetic, but people love it. So what these shoes are doing is they are moving people away from the conventional idea of beauty and this is what makes it so difficult to define the beauty in design.

An illustration of a shoe
The crocs, one of the object considered as good design by Google Design community. Illustration: Haik Avanian

And there is this quote that I have found, which could explain somehow our change in taste when it comes to aesthetic: “Its ugly until Rihanna decides it’s not.” It’s a fun quote but it expresses a certain truth in fashion design; an outfit, that would be considered ugly, can become the trendiest piece of fashion if you see that Rihanna is wearing it, it becomes automatically à la mode. We can assume that beauty in design is defined by trendsetters. Now, Rihanna may not be setting the trends for UI and UX design. But tech giants like Apple and Google seem to be the ones who are deciding what good looks like today.

“Its ugly until Rihanna decides it’s not.”

Remember IOS 6

If you are designing an app for IOS, you are probably going to use some of the Apple design resources which is going to substantially influence the aesthetic of your product. But how do we know if the last IOS UI kit is a beautiful design? IOS interfaces before the 7th were also considered as a beautiful design. These interfaces were using skeuomorphism before everything become flat. And skeuomorphism is a design that could be considered as more ornamental. You may remember things like the buttons with the bevel, the stitches texture in the calendar or the wooden bookshelf. I read somewhere that Steve Job himself was apparently a big fan of skeuomorphism.

This is when Apple hired Jony Ive to oversee the look and feel of IOS 7 that the products became more minimalistic because Ive was apparently a big fan of Dieter Rams principles of good design. Whether it is skeuomorphism or flat design, we can say that Apple is defining in our contemporary era, the standards of beauty in digital design.

Left: Screenshots from Apple IOS 6. Right: Screenshots from Apple IOS13

Canon of Polykleitos

The concept of standards of beauty in design was obviously not born with Apple IOS. It seems that it is something that always have been present in the design world and I wanted to share 3 examples in this article (You can tell me in the comments other examples you can think off). The first example of standard of beauty in design that comes to my mind is from the Ancient Greece. Sometimes around the 5th century before Christ, a sculptor named Polykleitos, used mathematical basis to define the criteria of a perfect aesthetic in sculpture. The tool he has created is what we would call today a design system. And this design system, was adopted by many other sculptors in the Ancient Greece, the same way Digital designers would use design system today.

An antique statue of a man
The Doryphoros, Roman copy of Polykleitos’ sculpture using his canon. Minneapolis Institute of Art

Divine proportion

The second example of standard of beauty in design is probably the most obvious one when we think about a design system in the history of art and design. This is the divine proportion also called the golden ratio. In the 15th century, a book written by Luca Pacioli and illustrated by Leonard da Vinci demonstrates the use of mathematics to define the rules of aesthetics in architectures and visual arts. This book had and still have a massive influence on art and design, all the rules it contains on the golden ration were used by the greatest painters in history, but also the greatest architects, and the greatest designers.

Technical illustrations of a man’s head and a letter M
Vinci’s illustrations for Divina proportione, a book about mathematical proportions and their applications to visual art and architecture.

Swiss design masters

The golden ratio became, through the age the source of truth for a lot of designers. For example, it has influenced the ideology of the Swiss design master as the base of their ideology in the 50s. If we think about graphic designers like Joseph Müller-Brockmann, the key of his design philosophy is a grid, based on the golden ratio. And when we think of standards of beauty in design we can say that the Swiss design masters really have defined what beauty in design looks like whether it is Müller-Brockman with his grid system, or typographers like Max Miedinger with his famous Helvetica font.

A technical drawing and a blue poster
Construction grid and final poster for the Zurich Tonhalle designed by Josef Müller-Brockmann, 1955.

The first impression

You may wonder why, in a digital era these rules created centuries ago are important to today’s designers. 0.05 seconds is the reason why an understanding of the standards of beauty are important for us a designer. 0.05 seconds is the time needed for users to form an opinion about a design that determines whether they’ll stay or leave an app or website. This is a finding from a Google user experience research on “the first impression.” In less than 1 second, users are going to build a visceral gut feeling that helps them to decide whether they are going to stay at this place or continue somewhere else. And this first impression also often influences long-term human behavior regarding a product or a brand. Beauty is so important in design, because it’s only if we craft truly beautiful experiences that we can forge a genuine value for users, starting with making this gut feeling positive. And that’s why the aesthetic of an experience is for me, as important as its functionality.

“0.05 seconds is the time needed for users to form an opinion about a design that determines whether they’ll stay or leave an app or website.”

If you are curious to find more about some of the references quoted in the article, here are few useful links:

Ten Principles for Good Design - Dieter Rams: https://www.vitsoe.com/gb/about/good-design

Is It Good Design? Well, Yeah - Google:
https://design.google/library/good-design/

Beauty - Sagmeister & Walsh:
https://andwalsh.com/work/all/beauty-book/

The role of visual complexity and prototypicality regarding first impression of websites: Working towards understanding aesthetic judgment - Various authors:
https://research.google/pubs/pub38315/

The font used for this article’s title is Voyage by VJ Type:
https://vj-type.com/6-voyage

The UX Collective donates US$1 for each article we publish. This story contributed to World-Class Designer School: a college-level, tuition-free design school focused on preparing young and talented African designers for the local and international digital product market. Build the design community you believe in.

--

--