Join 3,417 readers in helping fund MetaFilter (Hide)

Tags:

Let's Get Flat
September 30, 2012 5:45 PM   Subscribe

The Flat Design Era: Forget Apple and its lickable design. Let's get flat. via Sexpigeon
posted by dame (44 comments total) 17 users marked this as a favorite

 
I love you for this. More soon after I digest these.
posted by Senor Cardgage at 5:51 PM on September 30, 2012


I find the more and more designers go on about skeuomorphism and its remedies, the less and less I care about it or them. Not that this isn't a perfectly reasonable article, it's just that it seems I'd rather be a victim of bad design than summon up the energy to resist it.

I am plainly the reason for bad design.
posted by howfar at 5:52 PM on September 30, 2012 [5 favorites]


Word 2010 vs Word 2013.

Which do you find easier to read?
posted by Egg Shen at 5:59 PM on September 30, 2012


So, is this an ad posing as a design manifesto?
posted by dumbland at 6:04 PM on September 30, 2012 [10 favorites]


I find 2013 easier to read and 2010 more aesthetically pleasing, though neither by any leaps and bounds, to be sure. I can see why people would choose either one over the other. To me the answer is options.
posted by Navelgazer at 6:04 PM on September 30, 2012


(sorry, to clarify: the post linked to, not this FPP)
posted by dumbland at 6:05 PM on September 30, 2012


Between Word 2010 and Word 2013, I had to choose Emacs, possibly with TeX.
posted by DU at 6:07 PM on September 30, 2012 [17 favorites]


We interpret recent shots taken at skeumorphism as a sign of the coming of “Honest Design.â€

Kinda undermining your message there.
posted by Horace Rumpole at 6:11 PM on September 30, 2012 [3 favorites]


I disagree, howfar - not being overly smitten with or offended by design trends as they age is the sign of a sophistication that is the product of actual experience, rather than simple zeitgeist & design inspiration blogs.

If they like flat so much they should be reading Clement Greenberg via the Painted Word...

That said, I've never been a fan skamorph--skamorph--skamorph--skamorph-- errrrr .... The apple iPad app aesthetic where a digital tool is designed to look like its own historical antecedent, rather than have an interface on its own terms.
posted by illovich at 6:12 PM on September 30, 2012 [2 favorites]


Or we could just employ flat and lickable according to each projects needs, tone and personality and not be such self-absorbed design dorks.
posted by Senor Cardgage at 6:16 PM on September 30, 2012 [6 favorites]


I was only vaguely displeased with the skeuomorphism approach until the Lion iCal thing. Now I just hate it! I mean, stitching? So stupid and ugly.
posted by theredpen at 6:17 PM on September 30, 2012 [2 favorites]


Well, your color scheme made resort to my "Black Verdana on white background" bookmarklet, so I don't really feel compelled to read your much further.
posted by benito.strauss at 6:17 PM on September 30, 2012


lickable design

You can scroll your smart phone by licking it, could be a pretty fun adult game.
posted by Confess, Fletch at 6:18 PM on September 30, 2012 [2 favorites]


and not be such self-absorbed design dorks

But where's the fun in that?
posted by dame at 6:20 PM on September 30, 2012 [1 favorite]


So flat design is... without unneeded embellishment? I read that whole thing and Googled but remain unclear.
posted by c'mon sea legs at 6:20 PM on September 30, 2012


Also, if the first link is making you feel grumpy, I highly recommend the via.
posted by dame at 6:22 PM on September 30, 2012


does it make me old when I can't even pay attention to the flatness of Office 2013 because the ALL CAPS menus are just screaming out how ugly they are? are kids today ok with all caps? it's weird to say but it's a deal breaker for me.
posted by sineater at 6:23 PM on September 30, 2012 [8 favorites]


"lickable design"

The snozzberries taste like snozzberries.
posted by mr_crash_davis at 6:27 PM on September 30, 2012 [9 favorites]


So I read this whole screed on the evils of skeumorphism and lazy design, then click the layervault.com link and am greeted by a realistically-drawn logo of a safe behind a painting, on what appears to be a copy of Bootstrap's site. The fuck?
posted by swift at 6:37 PM on September 30, 2012 [3 favorites]


All of these people use iPhones, and so appear to have either overlooked or deliberately omitted the influence of both Android (particularly the Holo theme) and Metro on the popularization of flatness.

Although, lets be honest, they're all really cribbing from LCARS.
posted by xthlc at 6:40 PM on September 30, 2012 [5 favorites]


Or we could just employ flat and lickable according to each projects needs, tone and personality and not be such self-absorbed design dorks.

Most designers think of themselves as educated and knowledgeable professionals, but non-designers will often see them as merely a guy/gal with an opinion and software know-how. This mismatch of perspectives really hurts the industry.
posted by quosimosaur at 6:44 PM on September 30, 2012 [4 favorites]


The fact that skeuomorphism is commonly misunderstood to mean "uses a physical metaphor" is a result, in some sense, of a successfully-executed skeuomorphism. But man, that watching that snake belch and ask for a glass of water so it can finish up this delightful meal of its own tail has been pretty miserable.

Every now and then I see somebody put up a slide of a hammer, emphasizing the point that _this_ end fits the human, and _this_ end fits the job, and they're very different and whatever. It's adorable. But I always want to reply with a picture of a Halligan Bar. It has sharp edges and pointy bits in places you wouldn't expect, it's heavier than it needs to be, and it is used religiously by people who rely on it to work every single time in extraordinarily dangerous situations. And it's not obvious, from the look of it, which end fits the human. It's all about the job, and the human has to know how to deal with that.

Which is all to say, "looks like something I see everyday" is a nice idea, and has a great learning curve, but those probably aren't the tools you want to use for serious work.
posted by mhoye at 6:48 PM on September 30, 2012 [7 favorites]


So flat design is... without unneeded embellishment? I read that whole thing and Googled but remain unclear.

I'm also confused. Can someone clarify what they mean? Are they saying that physical metaphors are not the way to go?
posted by spiderskull at 6:52 PM on September 30, 2012 [1 favorite]


They're around 3 years behind the times in terms of Mac. On the other hand, iOS is around 4 years behind Mac OS X. It's a matter of seeing which way the wind blows rather than a design revolution. When Apple does bother to update its visual vocabulary, they'll get to act all vindicated.

And good christ Office 2013 is dreadful. They were actually making some progress on the usability front with Sharepoint 2011, too. Big, giant step back, but hey, minimalism! (Tho a tool ribbin with 45 different elements isn't exactly minimalist. Maybe "flat design" means some things are clickable, some not, with no clear demarcation between the two because that would interrupt the "clean look" of the 52 separate icons and labels in Word 2013.)
posted by Slap*Happy at 6:53 PM on September 30, 2012


Egg Shen: "Word 2010 vs Word 2013.

Which do you find easier to read?
"

Wow, the 2013 is so much easier on my eyes.
posted by octothorpe at 7:00 PM on September 30, 2012 [1 favorite]


Tho a tool ribbin with 45 different elements isn't exactly minimalist.

I saw a talk from a guy at Microsoft about this, soon after 2010 came out; that ribbon was not adopted lightly, and those decisions were made as a result of the feedback they got from hundreds of thousands of deeply instrumented copies Office and user feedback sessions.

One of the things this guy pointed out was that there were some features in Office that were simply never, ever used. Somebody thought they were important enough to develop and support, from one version to the next, but when it come to actually seeing if anyone had _ever_ touched them, the answer turned out to be, nobody ever had. But the other thing that was way more interesting was this: of the top ten new-feature requests for Office, six of them _were already features in Office_, and maybe more importantly, had been included in Office for more than one prior version.

That is to say: what people wanted most from Office was already there, and they couldn't find it.

The Ribbon UI was the result of that. It was a very deliberate, very scientific and data-driven attempt to put the features people wanted most right there at eye level where people could find them, and in my opinion it's a net improvement. You've got to fight an awful lot of muscle memory to find that out, though, and I'm sure that's what's hurt them during that transition.
posted by mhoye at 7:10 PM on September 30, 2012 [13 favorites]


Word 2010 vs Word 2013.

Which do you find easier to read?
posted by Egg Shen


Who uses Word for reading?
posted by benito.strauss at 7:11 PM on September 30, 2012 [2 favorites]


Odd how, although Apple has been using skeuomorphism ever since OS X debuted, it only became a commonly bandied-about term (and put in the context of being a real problem) when Microsoft started to flog Metro not only as a desirably mobile OS alternative, but as the One True Interface which needs to be on everything.

mhoye, I have in fact looked at a picture of a Halligan bar, and it seems perfectly intuitive where it needs to be held--the middle. But your citing of a specialist tool to make a point about general-purpose computing leads me to remind you that, twenty-eight years ago, Apple's original ad tagline for the Mac was "the computer for the rest of us", that is, the people who weren't hobbyists or that one person in the office who likes knowing the obscure functions of machines because it makes them feel needed and important. I think that the Mac went a little too far in removing the command line completely--OS X was a huge improvement in that area--and skeuomorphisms has its excesses, as with the faux-leather garnishes of iCal, but Metro doesn't seem to be a step in the right direction at all.
posted by Halloween Jack at 7:11 PM on September 30, 2012 [1 favorite]


Forget about Apple? The first image on that screen gave me a System 6 flashback!
posted by The Hyacinth Girl at 7:53 PM on September 30, 2012 [1 favorite]


The desk at LayerVault’s original headquarters (my Manhattan apartment) still has the battle scars from objects being slammed down in anger. At one point, while working on a mockup, a MacBook was slammed shut so hard it was nearly unhinged.

How embarrassing for them.
posted by roger ackroyd at 7:54 PM on September 30, 2012 [1 favorite]


So flat design is... without unneeded embellishment? I read that whole thing and Googled but remain unclear.

I'm also confused. Can someone clarify what they mean? Are they saying that physical metaphors are not the way to go?


In this case, flat design is doing away with the drop shadows and gradients and other design tools to make the digital (and inherently 2-D) look "analog" and 3-D. It is buttons that pop out vs. flat buttons, for instance. Gmail would be a good example of a "flatter" design. So in fact there can be seen to be a continuum of flat > lickable > highly skeumorphic that would go something like Gmail compose button > these buttons > effin iCal with its leather and stitching and things!

As the OP, I must say I am sympathetic to the LayerVault point of view, but even more to the Senor Cardage (and general designer) approach of "the best design for thing being designed, given its users and point of view, etc. etc." Most good designers would be. Sometimes physical references are useful — especially when something is new and reference to the old helps knowledge transfer. Sometimes it is done for looks and doesn't even work right and is annoying — for instance the way pages don't pile up on the left / decrease on the right in Address Book to show how far you are along but just stay a static pile no matter what. That is aping the physical without even the useful communication part.

Mostly, I think this is an interesting time to flesh out these questions and I feel lucky to be a part of the design community and have some tiny effect in my projects by making the decisions I think are best.
posted by dame at 8:07 PM on September 30, 2012 [2 favorites]


So.. Does this mean Android is ahead of the curve vs. 1 infinite loop? ;)
posted by xcasex at 8:09 PM on September 30, 2012


I saw a talk from a guy at Microsoft about this, soon after 2010 came out; that ribbon was not adopted lightly, and those decisions were made as a result of the feedback they got from hundreds of thousands of deeply instrumented copies Office and user feedback sessions.

Umm. I was not exaggerating when I said there were 45 different items in the ribbon, and 52 items in the window, NOT including the ruler, cotent being worked on or cursor. Actually, I didn't count the down-arrows or (what I assume are) tear-off menu icons. So 50 and 57.

The problem is obvious from the start - they instrumented copies of Office. They took people's quick fixes, workarounds and taught-by-rote methods, and tried to learn something from it apart from "Back off and nuke it from orbit."

Even so, the ribbon is, in and of itself, not the problem. GUI widget overload is the problem. Inconsistent GUI widget design is the problem. Lazy mistakes in display and scaling of GUI widgets is the problem.

Sharepoint 2011, the last product I had to deal with Microsoft professionally, did a passable job of managing the ribbon, once you got past a few counterintuitive quirks. It's design was clean and crisp and consistent, very professional, and you never had to guess what was a static label and what was a clickable GUI bit.

TesxtWrangler is an intensely complex application that has an interface that is designed to allow you to navigate its features with swift aplomb if you're an expert, and with slow and comforting progressive disclosure if you're a newb. It's the antithesis of Word 2013 - substance over style.
posted by Slap*Happy at 9:07 PM on September 30, 2012


I'm going to get ahead of the curve and resurrect the principles of Rococo for UI design. Everything old is new again!
posted by moonbiter at 10:02 PM on September 30, 2012 [3 favorites]


Pass the tissues, please. LayerVault jacked some wank on my screen.
posted by five fresh fish at 11:00 PM on September 30, 2012


Design manifestos need a lot of images. Anyone can rationalize their design decisions. Show me something! And show me some usability data, too.
posted by victory_laser at 11:31 PM on September 30, 2012 [1 favorite]


I kind of liked the thing where bumps and textures showed things you could interact with and flat meant decoration. Unfortunately the requirements of fashion mean designers have to veer wildly between everything being flat and everything being textured, to show how cool they are by rejecting the last fashion.
posted by TheophileEscargot at 12:32 AM on October 1, 2012 [1 favorite]


I was trying to think of what my favourite design of UI is, but it's tricky. I think that if it's doing its job brilliantly, you don't notice it. Metro fails at this, but that might just be a case of giving it time to sink in. Perhaps it will be the same with Layervault. iCal on OS X Lion and the Podcasting app on iOS are examples of where Apple gets it wrong.

I like minimal designs, but that's often due to the scope of the app rather than a UI design decision as such. Instapaper or Byword are clean and simple, with nice fonts, but they're not trying to do what Word needs to do.
posted by milkb0at at 2:35 AM on October 1, 2012


This post really lacks content. - This is not revolutionary. One of the first programs I noticed that took on this Flat / Non-Gradient aesthetic was Ableton Live. and it came out in 2001 - So to me this post is really 10 years after the cutting edge.

Is that really all they have to say? "Flat Design is cool". still...
posted by mary8nne at 3:17 AM on October 1, 2012


People like to take a stand.
posted by itstheclamsname at 3:20 AM on October 1, 2012


and it came out in 2001
For that matter, wouldn't you consider MetaFilter to have a pretty flat design? And it came out in 1999.
posted by beagle at 7:31 AM on October 1, 2012 [1 favorite]


The problem is obvious from the start - they instrumented copies of Office. They took people's quick fixes, workarounds and taught-by-rote methods, and tried to learn something from it apart from "Back off and nuke it from orbit."

The other thing that he mentioned is that the ribbon design is the result of many thousands of hours of experimental design rigorous usability testing. "Nuke it from orbit" sounds nice, but it's a stupid, suicidal business decision.

You may not think it's inspired or pretty, but the facts remain that it's one of, and likely the, most rigorously tested user interface design in the computer industry.
posted by mhoye at 12:11 PM on October 1, 2012


You may not think it's inspired or pretty, but the facts remain that it's one of, and likely the, most rigorously tested user interface design in the computer industry.

It's also an overdesigned failure. Something was patently, clearly wrong with their methodology.

Take a survey, as formal or informal as you like, from IT helpdesks the world over: Does Microsoft's new UI make less experienced users more comfortable with using the product? Do power users use more of the available features with less effort?

As someone who had to provide end-user support as well as do power-user work with a be-ribboned UI - Sharepoint - the answer was, sadly, no. The ribbon did not aid in progressive disclosure, and instead confused new users as to where they were and how they got there. The ribbon did not aid in "muscle memory" because it's modal, and constantly switching modes at or near the top level of the interface in and of itself delays common operations, ticking off the power users.

You can swear up and down that the data shows that mode-switching isn't a big deal, but it's one of the founding tenets of the Mac's UI design - use sparingly, if at all. Modality is good, so long as the computer works with you and not against you... this isn't what's happening with the ribbon. It's just a way for users to get lost, and did nothing to address Icon Overload.

Microsoft does a fantastic job of inventing new features and capabilities - but it usually requires paid professionals to introduce them into an organization's workflow, as the interface is terrible.
posted by Slap*Happy at 1:12 PM on October 1, 2012


Dunno. Being using a Droid/Holo inspired theme I have hacked together on my *nix netbook and am pretty happy with it overall. Will prolly do it to my desktop once I decide to ditch my current distro.
posted by Samizdata at 1:30 PM on October 1, 2012


« Older The World Waterfall Database seeks to become "a co...  |  Well isn't this just super coo... Newer »


This thread has been archived and is closed to new comments