71

I have read multiple articles on-line that say that the era of Skeuomorphic design on the web is over, and that a new era of so-called 'flat design' is now the new thing for developers, but do users really like the 'flat design'? I have not been able to find any articles that say what their users have thought, only ones that say it is the new standard of applications. Every designer that I have talked to also questions if people like it, but say they will get used to it fast.

I for one like to have a blend of both Skeuomorphic design and 'flat design' in my applications but I am starting to wonder if I should drop the Skeuomorphic design that I have in exchange for less buttons on the screen. So my question is, 'should I change it, or keep it the same'?

8
  • 6
    Not to rebut your question, but rather to add onto it... was there every any research or work done into finding out whether people liked skeumorphic designs in the first place? I've always seen them as being a rather contentious issue among designers in different camps. Commented Jan 19, 2013 at 0:38
  • 5
    You should add a date to your question "Which do users like more as of early 2013, 'Flat Design' or 'Skeuomorphic'?" -- the answer can only be valid for a short period of time by it's very nature.
    – jlarson
    Commented Jan 19, 2013 at 1:29
  • You also need to specify which users you are talking about. It's not one homogenous group of people. Demographics play a huge part.
    – JohnGB
    Commented Jan 19, 2013 at 2:08
  • 3
    I think we're still abusing the term 'Skeuomorphic'. Skeuomorphic does not mean 'shiny'.
    – DA01
    Commented Mar 1, 2013 at 19:45
  • 6
    'Skeuomorphic' and 'flat design' are not opposites, or either/or scenarios. It's hard to answer the question because people are confusing the terms.
    – DA01
    Commented Mar 1, 2013 at 19:46

12 Answers 12

85

An interesting read by John Gruber on the shift away from skeuomorphism makes the argument that increasing pixel density resolves some of the issues that gave rise to certain skeuomorphic practices like shadows and gradients:

The trend away from skeuomorphic special effects in UI design is the beginning of the retina-resolution design era. Our designs no longer need to accommodate for crude pixels. Glossy/glassy surfaces, heavy-handed transparency, glaring drop shadows, embossed text, textured material surfaces — these hallmarks of modern UI graphic design style are (almost) never used in good print graphic design. They’re unnecessary in print, and, the higher the quality of the output and more heavy-handed the effect, the sillier such techniques look. They’re the aesthetic equivalent of screen-optimized typefaces like Lucida Grande and Verdana. They work on sub-retina displays because sub-retina displays are so crude. On retina displays, as with high quality print output, these techniques are revealed for what they truly are: an assortment of parlor tricks that fool our eyes into thinking we see something that looks good on a display that is technically incapable of rendering graphic design that truly looks good.

This is a phenomena that is not limited to user interfaces.

A similar transition is happening in cinema with HFR (high frame rate) films. In this interesting post photoshop creator and ILM visual effects supervisor John Knoll explains why 48 frames per second creates a "hyper real" effect which causes an "allergic" reaction in viewers as the makeup and scenery which compensated for lower quality 24 FPS is exposed for the crutch that it is:

Imagine you had the lucky privilege to be invited by Peter Jackson onto the set of the Hobbit. You were standing right off to the side while they filmed Bilbo Baggins in his cute hobbit home. Standing there on the set you would notice the incredibly harsh lighting pouring down on Bilbo's figure. It would be obviously fake. And you would see the makeup on Bilbo's in the harsh light. The text-book reason filmmakers add makeup to actors and then light them brightly is that film is not as sensitive as the human eye, so these aids compensated for the film's deficiencies of being insensitive to low light and needing the extra contrast provided by makeup. These fakeries were added to "correct" film so it seemed more like we saw. But now that 48HFR and hi-definition video mimic our eyes better, it's like we are standing on the set, and we suddenly notice the artifice of the previously needed aids. When we view the video in "standard" format, the lighting correctly compensates, but when we see it in high frame rate, we see the artifice of the lighting as if we were standing there on the set.

When it comes to skeuomorphic design, it is a matter of degree. On the one extreme you have the much maligned leather bound calendar, and on the other, you have the (increasingly) maligned ultra flat Win 8 Metro UI.

In the middle are the "glossy/glassy surfaces, heavy-handed transparency, glaring drop shadows" etc. As the quality of the displays users utilize to access interfaces improves, the less they will "like" the techniques that were developed to please the eye on lesser displays.

To answer your question, I would say that the current trend is not an abandonment of moderate skeumorphism requiring a totally flat design.

Gruber rightly qualified the trend as "flatter":

The lack of skeuomorphic effects and almost extreme flatness of the “modern” (née Metro) Windows 8 interface is remarkably forward-thinking. It’s meant to look best on retina-caliber displays, not the sub-retina displays it debuted on (with Windows Phone 7.x) or the typical PC displays of today. That said, I think there’s a sterility to Metro that prevents it from being endearing. There’s a reason you hear people calling for “flatter” UI designs, but not for “Windows 8 style” designs.

It sounds like you are already in the middle area between the two extremes, so it is hard to say whether you should change or not without some examples. However I would anticipate that much as the HFR films will result in new cinematic techniques, retina displays will open the field for new design techniques that may leave the skeuomorphic crutches from the past behind.

5
  • 4
    "They’re unnecessary in print, and, the higher the quality of the output and more heavy-handed the effect, the sillier such techniques look". Print evolved with a different set of constraints and interaction with the user was limited to the user reading the copy or looking at the images. I don't think the issue of display quality is the explanation here.
    – Sylver
    Commented Mar 3, 2013 at 12:10
  • 2
    Although I think this is a great answer, I don't think that it is the whole answer, as the move from shiny and round (intentionally avoiding the term "skeuomorphic") to flatter and more square isn't limited to what we view on screen. Just look at the physical design of the last few iPhone iterations. The 3 had rounded edges and a polished back, the 4 had square edges with a smooth glass back, and now, the 5 has square edges with a brushed metal back. Commented Mar 20, 2013 at 20:12
  • The HFR movies were shot at high framerate and the unnecessary frames dropped for lower framerate cuts. The frames are exactly the same lighting and level of "eyes-like" in both 24 and 48 frames. How is that related to lighting then?
    – data
    Commented Jul 18, 2014 at 11:19
  • A long answer but I still can't see where it addresses the question - where are the usability studies confirming that users indeed find flat design better? Commented Aug 3, 2014 at 5:36
  • "It’s meant to look best on retina-caliber displays, not the sub-retina displays it debuted on (with Windows Phone 7.x) or the typical PC displays of today." that last part is probably a major factor of its rejection: Smartphone/tablets and desktops being different beasts, and Microsoft's attempt to erase this difference hit a wall when confronted to reality.
    – Medinoc
    Commented Aug 16, 2021 at 16:10
11

Besides the techical evolution I think a major force is marketing. In order to distinguish the UI from competitors like Apple and Google, Microsoft uses the Modern UI to look modern and fancy. Here is a nice article that compares the paths Modern UI is coming from http://punchcut.com/perspectives/posts/windows-8-origin-story.

Another aspect can be the grade nowadays culture is incorporated by computer interfaces. No need to explain to people how and why interfaces work. Its quite common knowledge for people, the majority of people. Therefore you don't need to explain concepts by skeumorphic metaphors.

And we have more and more useless metaphors (which is the same way for explaining concepts like skeumorphism) like the old school floppy disk for saving. Just take a look at current interfaces - how to find a metaphor for downloading, sharing, collapsible menu, etc. Interface and concepts became more abstract over the last 5 years. So the UI-style too.

Personally, I sometimes have the impression that correct and well done usability tends to be conservative. Sure, for good reasons, but people can learn and are willing to learn new UIs and interactions if the reward is high enough. For me that's the classical frontier of UX and usability: striking for newness while preserving common behavior.

7

In the context of UX/UI, Skeuomorphism is representing a digital interface in a way to replicate its analog cousin.

'Flat Design' is an aesthetic visual treatment.

Your question is: which do people like? Well, that's a broad question and is going to depend entirely on the context of the particular interface you are building for the particular product.

And one doesn't negate the other. The aesthetic decision to go with 'flat' versus, say, 'shiny 3d' is one decision. Whether or not to use skeuomorphism is an additional question that can be independent of the former.

1
  • 2
    Upvoted because you emphasized that flat and skeuomorphic design principles are separate dimensions. You can have both, neither, or either. Commented Mar 25, 2013 at 19:25
5

The question is probably a tricky one to answer. Even if you get the answer, it's not sure that what people "like" (in an aesthetic way) is the same thing as if it makes the system better (from an overall perspective with focus on the interaction design and UX).

It's no doubt about the fact that a lot of systems are heading towards a flat design (Windows 8, Facebook etc) and trends, meaning that people like what's hot at the moment, are common in all areas where humans choose what to like (looks of other people, fashion, industrial design etc). This makes me believe that flat design will be popular for a while now.

Be aware though - flat design has it's (documented) flaws. If everything looks flat, including buttons, the user gets no affordance that tells "I am pushable" for example.

Well-known interface guru Jakob Nielsen addresses the fact that the Windows 8 design is now flat. Icons, he says, "are flat, monochromatic, and coarsely simplified." He concludes:

"Icons are supposed to (a) help users interpret the system, and (b) attract clicks. Not the Win8 icons."

Nielsen's view on Windows 8, including its flat design

5

You have two questions:

1. What kind of design do users like the most at the time of this question, 'Flat' or 'Skeuomorphic'?

2. So my question is, 'should I change it, or keep it the same'

To answer

  1. Immediate answer is Flat (with caveat). Flat design is in a clear trend. The aesthetic and visual language/vibe of 'flat' is something that most people understand and appreciate, especially in the web context. When Apple moves away from 'skeu' to flat you know that it's gone fully mainstream. There are many other factors and specifics, but from a very, very broad sense, and from a simplicity and usability perspective, flat will be appreciated and understood by the typical web user. Especially in a straightforward, simple app meant for "everybody" - I don't see this being a bad choice. However there is a strong caveat...

  2. Flat design is exactly that: a trend. There are many reasons for this trend that other users have already explained ('authenticity to medium', simplicity, rise of vector tools for designers v photoshop etc). But to say that design will alway and forever be 'flat' from this point onward, forever, is of course a big mistake. Trends come and go, determined by context. We don't know what contexts and what technologies will define our culture in the future.

As designers, we're constantly figuring out the right contexts -- the context of hard deadlines, the process, the app itself, the audience (is it for a Goth community? Doubt the typical Flat look + colors would work...). So while my blink answer was "yes" to flat, this is the better and more complete answer and something only you can decide.

Flat as a style is not future-proof. But good design principles (clarity, simplicity, hierarchy etc) are forever. Remember, even 'style-free' sites (like Reddit, Drudge report) can become very successful because they fit perfectly within the contexts they live in.

4

Skeuomorphism on the web or in computer UIs in general is not dead. The flat "Metro" has become trendy recently but it's really just a trend.

Apple produced some poor (and rightly ridiculed) examples of skeuomorphism with the stitched leather on the calendar and such, and that type of skeuomorphism is on its way out. But more subtle uses of skeuomorphism that provides hints of pushable buttons and slidable sliders won't be going away because it's useful, helps communicate and aids usability.

4

I think first you have to understand the purpose of skeuomorphism and use it for the right reasons. Don't use it because you want to trick the user into thinking it's "real" and don't use it solely for aesthetic reasons.

What is the purpose of skeuomorphic design? To convey functionality.

Skeuomorphic Design Should Convey Functionality

3

The whole flat design is a trend. And it is unfortunate trend as forgoing a dimension basically means that there are less affordances which in turn makes it more difficult for users to differentiate actionable items.

I believe this trend was started by the Microsoft Metro style and it is probably more about differentiation from Android and iOs than good UI design.

3

I have taken some of the flat designs that designers adored and done some user tests with them. First of all, users found them plain and generic. More troubling was that users found them confusing.

Without drop shadows, gradients, and textures, they thought that the page hadn't fully loaded or that it was buggy. I watched, stunned, as they sat and waited for it to load or refreshed the page several times to try and make it work.

I now make sure that there is always a shadow, gradient or texture, even if it's extremely subtle. It seems that users think a flat shape is a mistake, whereas a shadow, gradient or texture indicates to the user that an element is supposed to be there.

3
  • Do you have any link to those results and studies?
    – PatomaS
    Commented Mar 31, 2014 at 5:52
  • @PatomaS I'm afraid there's nothing to link to. In case it's unclear, these were not official studies. This was just me running some tests with some volunteers in order to make a decision about what designs to use in my work. Commented Apr 1, 2014 at 1:52
  • 'flat design' does not negate shadows, gradients or textures.
    – DA01
    Commented Apr 1, 2014 at 17:11
2

I completely disagree with the notion that Skeuomorphic was to compensate for low resolution. Historically, we can see that Flat design was in use in the early 1990's for computers, i.e. CGA and EGA level monitors, due to their limited resolution and colors. As resolution improved, there was a desire to try to make graphics more realistic, because the capability was getting better and better. Designers everywhere desired higher resolutions to create even finer detail graphics.

Unfortunately, just as we finally get retina grade resolution and could truly show realistic details, designers decided on a "fresh" look, and returned to the early 1990s era of computer graphic design.

1
  • 3
    Again, Skeuomorphism isn't the opposite of flat design. They can work in parallel. Early GUIs were were both flat (aesthetics) and skeumorphic (visuals and interaction)
    – DA01
    Commented Apr 1, 2014 at 17:10
0

I think that context is very important to answer this question. In a complex site that might be graphics heavy, flat design might not compete. The age group also makes a difference as well.

But which ever way you think is best, I don't think mixing them is advisable. In my experience, mixing them has lead to the flat designs being unable to compete for attention so they don't get as much play. We had to figure out why some buttons weren't getting pressed, even though we did everything right with layout and presentation. The only difference was they were flat by comparison to other buttons on the site.

0

Having read all the answers, I still do not see the question answered!

  • What are the usability studies confirming that users indeed find flat design better?

I have read lots of complaints by users actually hating it. And I can understand why. Specifically, people complaining how they hate ios7 and the fact that Apple made it impossible for them to switch back to ios6.

So people are not asked about what they prefer. No testing, no customer review, nothing! They are forced into the trend! By the industry monopolists who can get away with anything!

Then there are lots of articles by professional artists and designers pushing the trend with their own arguments why they like it. Sorry for a bad news, but if I am a user of the site, I am not interested why the designer liked it! I want it to be easy to use. And pleasant.

Here is an article claiming they did the study with "58.6% who “Love” iOS7 and 30.1% of people who “Hate it.”" Looks like a fair study, right? On the surface - yes. Until you read the comments!

Not the answer you're looking for? Browse other questions tagged or ask your own question.