The World is Flat

Written by Wes Button on . Posted in Blog

Share
The World is Flat

by Wes Button

If you’ve been following the general movement of web and UI design over the past few years it’s likely that you’ve noticed a move away from the gradients, drop shadows, faux-depth and reflections and towards flat colors, simple clean lines, large and modern typography, and beautiful, high-resolution photography. This momentum towards flatness is no accident and represents a paradigm shift in the way society at large interacts with and understands the web, mobile devices, and technology in general.

At the apex of Web 2.0 design, in the mid-2000s, gradients, shiny plastic, and drop shadows seemed to be everywhere. Design elements mimicked actual objects – plastic shiny buttons that cast shadows, paper and leather textures, etc. This method of designing a user interface is called skeuomorphism.

Touching our technology

When the iPhone was released in 2007 skeuomorphistic interfaces really took off. The core (read: non tech-enthusiast) user needed to relate to these new multi-touch interface devices. This meant leather borders, paper textures, buttons that looked like physical switches, and so on. These visual metaphors helped users understand how interface elements functioned. It helped society cope with the fact that they were not turning paper pages or flipping actual switches.

Years have passed and society at large grew very comfortable with touch devices. In fact, tablets are expected to surpass desktop and laptop sales by 2015. This rapid adoption of touch devices has led to the inevitable conclusion: core users are plenty comfortable with the idea of manipulating a digital interface without the need for physical metaphors.

Enter flat design

Not as a trend, but a logical step forward. Large, simple interface elements are easy to scale and resize, use very low bandwidth, and when combined with great color and typography, make it far easier for the 2013 user to navigate and use.

Flat is a re-think of how we interact with technology. Long gone is the need to try to disguise the fact that we are using a digital framework – instead, users can embrace the idea that they are viewing pixels and not some representation of a physical object.

The advantages are plentiful. Flat design is very slim, easy to make responsive, frees up screen space previously used by functionless embellishments. By deleting unnecessary styling, designers can more easily focus a user’s eye to the key areas of a page or interface.

Believe it or not, Microsoft was the first to jump on the flat bandwagon with the advent of the Metro UI, Windows 8’s new interface that used simple white icons and color-coded tiles. Google soon followed, and now Apple with iOS7. These three giants have already moved forward with full brand overhauls based on flat design.

Flat design is the evolution in UI design that marries aesthetic and functionality in a way that a more technologically adept society can appreciate. Going forward, we’ll see trends emerge within flat design

 Share on Google+

  • http://webfor.com/ Chelsea Terris

    Very interesting, Wes! This blog gave me a whole new set of design-aware eyes!

  • Michael Rough

    The first flat renderings were paintings on a cave wall showing how to hunt, while not touch interactive they formed a narrative that attempted to portray an event that previously could have only been related through vocal story telling. You can see the shift regarding interactive expectation when you watch young children poke at books and their look of surprise when it does not interact with them. The point at which we go back to realistic, graphical metaphors will probably occur when personal micro holographic projectors allow users to manipulate their environment without need of more than eye tracking controls.

CONTACT US

Footer Contact

  • This field is for validation purposes and should be left unchanged.

CONTACT INFO

  • Webfor
    11805 NE 99th St, Ste 1360
    Vancouver, WA 98682

    (360) 747-7794
    (503) 512-0770
  • Webfor on Facebook Webfor on Twitter Webfor on Google Plus Webfor on Linked In