Flat Design Done Wrong

Posted: 08 Jul 2013 05:30 AM PDT

Flat design is something I should like. It takes its influence from many of the same sources that influence my design philosophy. It’s a move toward minimalism with an emphasis on design fundamentals which I endorse and talk about often.

Yet so many of the flat designs I’ve seen have left me less than inspired, which seems something of a disconnect. It’s taken me some time to understand why and in gaining that understanding I’ve picked up some ideas of what this flatter aesthetic is really about or should be about.

I’d like to spend the next couple of posts talking about flat design. Today I’ll focus more on where it goes wrong and next week share more about how much it gets right once you get past the name.

Flat Design: The Reaction Against Skeuomorphism

Last week I said that skeuomorphism used metaphors to help people familiar working in one medium understand how to work in a new one. At the end of the post I mentioned that we’re familiar enough with the new digital medium that we no longer need these metaphors.

I also suggested that as designers one upped each other on the realism, it had grown tacky. What had been meaningful aesthetic became false ornamentation.

It shouldn’t be surprising that designers reacted and it shouldn’t be surprising that the reaction has been close to 180 degrees in the opposite direction stripping away all signs of skeuomorphic detail.

Skeuomorphic realism is replaced by the more abstract
Skeuomorphic details are replaced by simple, geometric, and detail free forms.
Skeuomorphic depth cues are replaced by flatter or flat elements

This flatness gave the new aesthetic its name, though it was hardly the only change or even the most meaningful one.

Swiss design wasn’t slavishly flat and neither should be the new aesthetic

While they didn’t start the trend, Microsoft certainly brought it to the forefront with Windows 8 Metro (or whatever it’s now being called). Whether or not they were specifically trying to move away from skeuomorphism or just trying to be different than Apple doesn’t really matter. Lots of people saw a new flatter aesthetic and it made skeuomorphic realism seem out of place and a thing of the past.

Suddenly everyone was copying what they thought this new aesthetic was supposed to be and talking about it based more on the name than the underlying reasons for the change.

Flat Design Sometimes Leaves Me Flat

When flat designs started appearing I had mixed reactions. Sometimes I liked what I saw, but many times I didn’t care for the flat designs I encountered. Other than the handful of cases of truly poor design, I didn’t understand why some of this flatter aesthetic didn’t resonate with me when it seems to agree with much of my own philosophy about design. I’m finally beginning to understand.

For one it’s an awful name based on a surface detail of what’s going on. And because it’s been given a name it’s ripe to become a fad. The name implies the new aesthetic is based solely on it being flat and I don’t think this literal interpretation is the reason for this new aesthetic.

You might have noticed so far in this post I’ve sometimes referred to flat design and sometimes to a flatter design aesthetic. I think the latter is more in line with the goal and the former is the fad created by lazy designers who just want to push the latest popular thing.

To understand my sometimes disdain I spent a little time looking at designs considered flat that I found in the usual example sites featuring the latest trendy. I noticed a few things about the designs I didn’t care for

They were entirely flat as if nothing else mattered
There were few if any curves and had mostly boxy designs
There was lack of a cohesive color scheme
There was minimal consideration given to typography
The organization of elements seemed an afterthought
The layout itself seemed an afterthought

In other words the flat designs I didn’t care for paid little attention to design fundamentals. The thing is when you strip away the skeuomorphic ornamentation and realism, what you’re left with is the fundamentals. Unfortunately too many flat designs focused solely on the flat and skipped the part about fundamental design principles.

This isn’t true of every design considered flat. Many sites do get these things right and consequently make a favorable impression on me, but there are enough that adhere only to the flatness to lead to my negative feelings.

The flatter aesthetic is, or should be, based on rational design decisions. It’s not meant to be based solely on flatness. Flatter is not flat. The latter copies and perpetuates a surface style while ignoring the underlying problem being solved.

Granted this is just my opinion, but I think too many flat designs have trouble seeing past the name and take flat literally as if the slightest depth cue must be avoided at all costs. The thing is sometimes depth and texture can be the right solution to the problem, for example to make clear that some elements are clickable.

Dimension, depth, and detail are not bad things. What’s bad is relying on them too much and to the point where they’re used purely for ornamentation. We don’t need to eliminate them. We need to minimize them and more carefully consider when to use them.

The Web isn’t Print

It’s funny how we sometimes understand that the web is different from print and sometimes we don’t. Just as we’re realizing that the web doesn’t come with the fixed dimension of print, we’re forgetting that it can offer more than a flat piece of paper.

The web has depth. Treating it as though it’s a single flat dimension is just as dishonest as making digital objects look like real world physical ones.

We can place elements behind each other and not just pretend they’re behind each other. There’s a z-index running through our screens. Depth is not a bad thing. It was overused, but that wasn’t the essential problem with skeuomorphism. Pull back on the depth, but don’t slavishly avoid it at all costs.

Interesting to note is that Swiss design, which is the major influence of flat design, wasn’t always flat. It was flatter, but there are plenty of examples from the Swiss or International Style of design that contain shadow, occlusion, and transparency. Swiss Design wasn’t slavishly flat and neither should be the new aesthetic.

Closing Thoughts

Given the above you might think I’m still feeling very negative toward flat design. Outside of the name and designs that take it too literally that isn’t so. There’s actually a lot to like that I wasn’t originally seeing. Whether it’s because I happened on the wrong examples at first or because I was reacting to what I consider an awful name I’m not sure. Probably a little of both.

When you take away the name or when designers can get past taking the name literally, there’s a lot to like about flat design or rather this new flatter aesthetic.

Next week I’d like to talk about what there is to like. I want to focus on the good, the almost flat as opposed to the entirely flat. There is a lot to like and I think the move to this new aesthetic signals a deeper shift in where design on the web is heading and I happen to like where I think it’s going.

The post Flat Design Done Wrong appeared first on Vanseo Design.