I've got a problem with the way people are implementing this 'flat UI' style and I think it's leading to a disastrous usability nightmare!<p>Some of the 'design' concepts represented by drop shadows, borders, and text-shadows are about <i>function</i>, not (just) <i>aesthetics</i> and when you remove those functional parts of a layout you are left with a less <i>usable</i> layout.<p>Personally, I love the minimalism and rationalism in the design approach of Dieter Rams, who is (now) considered the father of the design style that Apple has made popular. I also love colour planar imagery (flat sections of colour) like vector illustrations and iconography.<p>The problem with how many people are implementing this flat style in UI is that we're letting go of valuable information that makes software and websites <i>usable</i> in the first place. This style works great for static pieces (like print, or screen graphics that don't change) and of course looks clean and gorgeous in non-functioning Photoshop mockups - but when you get this style onto websites and into apps it's often done in a way that just falls flat of its full potential.<p>There's my 2¢. I've been lusting after minimalism in design approach and dying for when colour planar aesthetic style became popular, but now it's here too many people are doing it all wrong (even the big ones, like Apple with iOS7)
The good thing about flat design is that people with terrible design skills like myself can now create sites using just rectangles and "background-color: blue;" and it will look modern.
Can someone explain what the point of this is?<p>I realize that it will have more or less dramatic effects depending on the site, but in the two examples that Adam Schwartz chose to best demonstrate the effect, it seems to be just "remove shading and gradients." Why? Is someone out there offended by gradients? Why would you care?<p>Edit: Or is that the point, that it's meant to be a commentary on a design aesthetic? afschwartz's own cryptic response in this comment page suggests that it might be.<p>If so, the commentary seems to have escaped some commentators--one comment on the original says "Github looks much nicer with it enabled." Huh? I had to look at the side-by-side GitHub comparison for several seconds before I even saw the difference.
“Whenever you find yourself on the side of the majority, it’s time to pause and reflect.”<p>-- Mark Twain<p>Flat design for flat design's sake is a signal that groupthink on this whole "flat" thing is beginning to reach ridiculous levels
A neat little toy - but to me flat doesn't just mean a certain color scheme - it also means having a certain elegance to site interactions and a design philosophy that trends closer to minimalistic. None of these sites meet that criteria IMHO.<p>And that's not a bad thing. Variety is the spice of life. Decisions on design shouldn't be made based on trends - they should be based on usability. Some site benefit from simple interfaces and some benefit from complexity.
There is a difference between flat and (more) usable. While I strongly question the necessity of shadows and gradients as a means to convey structure, they more often that not help convey functionality to the non-rational part of the user's brain. Particularly the github example comes to mind: it may be a blue circle, but only with a smooth blueish shadow does it convey the meaning of an LED that wants the user's attention.<p>A blanket removal of usually carefully designed interfaces comes close to art vandalism :) It might do good in some cases, but destroys the hard work put in many others.
I really hope this is a commentary on how "flat" design is just an aesthetic. You can make your UI horrible or non-horrible whether you employ "flat" design or not.
Useful tool. The interesting part is scanning the images and seeing where the flatness works and the "3D" effect was unnecessary, vs. the parts where the 3D really does work quite well.<p>For example, the Twitter "Home" button looks much better with the 3D effect, whereas the Github "Edit/Raw/Blame/..." buttons don't really seem to need it at all.
I think it's important for designers to remember the purpose of what people refer to as "flat" design isn't to unnecessarily flatten layouts, but rather to avoid unnecessarily adding skeuomorphism to them.