Flat or Skeuomorphic is the Wrong Question; It’s About Satisfaction

A great deal of digital ink has been spilled of late regarding the relative merits of Flat or Skeuomorphic design. On one side of the spectrum, both Microsoft and Yahoo! are embracing elements of Flat Design while Apple famously incorporates facets of so-called skeuomorphic design across its application portfolio.

I’ve been thinking about this quite a bit recently while working on a new app project for an e-commerce provider. I kicked off the visual design process by mood boarding a spectrum of styles from sites like Pinterest, Dribbble, and Designspiration.

The point of this process is to determine what style appropriately conveys the attitude and personality of the app itself. The intended impacts of each theme are not mutually exclusive—in fact, the Hybrid direction we ultimately recommended deliberately borrows meaningful aspects of each.

Flat or Skeuomorphic blink mood literal/>

Literal:
This theme takes the sense of layering and space a step further, depicting specific physical objects with three-dimensional relationships to their environment. Objects may be rendered with photo-realistic shading and texture effects, implying depth of space and physicality. These effects convey interactivity and evoke a sense of immersion and delight.

Flat or Skeuomorphic blink mood minimal

Minimalist:
The opposite extreme is the flat design aesthetic, reducing elements to their simplest essence. Space and relationships are defined by blocks of color or negative space, with big target areas for actions. Eliminating embellishment of the UI elements allows the tool to fade into the background. This allows the emphasis and emotional weight to shift to the meaningful, user-driven content.

This got me to thinking about the classic Handbook of Usability Testing, by Rubin and Chisnell in which they describe usability as a combination of:

  • Usefulness
  • Efficiency
  • Effectiveness
  • Learnability
  • Accessibility
  • Satisfaction

As a visual designer, my role extends beyond basic functionality to also address aspects of confidence, perceived value, delight, and emotional engagement: The “Satisfaction” piece of the Usability equation.

The goal of visual design should always be to facilitate usability, which could be qualitatively measured through research (but usually isn’t). Beyond mere functionality though, the presentation layer serves intangible, instinctual, and emotional functions as well. The chosen design style is an aesthetic choice, not a functional choice. It is meant to communicate something deeper about the character of the product. We’re talking art, not science. What is the personality? What does it feel like? What memories or cultural experiences does it evoke?

Consider these two houses. They each perform the same function equally well. They both keep us dry, have a place to watch TV with our loved ones, and let us sleep well at night. I prefer the modern one, while others would be more comfortable in the ugly one. Both are acceptable solutions, but they are undeniably different.

Flat or Skeuomorphic houses

Don’t get me wrong: I am not advocating or defending the popular ‘skeuomorphism’. My point—and one that most dialogue about the issue misses—is that Flat or 3D styles are an aesthetic choice for emotional reasons, not an accessibility choice for functional reasons.

Yes, in some cases a physical real-world metaphor may help novice users grok what the thing is. Apple has long pushed physical simulacrum, from the original Mac desktop, files, and folders, to the infamous ripped notebook pages and leather stitching. The primary intention though is an emotional appeal. As Steve Jobs himself put it in Fortune magazine:

In most people’s vocabularies, design means veneer… to me, nothing could be further from the meaning of design. Design is the fundamental soul of a man-made creation that ends up expressing itself in successive outer layers of the product or service.

People have rightly called them out for illusions that are inappropriate or too literal, and it’s encouraging that a growing portion of the internet-commenting public has become so UI literate that many of these flourishes have become superfluous.

Overdoing it to the point of ridiculousness though doesn’t discredit the concept of visually implying depth, space, or tactile material. These qualities often do enhance usability by creating a sense of order and hierarchy. What is “in front”, which bits are clickable vs read only, what is most important on the screen, etc.

Appropriate use of visual metaphors and dimensional effects can both enhance usability and convey mood and attitude. Sure, the “authentically digital” flat style is en vogue, but extreme reduction by itself doesn’t alleviate usability issues, and may introduce new ones. Categorically abandoning visual cues and the tools of visual language for the sake of authenticity or current trends is dogma, not design. It may suit the particular goals of your application, but it doesn’t necessarily further the ultimate objective of usability.
Some suggested guidelines for deciding if a design style is appropriate:

  • Does it help or hurt usability (Usefulness, Efficiency, Effectiveness, Learnability, Accessibility, or Satisfaction)?
  • Does it highlight or distract from the important content or workflow?
  • Does the style communicate something important about the brand?
  • Will it hold up over time? Will it look dated in a year?
  • Do you have to make exceptions to the metaphor to make it work (i.e., scrolling on paper book pages)?
  • What else in the world shares that style? Does that association say what you intended?

My overall point is that neither flat or skeuomorphic is inherently “better” or more usable. It depends entirely on how these styles are used, and if they serve the goals of the work.

It’s a nuanced and subjective question that depends on the intent and the implementation. There is no absolute answer so every design needs to be tested individually to determine how it performs. The user experience is about more than simple usability: it’s about how the user feels about what they are using. Visual design is a powerful tool for guiding that aspect of the experience.

(652 Posts)

Paul Andrew

Paul is the founder and editor of Speckyboy Design Magazine. He has many years experience within the web design industry and a passion for the latest web technologies and design trends. He lives in the small town of Inverness in the north of Scotland. Follow him on Twitter, Facebook or Google+.

Comments

  • DerekHogan

    my take on this subject is to go “full-on” (skeu- or flat), meaning if you’re gonna design ‘realistic’ products,environments etc. then go all the way. same goes for flat design. one aspect i see sometimes is designers using shadows and bulging buttons and its labelled flat design. or for skeumorphic designers designing a beautiful icon that looks ultra-realistic but the rest of the page isn’t uniform to that aesthetic.

  • kid

    Excellent article. I totally agree and I thank you for publishing this. I too see so many web developers clinging to flat design and also in one way or another to responsive design. After doing this for 15-20 years, I have found myself making sites that were responsive a LONG time ago, when the need were to arise. Some folks use very small monitors while others use big monitors and it was like that way before smart phones. So it just depends. The same thing applies to ‘flat’ design. Yes, it is appealing but so are other designs. It just depends. I think it is funny when I see web developers clinging to catch phrases like that. Just because MS used a flat design in Windows 8 does not mean everyone should use flat design everywhere every time. Everyone is so “standards” based that they want to outlaw anything for any reason they can come up with. I am not a purist in any of these forms. I also saw someone’s bio the other day and it said something like, “I enjoy technology, art and flat design”. I thought that was really funny and that this person is young, under-experienced and drawn closely to the MS side of the house. From the perspective of an artist, minimalism goes way, way back to the early 1900’s. Flat design is nothing new. Look at Jack White, The White Stripes and their Album De Stijl. “De Stijl” was an artistic movement that started a very long time ago where the idea of minimalism was invented. Look it up on Wikipedia!