A Conversation: Is “Flat” the Next Trend in Design?

(Editor: Every so often our consultants have an in-depth in-house email conversation on things that interest us. These conversations are often informative and entertaining, so I’ve been tidying them up and posting them to our blog. This session focuses on emerging design trends resulting, in part, from the higher resolution of new mobile devices.)

Allison

Check out this article from Daring Fireball on The Trend Against Skeuomorphic Textures and Effects in User Interface Design

“If you want to see the future of software UI design, look to the history of print design.”

Works for me, since everything I design on my own is as flat as South Park…but what do real designers (and those with opinions about design) think about this?

Mitchel

I thought it was an interesting point that many digital design tropes exist to cover up mediocre screen resolution. With displays approaching equivalence with paper we can now look back to centuries worth of print design for inspiration.

Milton

The flat look is based on Microsoft’s current and future design language called Metro.

This style was influenced by public transportation signs, which puts more emphasis on typography and it’s visual hierarchy. This style has been gaining popularity for the past few years. It leans away from the hard gradient look and works great for application interfaces.

Amber

Agreed – the flat design lends to clear and easy to read typography and iconography making a clean and simplified user experience. Ultimately getting the design out of the way so the user is dependent on gestures. Gizmodo also recently released this article http://gizmodo.com/5974821/13-design-trends-for-2013 which also mentions flat design, but also puts an emphasis on fewer buttons, responsive and larger search inputs.

George

I like the flat look overall. In the right hands, the result can be a beautiful design that doesn’t get in the way of the fun/work/content.

And know for some pedantry:

<pedantic-raving>

I think the concept that Gruber is describing is an uncanny valley of things. As displays get better, overly skeuomorphic design elements need to increase their fidelity to the artifacts they emulate. But the closer they get, the more fake they look, until they cross the valley and look real (current technology can’t do that).

I suggest that the shift away from skeuomorphic elements in UI is due to the drive to natural user interfaces (NUI). NUI removes the need for the abstraction and metaphor seen in GUI. The user is expected, and expects, to directly manipulate the elements presented in the interface. This leads to less need–and less desire–for additional elements to frame the functional elements and content in such software. As Amber mentioned, gesture-based interactions often require fewer affordances to accomplish interactions.

But we still cling to some skeuomorphs when we need them. As the Daring Fireball piece pointed out, Letterpress uses drop shadows to help aid understanding of the state of a letter tile. And the app has “buttons” in the user interface. These are still skeuomorphs, designed with the current fashion for flat elements.

I am wary of an equivalence with designing for paper, though. The rationale for the inclusion of skeuomorphs is not entirely arbitrary. Outside of over-ornamentation, skeuomorphs are a consequence of metaphor-driven graphical user interface concepts. Windows and other GUIs adopted skeuomorphs for file and folder organization to make clear the relationship of containment in a way that fit the metaphor of a user’s desktop. The visual equivalences provided an effective anchor for instructing the user on a feature of the system.

Paper design has rarely ever needed to include such elements. The flat, non-interactive aspect of paper did not require an intimation of behavior. Paper is the thing itself. And it would be wrong to imply that paper-based design has ever lacked excessive ornamentation or overwrought design.

</pedantic-raving>

Dan B

I’m all for simplicity, but “flat design” only makes sense if it reinforces the goals of the UI. It’s like applying mechanics to stories, or games, or ANYTHING. You have to understand the core engagement of your product and find out which UI patterns reinforce that mechanic. Sometimes flat design doesn’t do it. Sometimes skeuomorphism works because the analogue really has the most intuitive set of controls. It’s all about finding what’s appropriate. Trying to settle on “the new norm” is constricting and won’t let you build the best interfaces possible.

Mitchel

Agree with George as to a literal equivalence to paper, but I like the idea of looking to the history of print for design inspiration, rather than the history of office furniture.

David

Personally, I like a 1/2 and 1/2 approach. Gradients, drop shadows, buttons, even “brushed metal” textures make an interface rich and “clickable”. But “rich corinthian leather” is going too far and is kind of silly.

I think the reason Microsoft did the Metro thing was to differentiate themselves from Apple. Like, “since Apple is doing skeuomorphic design, we’ll do the opposite!”. And since it’s different everyone is copying it. Remember when Apple released Aqua? Every design (web or otherwise) had plastic buttons. It’s just a new trend and I imagine that it will settle somewhere in the middle.

Amber

Ultimately it’s a trend. Good design is timeless.

Mitchel

In fact I think good design is of its time. Look at some of the great psychedelic-inspired designs of the 60s/70s – we may still admire them, but they’re certainly dated. True of nearly every era, except perhaps that mid-century modern minimalism, that stuff never looks old.

Allison

I don’t think that we’d ever get to a point where print and web design will be one in the same – just that the (presumed future) proliferation of high-resolution devices will allow designers to take advantage both of more traditional design elements and practices while also taking advantage of the medium of pixels.

Good design principles are timeless…but how they’re employed, and which principles are favored over others does move with the times.

David

Flat design is teh future!

George

I think you mean it’s the next generation.

David

Touché….

Adam K

I’m not sure I entirely agree that print design is timeless. The medium there has changed significantly over time. I’m not sure if that has had an effect on typefaces but certainly the ability to put out inexpensive high-impact color has changed the design principles used in print. Same with the changes in the paper medium over time as well as printing capabilities….

Doug

1. Jonathan Ive is said to be eager to do away with all the skeuomorphism touches in all the apple software. My understanding is the Steve Jobs was into the Corinthian leather look in his apps and felt that you should be into it too. Mr. Ive, Apple’s Creative Director, disagreed. Not sure, but it strikes me that iTunes is looking leaner.
2. Why isn’t there more comparison to industrial design? Braun designed and made functional and aesthetically enduring products. Dieter Rams oversaw the creation of many of their iconic products. I think that’s what Amber was suggesting – the simplified aesthetic isn’t confined to print and the web.
3. Why is this being called flat design? I would have called it Swiss. It’s economical, efficient, and clear. It serves its functional objective. The aesthetic qualities of the brand – logos, ornamentation, branded labels – drop back and allow the UI elements to set a user’s expectations and, subsequently, meet them.

While I agree that screen resolution is a wonderful thing for legibility, I’m not so sure that you can point to it as the catalyst for flat design or the Swiss aesthetic.

For me, UI design is fundamentally about wayfinding and communication. The UI is there to support those activities. If its doing something else, I ask myself why it’s there.

One other esoteric reference. Marshall McLuhan is a good, if not trippy, read. His assertion “the medium is the message,” is pretty interesting and gets at the dynamic quality of any medium; paper, television, computer, phone, stage, film. There are few absolute rules.