7 ms·

Authentic Design

107 points by porker 13y ago

SmeelBe 13y ago
Perfect explanation, good was mentioned Flat UI by designmodo in this article http://designmodo.com/flat-free/ http://designmodo.com/flat-free/.
pbowyer 13y ago
Interesting essay. I would come back on two points: The modernist style of which the author is so fond has been softened since; it was too harsh an aesthetic to appeal to many people (outside the design world, where it is still very popular) Flat UI design doesn't strip back to functionality; it's another aesthetic trend like skeumorphism.
- return0 13y ago
  Indeed, flatness is not even functional in many ways. Our vision is designed to recognize shadows and bevels instantly as indicators of depth, which can make many "skeuomorphic" designs easier to work with compared to their flat equivalents.
- lmm 13y ago
  I consider myself a modernist, but I was surprised to find I preferred the Harrods frontage to the modernist building in the picture below it.
  - pbowyer 13y ago
    Me too. In interior decor, I always thought I liked it clean and modern, but the more I look around I realise I like it comfortable and homely. Not Laura Ashley or shabby chic, but not stark and unfriendly either. Not white walls and chrome. Even in an office, I like colour and warmth. Clean lines, light and airy, colour and not too much over-ornate art... there has to be a name for this design movement.
    - icebraining 13y ago
      Have you seen postmodernism? It seems to fit more or less with that, at least to my layman eye.
  - brudgers 13y ago
    The Harrods building has a well proportioned facade. One could say it has good bones. It is only the idiom which organizes its ornament which has fallen out of fashion. None of this should surprise us. Typologically, it is a modern building. There are not 18th Century department stores. The building has elevators and escalators. The comparison to Sullivan's building is silly. The sites are differently constrained. Harrods low profile fits its context outside the urban core. Carson Piere Scott is sitting in Chicago's Loop; it is downtown where land is expensive. Hence it's greater overall height and lower story to story height. But even more relevant is that Sullivan's architecture is a series of additions and renovations. The building was not birthed fully formed, but is several projects joined together as additional land was available. Part of his job was to tie these pieces together, and that's what its facade reflects.
digitalengineer 13y ago
Is it just another skin or more? Judge for yourself: A list of screenshots of iOS7 redesign vs the 'old' design: http://ios7redesigns.tumblr.com/ http://ios7redesigns.tumblr.com/
- sp332 13y ago
  I'd like to think not, but I'm not sure how a series of static screenshots could show anything other than "skin" differences.
  - digitalengineer 13y ago
    For a large part it is just that; same composition, same 'buttons', same place, but in a new design. You do raise a good point though: I feel the App Store could do with short video's instead of screenshots. Like they do on their own iOS7 page: http://www.apple.com/ios/ios7/#videos http://www.apple.com/ios/ios7/#videos
panacea 13y ago
UI design has always been about abstracting away underlying complexity and presenting a virtual wizard to manipulate the underlying code. Would it not be more 'digitally authentic' to present 1's and 0's? 'Flat design' is as much an arbitrary aesthetic as 'decorative design', and whilst I agree it's very pleasing and a sight for overloaded eyes, it's most certainly a trend and not an objective improvement on interfaces usability design.
- brudgers 13y ago
  To the degree a flat design idiom such as Metro [or whatever it's called] begins to admit text and favor it over icons, a reasoned argument can be made that they are objectively better. It is not just that the pictographic language of icons -, folders, floppy disks, file cabinets, trashcans, glue bottles, scissors, clipboards etc. - is drawn from a context largely irrelevant to large segments computer use today such mobile devices, educational contexts and home uses. Nor is it that elements such as the floppy disk are twenty years obsolescent. The problem with the pictographic language rooted in skeuomorphism is that it lacks a grammar. It has no rules of combination. There is no icon for copy and paste - let alone one for copy from context a and paste in context b. It is not entirely an accident that alphabets have been replacing pictograms for three millennia. They are more flexible. Likewise, the iconography of industrial buttons is rapidly disappearing both as a relevant context from the workplace, and as a human interface. Industrial interfaces are increasingly a screen and a keyboard [a keyboard is our industrial interface to an alphabet]. What is the most useful feature of the iOS interface? It would be hard to argue for anything other than the touch keyboard. It has two important features. Each icon represents a symbol rather than an action. Those symbols have rules of combination which allow the expression of complex abstractions. Your roommate can text "Scrunchie on door." They don't need to download "The Let Someone Know You're Getting Laid App" from the app store. Neither do you. The icon and skeuomorphism will continue to lose ground simply because they are too brittle for general purpose computing. There will be specialized contexts where they persist - just as pictograms are a useful way to describe the way the Grants Mill Road winds over the hill. The sign before two successive turns shows two successive turns. Today, we are in a future where Grants Mill Road has been straitened as it heads down toward the bridge, but some interface designer has not only retained the sign but had it painted to simulate a brushed aluminum finish and shading to simulate an embossed surface illuminated from the upper right. Most skeuomorphism is cutting two inches off the potroast. http://mikeschinkel.com/blog/conventionalwisdomassumptionsandpotroast/ http://mikeschinkel.com/blog/conventionalwisdomassumptionsan...
zeckalpha 13y ago
Isn't the calculator example still skeumorphic?
- hcarvalhoalves 13y ago
  > A skeuomorph /ˈskjuːəmɔrf/ is a derivative object that retains ornamental design cues to a structure that were necessary in the original. You can say that it isn't, because they departed with the aesthetic elements intended to make it look true-to-life like reflections and bevels; or that it is, because it still retains the placements and interacts like the physical calculator.
  - zeckalpha 13y ago
    For a while there, it seemed like people had reached the consensus that flat vs. skeumorphic is a false dichotomy. After iOS 7 was unveiled, all of a sudden they are opposed again.
Kerrick 13y ago
If you enjoyed this article, you'd probably also enjoy Material Honesty on the Web [1], by Kevin Goldman on A List Apart. [1]: http://alistapart.com/article/material-honesty-on-the-web http://alistapart.com/article/material-honesty-on-the-web
- PavlovsCat 13y ago
  same author as the OP, and one of the best things I ever saw posted on HN: http://fadeyev.net/2012/06/19/moral-design/ http://fadeyev.net/2012/06/19/moral-design/
stevenkovar 13y ago
Design solves problems. That's it. Projecting these terms and trends only serves to handicap those who choose to emulate over develop a grasp on the fundamentals of problem solving.
- huffman 13y ago
  "solves problems" encompasses a vast space of decision making, some of which is arbitrary and stylistic. "That's it" is oversimplifying things. "In Holland, we have two words for design. One is vormgeving; in German formgeben. And the other word is ontwerpen; in German entwurf. In the Anglo-Saxon language there's only one word for design, which is design. That is something you should work out. Vormgeving is more to make things look nice. So for instance, packaging for a perfume or for chocolate in order to make things fashionable, obsolete and therefore bad for society because we don't really need it. While ontwerpe means, and the Anglo-saxon word, but its stronger, means engineering. That means you as a person try to invent a new thing—which is intelligent, which is clever, and which will have a long-life. And that's called stylistic durability. It means you can use it for a long time." - Gert Dumbar
jjindev 13y ago
I grew up with simple interfaces. I came up through the monochrome Macs. I loved the early Apple Human Interface Guidelines. I think the first time I said "whoa" was when I saw Enlightenment. Suddenly excess ornamentation was fun. I even advised Steve Jobs (if he read USENET) that "eye candy rules." So now maybe we've all been through that cycle, and eye candy, excess ornamentation, over the top skeumorphism, is falling away. That's probably ok.
SolarUpNote 13y ago
And of course, there are always cases where flat design wouldn't make sense: http://www.apple.com/logic-pro/whats-new/ http://www.apple.com/logic-pro/whats-new/
crazygringo 13y ago
One of the better articles I've seen on this. However, I still have a big bone to pick with their conclusion, which everyone from Microsoft to Apple has been parroting: > a desire to curb superfluous decoration and to focus on the content itself All this "focus on the content" is driving me nuts. The only time I really want to focus on the content is while listening to MP3's, watching a slide show, or browsing a webpage -- and that's what full-screen mode is for. Most of the rest of the time, the whole point of the phone/tablet/desktop is to interact with the content -- to edit it, to transform it, and so on. I don't want extra clutter, but I do want the buttons, the toolbar, the menu bar -- I want to sit down at a program and see what I can do with it, not look at bare "exposed content" and wonder where on earth I click/tap/swipe from in order to reveal the hidden interface. I want to know what's a button and what's a label and what's a textbox without guessing -- I want affordance. I don't want everything that's part of the interface to be whitewashed and homogenized and grayed-out until I can't tell what's what, just so it can all be relegated to a neutral background so that the content itself can be all "focused on" or "exposed". I mean, pre-flat-design-era, people complained about plenty of crappy interfaces, but I never heard anyone complaining that whatever "content" wasn't "exposed" enough, unless they were IE users with 20 toolbars. Sometimes it seems like half these new flat interfaces are really just made for stores and TV commercials, so people can see bigger pictures of professionally-taken "vacation" photos -- and the actual experience of using them suffers for it. (Kind of like "cover flow" was beautiful in commericals, but then I've never known anyone who actually used it for real -- which makes sense why it was finally removed from iTunes.)

107 points by porker 13y ago

Perfect explanation, good was mentioned Flat UI by designmodo in this article http://designmodo.com/flat-free/ http://designmodo.com/flat-free/.

pbowyer 13y ago

Interesting essay. I would come back on two points: The modernist style of which the author is so fond has been softened since; it was too harsh an aesthetic to appeal to many people (outside the design world, where it is still very popular) Flat UI design doesn't strip back to functionality; it's another aesthetic trend like skeumorphism.

return0 13y ago
Indeed, flatness is not even functional in many ways. Our vision is designed to recognize shadows and bevels instantly as indicators of depth, which can make many "skeuomorphic" designs easier to work with compared to their flat equivalents.
lmm 13y ago
I consider myself a modernist, but I was surprised to find I preferred the Harrods frontage to the modernist building in the picture below it.
- pbowyer 13y ago
  Me too. In interior decor, I always thought I liked it clean and modern, but the more I look around I realise I like it comfortable and homely. Not Laura Ashley or shabby chic, but not stark and unfriendly either. Not white walls and chrome. Even in an office, I like colour and warmth. Clean lines, light and airy, colour and not too much over-ornate art... there has to be a name for this design movement.
  - icebraining 13y ago
    Have you seen postmodernism? It seems to fit more or less with that, at least to my layman eye.
- brudgers 13y ago
  The Harrods building has a well proportioned facade. One could say it has good bones. It is only the idiom which organizes its ornament which has fallen out of fashion. None of this should surprise us. Typologically, it is a modern building. There are not 18th Century department stores. The building has elevators and escalators. The comparison to Sullivan's building is silly. The sites are differently constrained. Harrods low profile fits its context outside the urban core. Carson Piere Scott is sitting in Chicago's Loop; it is downtown where land is expensive. Hence it's greater overall height and lower story to story height. But even more relevant is that Sullivan's architecture is a series of additions and renovations. The building was not birthed fully formed, but is several projects joined together as additional land was available. Part of his job was to tie these pieces together, and that's what its facade reflects.

digitalengineer 13y ago

Is it just another skin or more? Judge for yourself: A list of screenshots of iOS7 redesign vs the 'old' design: http://ios7redesigns.tumblr.com/ http://ios7redesigns.tumblr.com/

sp332 13y ago
I'd like to think not, but I'm not sure how a series of static screenshots could show anything other than "skin" differences.
- digitalengineer 13y ago
  For a large part it is just that; same composition, same 'buttons', same place, but in a new design. You do raise a good point though: I feel the App Store could do with short video's instead of screenshots. Like they do on their own iOS7 page: http://www.apple.com/ios/ios7/#videos http://www.apple.com/ios/ios7/#videos

panacea 13y ago

UI design has always been about abstracting away underlying complexity and presenting a virtual wizard to manipulate the underlying code. Would it not be more 'digitally authentic' to present 1's and 0's? 'Flat design' is as much an arbitrary aesthetic as 'decorative design', and whilst I agree it's very pleasing and a sight for overloaded eyes, it's most certainly a trend and not an objective improvement on interfaces usability design.

brudgers 13y ago
To the degree a flat design idiom such as Metro [or whatever it's called] begins to admit text and favor it over icons, a reasoned argument can be made that they are objectively better. It is not just that the pictographic language of icons -, folders, floppy disks, file cabinets, trashcans, glue bottles, scissors, clipboards etc. - is drawn from a context largely irrelevant to large segments computer use today such mobile devices, educational contexts and home uses. Nor is it that elements such as the floppy disk are twenty years obsolescent. The problem with the pictographic language rooted in skeuomorphism is that it lacks a grammar. It has no rules of combination. There is no icon for copy and paste - let alone one for copy from context a and paste in context b. It is not entirely an accident that alphabets have been replacing pictograms for three millennia. They are more flexible. Likewise, the iconography of industrial buttons is rapidly disappearing both as a relevant context from the workplace, and as a human interface. Industrial interfaces are increasingly a screen and a keyboard [a keyboard is our industrial interface to an alphabet]. What is the most useful feature of the iOS interface? It would be hard to argue for anything other than the touch keyboard. It has two important features. Each icon represents a symbol rather than an action. Those symbols have rules of combination which allow the expression of complex abstractions. Your roommate can text "Scrunchie on door." They don't need to download "The Let Someone Know You're Getting Laid App" from the app store. Neither do you. The icon and skeuomorphism will continue to lose ground simply because they are too brittle for general purpose computing. There will be specialized contexts where they persist - just as pictograms are a useful way to describe the way the Grants Mill Road winds over the hill. The sign before two successive turns shows two successive turns. Today, we are in a future where Grants Mill Road has been straitened as it heads down toward the bridge, but some interface designer has not only retained the sign but had it painted to simulate a brushed aluminum finish and shading to simulate an embossed surface illuminated from the upper right. Most skeuomorphism is cutting two inches off the potroast. http://mikeschinkel.com/blog/conventionalwisdomassumptionsandpotroast/ http://mikeschinkel.com/blog/conventionalwisdomassumptionsan...

zeckalpha 13y ago

Isn't the calculator example still skeumorphic?

hcarvalhoalves 13y ago
> A skeuomorph /ˈskjuːəmɔrf/ is a derivative object that retains ornamental design cues to a structure that were necessary in the original. You can say that it isn't, because they departed with the aesthetic elements intended to make it look true-to-life like reflections and bevels; or that it is, because it still retains the placements and interacts like the physical calculator.
- zeckalpha 13y ago
  For a while there, it seemed like people had reached the consensus that flat vs. skeumorphic is a false dichotomy. After iOS 7 was unveiled, all of a sudden they are opposed again.

Kerrick 13y ago

If you enjoyed this article, you'd probably also enjoy Material Honesty on the Web [1], by Kevin Goldman on A List Apart. [1]: http://alistapart.com/article/material-honesty-on-the-web http://alistapart.com/article/material-honesty-on-the-web

PavlovsCat 13y ago
same author as the OP, and one of the best things I ever saw posted on HN: http://fadeyev.net/2012/06/19/moral-design/ http://fadeyev.net/2012/06/19/moral-design/

stevenkovar 13y ago

Design solves problems. That's it. Projecting these terms and trends only serves to handicap those who choose to emulate over develop a grasp on the fundamentals of problem solving.

huffman 13y ago
"solves problems" encompasses a vast space of decision making, some of which is arbitrary and stylistic. "That's it" is oversimplifying things. "In Holland, we have two words for design. One is vormgeving; in German formgeben. And the other word is ontwerpen; in German entwurf. In the Anglo-Saxon language there's only one word for design, which is design. That is something you should work out. Vormgeving is more to make things look nice. So for instance, packaging for a perfume or for chocolate in order to make things fashionable, obsolete and therefore bad for society because we don't really need it. While ontwerpe means, and the Anglo-saxon word, but its stronger, means engineering. That means you as a person try to invent a new thing—which is intelligent, which is clever, and which will have a long-life. And that's called stylistic durability. It means you can use it for a long time." - Gert Dumbar

jjindev 13y ago

I grew up with simple interfaces. I came up through the monochrome Macs. I loved the early Apple Human Interface Guidelines. I think the first time I said "whoa" was when I saw Enlightenment. Suddenly excess ornamentation was fun. I even advised Steve Jobs (if he read USENET) that "eye candy rules." So now maybe we've all been through that cycle, and eye candy, excess ornamentation, over the top skeumorphism, is falling away. That's probably ok.

SolarUpNote 13y ago

And of course, there are always cases where flat design wouldn't make sense: http://www.apple.com/logic-pro/whats-new/ http://www.apple.com/logic-pro/whats-new/

crazygringo 13y ago

One of the better articles I've seen on this. However, I still have a big bone to pick with their conclusion, which everyone from Microsoft to Apple has been parroting: > a desire to curb superfluous decoration and to focus on the content itself All this "focus on the content" is driving me nuts. The only time I really want to focus on the content is while listening to MP3's, watching a slide show, or browsing a webpage -- and that's what full-screen mode is for. Most of the rest of the time, the whole point of the phone/tablet/desktop is to interact with the content -- to edit it, to transform it, and so on. I don't want extra clutter, but I do want the buttons, the toolbar, the menu bar -- I want to sit down at a program and see what I can do with it, not look at bare "exposed content" and wonder where on earth I click/tap/swipe from in order to reveal the hidden interface. I want to know what's a button and what's a label and what's a textbox without guessing -- I want affordance. I don't want everything that's part of the interface to be whitewashed and homogenized and grayed-out until I can't tell what's what, just so it can all be relegated to a neutral background so that the content itself can be all "focused on" or "exposed". I mean, pre-flat-design-era, people complained about plenty of crappy interfaces, but I never heard anyone complaining that whatever "content" wasn't "exposed" enough, unless they were IE users with 20 toolbars. Sometimes it seems like half these new flat interfaces are really just made for stores and TV commercials, so people can see bigger pictures of professionally-taken "vacation" photos -- and the actual experience of using them suffers for it. (Kind of like "cover flow" was beautiful in commericals, but then I've never known anyone who actually used it for real -- which makes sense why it was finally removed from iTunes.)