I wrote the tweets featured in the article and thought I'd chime in with a few more thoughts...
I think flat design is inclusive design, that is, it's not hoity-toity, impossible-to-execute, beautifully 3D-rendered and textured expensive design. It's simple and clean, sparse and understandable. In the most simple application of "flat design" trends, it's essentially one step up from a wireframe: pick a color scheme on some color scheme website, download a 200-pack of glyph icons and BAM you've moved from an abstract wireframe to something a little more sophisticated and approachable. Friendly colors, nice spacing, good typography, and you've got something.
Yes, I am saying it is quicker to execute a "flat" design than it is to execute a skeuomorphic, highly-stylized, deeply-textured design. A product manager or developer without a lot of design experience could probably use some flat design trends and one nice font and put something together that doesn't look like horse shit. I don't think that same product manager could spend an equal amount of time trying to mimic a beautifully-crafted and textured interface and have anywhere near the same luck. Using flat design trends gets you to some sort of product design quicker than if you're spending 20 minutes crafting a 5-color gradient to emulate the perfect lighting of a semi-glossy aluminum rod for your button texture.
No, I am not saying that by simply using "flat" design trends you are able to bypass all processes and thinking surrounding good whitespace, grouping, contrast, alignment, typography, usability, etc., but because "flat" design elements are graphically simpler it lets the content of the design show through and not be muddled by textures or skeuomorphic execution flaws, so your design message is clearer and cleaner by default.
Non-designers or "mediocre designers" seem to be flocking to these flat design trends the same way they flock to the excellent Bootstrap framework: because it's a simple way to jumpstart a product design out of a blank canvas or browser window into something that, even when starting out, looks pretty decent.
I suspect a lot of people will start to attribute bad designs to flat design because of its lower barrier to entry. There are likely to be a lot more people who are less than mediocre, in both visual and interaction design skills, applying it to poorly crafted and planned out sites and apps, and sadly the thing that will stand out the most is that they used a flat design, not that they simply designed poorly.
Your post is remarkably clear despite your inability to choose a typeface or set kerning. Using standardized symbols is the way we communicate.
Flat design is a dogma, but nearly so dependent upon revelation and faith. A five colored gradient emulating perfect lighting of a semi-glossy aluminum rod is carving saints into the tympanium - semiotics for the initiated and confirmation of one's devotion to sacred values. The word "perfect" gives the language game away.
What I appreciate about so-called flat design is that's low-key by nature, and by not calling attention to itself (no bezels, few gradients, border colors, etc.) it can - when used correctly - get out of the way and let the user focus on content. E.g. https://dispatch.io
An example of the opposite is so-called good design, where skilled designers set out to make a visual statement and, in the process, obfuscate the content. E.g. this site, where every article is more than half-buried by a ginormous image: http://www.fastcodesign.com
Since people who pay money for software overwhelmingly don't care about design quality (look at the most important systems they interact with every day --- VB.NET line-of-business applications, dumb terminal text interfaces, Powerschool --- to see why that is), anything that makes it simpler for application developers to get an app out the door without feeling like they have to wait until it's blessed by someone with an MFA is an unalloyed good thing.
I haven't played with flat design yet (my crutch for bad design is Bootstrap), but this is as compelling an argument for it as anything else I've read.
In the examples you list, the people who actually interact with the software aren't likely to be the ones who are making the purchasing decisions, though. My guess is that this is one of the main reasons why "enterprise" software UI is so bad.
So, there may not be a good argument for software developers to produce good design for these customers (awful design has gotten them this far, after all!) but it doesn't mean that design quality isn't still super-important in some other areas, too — namely those where the purchaser is actually the user.
What really happens when you have flat design is that you can't hide your mediocrity behind layers of eye candy.
Assume that you give both a carpenter craftsman and an amateur instructions to build a table. You only want solid blocks of wood, nothing fancy. Would you be able to tell them apart?
It's all in the fundamentals, I doubt a mediocre designer can develop a coherent visual system on flat design.
But, you do realise that you just proved the authors point right? Sure, you would obviously be able to tell the difference, but I'm pretty sure that the difference would be a lot smaller than if you had requested table with ornaments and wooden inlays.
OK, this is the perfect thread to write a rant about flat design that I'm keeping to myself since a while.
I hate (maybe hate is not the word, but I think you get it) all these webs/apps with this type of design (not every web, there are great designs out there), think about the last couple of years, we were struggling with javascript to make round corners, all these type of fancy effects, shadows, etc., and now, that we have the opportunity to deal with those things natively and make some GREAT graphic, full eye-candy webs, the trend is flat, simple colored divs... are you kidding me?
I think this article would have been better worded "Flat design is great for lazy designers like me."
This isn't exactly limited Flat UI, anytime you're grabbing set of premade content, be it Designmodo's flatui, Bootstrap, a word press theme, a JQuery plugin, you're outsourcing levels of your design.
You can leverage these in your favor. Sometimes this is the best choice and will enable you to focus on other aspects of the project or extend onto functionality without having to reinvent the wheel and other times you're a lazy designer.
Flat UI is just a rejection over-design, part of a cycle of design that loops. We'll edge back towards more over-design until we hit the reset button again.
Flat design allows a designer to focus on more of the important aspects of a design in early stages. Choosing the right shadow, gradient, texture, whatever is certainly NOT going to make or break your design. Jack Dorsey has said that the best products disappear to the user, and I couldn't agree more. It doesn't matter as much what a button looks like but more what it does and that the design of that button accurately conveys what that action will be. A good design (flat or not) will bring users in but it will not retain them on it's own; functionality is clearly what makes all great products thrive. Flat designs are inherently lighter and cleaner, which allows users to focus on functionality and user experience. So then, for a novice designer, why bother trying to make complicated skeuomorphic designs that can potentially distract users? (Anyone who has tested an early product with users will know what I mean by "distract" - all those times when a tester spends most their time giving you feedback on colors, font sizes, and layouts of a design instead of the overall utility of the product.)
The thought that always comes to my mind regarding this topic is how "delete" buttons are implemented. Often times a classic "trash can" icon is used to depict the delete action. But how often do you ever see an old aluminum trash can anymore? Not very often. Eventually this icon will make absolutely no sense to users (like an old proverb that your parents used to use). However, the word "delete" will likely be around for a lot longer. Using that little trash can icon might save space and help to improve the overall aesthetic of your site/app, but it will never be as clear as a big red "delete" button.
I think the ramifications might be slightly deeper than that; it allows you to see if you really will get traction behind your MVP before you bust your balls over the UI, without having your site look like Craigslist.
HackerNews is the perfect example; very simple, flat, but doesn't get in the way, and allows you to use the site in a very functional way. You can add the flashy design intricacy later if you want, but I hope that most people won't. I love the simplicity.
<rant>
I thought programming community is so bad for being trend-chasing, UI designing is even worse, which is basically a fashion industry. Come on, why does everything has to be flat, it's not the DOS era in 80's, you have access to gigabytes of video memory and extremely powerful graphics cards.
Can't stand the group-thinking of designers. Where is your creativity?
</rant>
I think it's worth noting that "flat design" isn't just design that's flat, or a trend toward simplification, it's a very specific design aesthetic featuring a certain palette of muted primary and secondary colors, use of color rather than depth or texture to differentiate functions, wide, open sans-serif typefaces, large areas of color with a lot of "white space" around the text, chunky icons, and a set of design patterns that work well with that style.
In fact, graphic design has been more or less flat for its entire existence up until the Xerox Star.
I'm happy to see this article calling it out for what it is: a crutch. Good design is still 90% typography and flat vs. skeuomorphic is a pointless argument of taste perpetuated by people who don't know their design history.
Simple is hard. If someone can't tell the difference between a beautifully rendered minimalistic design and something generic that just happens to lack eye-candy effects, that doesn't lead to the conclusion that flat is easier to accomplish; it just means that person can't tell the difference between good design and bad design. A trained eye will pay attention to proportion, balance, color relationship, (a)symmetry, etc.
From Bauhaus to Braun, Frank Lloyd Wright to I.M. Pei, architects, artists, graphic designers and engineers have been studying and applying these concepts. Lost on many, but still perfectly valid.
Flat design is the wood-paneled car of the design world.
Design goes through trends. In 10 years, I don't know what websites will look like, but I doubt flat will be it.
Flat design is bad because it gives up visual cues that convey information in return for conformance to a monotonous style. Sure, it is simple to design in, but trading off visual cues is user-unfriendly, and the future is in more user-friendliness. Style does matter. Flat sites offer a limited design space to explore before they seem repetitive.
"Flat design is bad because it gives up visual cues that convey information in return for conformance to a monotonous style."
So make a flat design that doesn't give up these visual cues? All these complaints are just farts in the wind, and I only single your post out because it was pithy. Not only is the term "flat design" horrendously vague and difficult to pin down, but the very idea that there is some kind of absolute scale by which to judge design–clearly implicit in your judgement–should raise a few eyebrows.
Ultimately what matters is communicating to the user how to interact with the product in question. Everything else is marketing and will be subject to trends. But you could make a delightful and useful skeuomorphic interface or a delightful and useful flat interface or any one of a million variations on those spectrums and many others.
Not sure I agree with your analogy, though I agree with the gist.
I'd say flat design is like Ikea furniture - functional, sparse, nothing ornate, relying on basic colors and shape for differentiation. Very mix-and-match.
I agree with the author - flat design is like having a good UI framework that's widely used (say Microsoft's WFC in the 90's and iOS in late '00s) - low barrier to entry, and the differentiators can be applied once a core success is won. The platform will re-invent, or a new platform will show up, and your UI will look stale after a while, but you do get a couple of years to worry about functionality first.
I'll take flat design over liquid buttons and shoddy, poorly thought-out skeuomorphism any day. You may hate it, but it's going to be ubiquitous for a while.
Bad designer here. The style of UI components doesn't make me a better designer. I'm a bad designer because I don't know what to put on a page. I don't know where things should go. I can do a sales/information page because there are a thousand of those out there to copy off of. But when I do something remotely original I'm at a loss. Rounded vs. square corners doesn't factor into this at all.
Mediocre designer here. Yes I had to use Bootstrap and glyph icons because my 2-man workshop has to publish software. We use flat design of course, since we really don't know what else is suitable. Any designers care to point out a path that we can make ourselves go past the stage of following what's easy and trendy? Some books to recommend or online courses would be great.
Forrst is continually talking about all this stuff:
http://forrst.com
I'm an iOS dev, and I hang out there to get better at design. I'm often in a better place to effect change, and it's always nice to know how to help a designer fix one or two things specific to mobile they may not know.
"What I lack for design skills, I make up for in being good at organizing information" - You
You just described the purpose of flat design. The point is for the information to stand out more than the style of the elements. It's substance over style.
Some people (bad designers) take it to an extreme and make everything square and you can't distinguish what's clickable. Some people (bad designers) took skeumorphism to an extreme and arranged information incorrectly, gave everything a leather texture. Some people (bad designers) took web 2.0 / Social to an extreme and put 20 freaken social widgets on every page, neon backgrounds, and glass like shiney buttons on everything.
A design style should not be defined by the worse executors of that style. (same goes for plastic surgery)
Yet picking the right colors still seems to be a big challenge for some people. I have seen application use combination of highly saturated red, brown and green.
[+] [-] flyosity|13 years ago|reply
I think flat design is inclusive design, that is, it's not hoity-toity, impossible-to-execute, beautifully 3D-rendered and textured expensive design. It's simple and clean, sparse and understandable. In the most simple application of "flat design" trends, it's essentially one step up from a wireframe: pick a color scheme on some color scheme website, download a 200-pack of glyph icons and BAM you've moved from an abstract wireframe to something a little more sophisticated and approachable. Friendly colors, nice spacing, good typography, and you've got something.
Yes, I am saying it is quicker to execute a "flat" design than it is to execute a skeuomorphic, highly-stylized, deeply-textured design. A product manager or developer without a lot of design experience could probably use some flat design trends and one nice font and put something together that doesn't look like horse shit. I don't think that same product manager could spend an equal amount of time trying to mimic a beautifully-crafted and textured interface and have anywhere near the same luck. Using flat design trends gets you to some sort of product design quicker than if you're spending 20 minutes crafting a 5-color gradient to emulate the perfect lighting of a semi-glossy aluminum rod for your button texture.
No, I am not saying that by simply using "flat" design trends you are able to bypass all processes and thinking surrounding good whitespace, grouping, contrast, alignment, typography, usability, etc., but because "flat" design elements are graphically simpler it lets the content of the design show through and not be muddled by textures or skeuomorphic execution flaws, so your design message is clearer and cleaner by default.
Non-designers or "mediocre designers" seem to be flocking to these flat design trends the same way they flock to the excellent Bootstrap framework: because it's a simple way to jumpstart a product design out of a blank canvas or browser window into something that, even when starting out, looks pretty decent.
[+] [-] lucisferre|13 years ago|reply
[+] [-] brudgers|13 years ago|reply
Flat design is a dogma, but nearly so dependent upon revelation and faith. A five colored gradient emulating perfect lighting of a semi-glossy aluminum rod is carving saints into the tympanium - semiotics for the initiated and confirmation of one's devotion to sacred values. The word "perfect" gives the language game away.
[+] [-] subpixel|13 years ago|reply
An example of the opposite is so-called good design, where skilled designers set out to make a visual statement and, in the process, obfuscate the content. E.g. this site, where every article is more than half-buried by a ginormous image: http://www.fastcodesign.com
[+] [-] tptacek|13 years ago|reply
I haven't played with flat design yet (my crutch for bad design is Bootstrap), but this is as compelling an argument for it as anything else I've read.
[+] [-] glhaynes|13 years ago|reply
So, there may not be a good argument for software developers to produce good design for these customers (awful design has gotten them this far, after all!) but it doesn't mean that design quality isn't still super-important in some other areas, too — namely those where the purchaser is actually the user.
[+] [-] ethnt|13 years ago|reply
Though, I will admit, it looks pretty horrid.
[+] [-] duopixel|13 years ago|reply
Assume that you give both a carpenter craftsman and an amateur instructions to build a table. You only want solid blocks of wood, nothing fancy. Would you be able to tell them apart?
It's all in the fundamentals, I doubt a mediocre designer can develop a coherent visual system on flat design.
[+] [-] arvidjanson|13 years ago|reply
[+] [-] AbraKdabra|13 years ago|reply
I hate (maybe hate is not the word, but I think you get it) all these webs/apps with this type of design (not every web, there are great designs out there), think about the last couple of years, we were struggling with javascript to make round corners, all these type of fancy effects, shadows, etc., and now, that we have the opportunity to deal with those things natively and make some GREAT graphic, full eye-candy webs, the trend is flat, simple colored divs... are you kidding me?
</rant>
Thanks.
[+] [-] qu4z-2|13 years ago|reply
Also, I don't think flat design precludes rounded corners?
[+] [-] fuzzywalrus|13 years ago|reply
This isn't exactly limited Flat UI, anytime you're grabbing set of premade content, be it Designmodo's flatui, Bootstrap, a word press theme, a JQuery plugin, you're outsourcing levels of your design.
You can leverage these in your favor. Sometimes this is the best choice and will enable you to focus on other aspects of the project or extend onto functionality without having to reinvent the wheel and other times you're a lazy designer.
Flat UI is just a rejection over-design, part of a cycle of design that loops. We'll edge back towards more over-design until we hit the reset button again.
[+] [-] dredmorbius|13 years ago|reply
[+] [-] mkandler|13 years ago|reply
The thought that always comes to my mind regarding this topic is how "delete" buttons are implemented. Often times a classic "trash can" icon is used to depict the delete action. But how often do you ever see an old aluminum trash can anymore? Not very often. Eventually this icon will make absolutely no sense to users (like an old proverb that your parents used to use). However, the word "delete" will likely be around for a lot longer. Using that little trash can icon might save space and help to improve the overall aesthetic of your site/app, but it will never be as clear as a big red "delete" button.
[+] [-] austenallred|13 years ago|reply
HackerNews is the perfect example; very simple, flat, but doesn't get in the way, and allows you to use the site in a very functional way. You can add the flashy design intricacy later if you want, but I hope that most people won't. I love the simplicity.
[+] [-] cygwin98|13 years ago|reply
Can't stand the group-thinking of designers. Where is your creativity? </rant>
[+] [-] miguelrochefort|13 years ago|reply
[+] [-] camus|13 years ago|reply
[+] [-] msutherl|13 years ago|reply
In fact, graphic design has been more or less flat for its entire existence up until the Xerox Star.
I'm happy to see this article calling it out for what it is: a crutch. Good design is still 90% typography and flat vs. skeuomorphic is a pointless argument of taste perpetuated by people who don't know their design history.
[+] [-] gdubs|13 years ago|reply
From Bauhaus to Braun, Frank Lloyd Wright to I.M. Pei, architects, artists, graphic designers and engineers have been studying and applying these concepts. Lost on many, but still perfectly valid.
[+] [-] ericb|13 years ago|reply
Flat design is bad because it gives up visual cues that convey information in return for conformance to a monotonous style. Sure, it is simple to design in, but trading off visual cues is user-unfriendly, and the future is in more user-friendliness. Style does matter. Flat sites offer a limited design space to explore before they seem repetitive.
[+] [-] KirinDave|13 years ago|reply
So make a flat design that doesn't give up these visual cues? All these complaints are just farts in the wind, and I only single your post out because it was pithy. Not only is the term "flat design" horrendously vague and difficult to pin down, but the very idea that there is some kind of absolute scale by which to judge design–clearly implicit in your judgement–should raise a few eyebrows.
Ultimately what matters is communicating to the user how to interact with the product in question. Everything else is marketing and will be subject to trends. But you could make a delightful and useful skeuomorphic interface or a delightful and useful flat interface or any one of a million variations on those spectrums and many others.
[+] [-] r00fus|13 years ago|reply
I'd say flat design is like Ikea furniture - functional, sparse, nothing ornate, relying on basic colors and shape for differentiation. Very mix-and-match.
I agree with the author - flat design is like having a good UI framework that's widely used (say Microsoft's WFC in the 90's and iOS in late '00s) - low barrier to entry, and the differentiators can be applied once a core success is won. The platform will re-invent, or a new platform will show up, and your UI will look stale after a while, but you do get a couple of years to worry about functionality first.
[+] [-] dgabriel|13 years ago|reply
[+] [-] MatthewPhillips|13 years ago|reply
[+] [-] angkec|13 years ago|reply
[+] [-] dokuda|13 years ago|reply
They have collections of resources and articles curated by web designers and front-end developers focusing on user interfaces and design theories.
These aren't tutorials, but materials for you to read, learn, and apply to your designs and interfaces.
[+] [-] gte910h|13 years ago|reply
I'm an iOS dev, and I hang out there to get better at design. I'm often in a better place to effect change, and it's always nice to know how to help a designer fix one or two things specific to mobile they may not know.
[+] [-] notdan|13 years ago|reply
[+] [-] ChrisNorstrom|13 years ago|reply
You just described the purpose of flat design. The point is for the information to stand out more than the style of the elements. It's substance over style.
Some people (bad designers) take it to an extreme and make everything square and you can't distinguish what's clickable. Some people (bad designers) took skeumorphism to an extreme and arranged information incorrectly, gave everything a leather texture. Some people (bad designers) took web 2.0 / Social to an extreme and put 20 freaken social widgets on every page, neon backgrounds, and glass like shiney buttons on everything.
A design style should not be defined by the worse executors of that style. (same goes for plastic surgery)
[+] [-] qompiler|13 years ago|reply
[+] [-] asperion|13 years ago|reply
[+] [-] stevenkovar|13 years ago|reply
Style is an expression placed over the solution for the sake of identity and brand equity.
Many designers seem to chase a style before truly understanding the problem—let alone the solution to that problem.
[+] [-] dredmorbius|13 years ago|reply
http://xawm.sourceforge.net/XawM.gif
[+] [-] commieneko|13 years ago|reply