Flat vs Skeumorphic Design

In design we see the occurrence of old trends going and new trends coming in. This is an age old story, one day we like things that are clean and structured and the next we like things that are chaotic and abstract. The result of these two trends coming and going is eventually a mixture of the two, which in turn becomes a new trend with new ideas and rules to follow. So lets look at how it is happening right now with "Flat" and "Skeumorphic" design.

     


Skeumorphic Design

Wikipedia defines “skeuomorphic” as: “a derivative object which retains ornamental design cues”. Basically a website or interface that looks like or resembles real life. One of the great examples and companies that used such design is Apple. I personally like skeumorphic design, as a traditional artist I like to paint things to look realistic, not that there's anything wrong with abstract art but its not my cup of tea.

In this example the bookshelf looks like a bookshelf. Has gradients, textures, shadows, highlights, and more. Everything was added to create a real life looking experience. The desire to convey depth and a feeling that the books are actually tangible. 

Advantages

  • Visually captivating, for the designer it is fun to design such things
  • Richer user experience with more things to play around with
  • Intuitive user experience
  • Attractive and inviting design

Disadvantages

  • Extremely image and assets heavy
  • Slow load times
  • Not always suited for responsive web design
  • Style may be seen as old fashioned or out dated

Flat Design

Honestly flat design is nothing new and innovative, its been around the block before. Minimalistic design maybe? Of course, but like I said in the beginning trends come and go. In this case we have "flat" design that is coming in again because it is simple, easy to understand and lots of breathing room. In design we go through phases of not having enough imagery to getting overwhelmed by it, to then having little to none. I like this approach, especially when we look to the simple and brilliant designs that the designers of Apple, Braun and the modernism movement in graphic design create.

Here is the example of Tripfinder large color blocks and simple icons and text tell you where to go and what to press. Everything is on the same plain and is equally spaced. Simple and beautifully done. It's easy to understand what's going on and what to do next.

Advantages

  • Usability is at its best, more time and effort is put into the workings of the app or website then in the design
  • Responsive web design is practically built in to the rules of the game
  • No hidden tricks, everything is in plain sight
  • Simple, clean, colorful and modern

Disadvantages

  • Buttons and links all kind of look the same, no depth
  • Contrast can only be attained through color, shapes and position
  • Everyone will start to look the same (what else is new with trends)
  • Not much design effort is put in

Personally I like both design styles and trends. Good design is knowing when to use which. Recently I try to find a middle ground between the two to give a simple look but with some depth, contrast and textures.