The evolution of visual design

Amal Bansode
UX Collective
Published in
5 min readAug 19, 2018

--

Don’t both logos above appear to be ‘ironed out’ versions of their predecessors?

Much of the funkiness of graphics has disappeared to make way for more comprehensible, ‘simple’ graphics over time. This new ‘flat’ design style effaces elements that create depth and dimension, such as drop shadows and textures. Designers, today, incline towards flat design because it leaves behind the important components of design — namely colour, shape and content. Some ‘buzzwords’ used to describe this design style are ‘minimalist’, ‘clean’, and ‘modern’. But where did this idea of ‘flat’ design emerge from?

The Swiss Style of Design

Flat design bears similarity with ‘Swiss Style Typography’. Swiss design was introduced around 1920–1930. It focuses on the usage of grids (for alignment), sans-serif typography (as used above) and crisp hierarchy of graphical elements. In fact, the much-loved sans-serif font ‘Helvetica’ was created during the flourishing age of this design style, in 1957. A note on typography: the text you’re reading here has serifs — the tiny decorative lines attached to the edges of many of the letters. Such serif fonts, as they have been dubbed, help with readability when there is a lot of text. Sans-serif fonts, as the name suggests, lack these details.

Minimalism

The terms ‘flat’ design and ‘minimalism’ are often used interchangeably today. Minimalism, however, is largely a component of ‘flat’ design. Minimalism gained popularity as a design style around 1960. The minimalism period saw artists, primarily, remove everything that they deemed was ‘irrelevant’ in a piece. Several art works containing simple geometrical figures (or even none) were hailed as some of the greatest paintings of that era.

Microsoft’s Metro UI

Minimalism in interface design began to gain popularity around 2012, with the release of Windows 8 and its ‘clean’ Metro design interface. The Metro design style uses a strict grid that is composed of blocks of content with sharp edges and vertices, contrasting colours, and sans-serif typography.

Skeuomorphism

From the lens of visual design, visual elements that are made to resemble real world objects (with high fidelity) are said to be skeuomorphic. [Do read Willi Kampmann’s response below, which provides an interesting perspective on the gross misuse of the term skeuomorphism in graphic/interaction design.] Skeuomorphic visual content can range from shadows and textures to animations. The animation of flipping a page is skeuomorphic. Using a closed envelope to represent unread email, for example, may be considered skeuomorphic, too. However, contrary to popular opinion, flat design is not the opposite of skeuomorphism.

App Icons in iOS 6 vs in iOS 7

Flat Design

Alongside the transition to iOS 7 from iOS 6, Apple introduced ‘flat design’ interfaces to its array of products. If we compare the visual design of iOS 6 to that of iOS 7, it is evident that Apple did away with elements like drop shadows, variable lighting and textures — which is the reason why such design is called flat. However, this design style still retains skeuomorphic aspects: the phone app is still using an old phone receiver, the camera app is still using a camera, and the mail app is still using an envelope.

But Why Move to Flat Design?

Google’s old logo (up) and new logo (down)

There are two primary reasons why we are moving to flat design: our changing habits of consuming content, and (in the realm of technology) the increase in the number of devices with varying display sizes.

The usage of grid-based layouts is particularly suited towards visual design in the digital realm, since such layouts are easily able to be resized or rearranged to display on different devices with different screen sizes. This also allows designers to create an arrangement that best suits and showcases content, rather than squeezing content into a constrained pre-determined layout. However, the highly detailed and more skeuomorphic design style that embraces shadows, textures, and fixed-sized images doesn’t translate too well when scaled up or down to fit different screen sizes. On smaller screens, such as wearable products (smartwatches), designers have to make use of every pixel on the tiny screen. Hence, there is no room for decorative elements.

Additionally, flat designs tend to load faster.

Upon changing its logo, Google found that the size of its new logo’s file is less than half the size of the original file. The old logo used serif type, while the new logo uses sans-serif type.

The reduction of visual elements in design is also associated with people’s greater focus on content. Today, we receive information in a much shorter duration — and so, this places a restriction on interfaces. Under this restriction, all unnecessary visual elements act as a burden. Hence, interfaces, too, must try to deliver their messages effectively and quickly.

The Future of Flat Design

There is little opposition to the opinion that flat design ‘just works’. It solves a number of problems, as mentioned above, that existed with older styles. However, flat design, through its wide-spread adoption appears to be getting ‘too generic’. Design also follows its own trends, and it is likely that we may see changes in this flat design style.

Apple Watch Series 1

However, considering the past, the present, and the future, we may be able to foresee that graphics will be as simplified as they are today. Besides that, there also exists a crude possibility: the elimination of visual interfaces. Will we ever eliminate the visual interface altogether? Although this seems to be very absurd, it is certainly a possibility to consider for the future.

This article was originally published in my School’s Arts-themed magazine, VIBGYOR, in 2017. Thanks for reading!

--

--