

Realism in UI Design - ugh
http://ignorethecode.net/blog/2010/01/21/realism_in_ui_design/

======
jsm386
I always wondered what the VLC cone was about. This prompted me to finally
look it up. Interesting:

On day, people from the VIA association (VIA is a students' network
association with many clubs ... amongst those is VideoLAN. More info here :
<http://www.via.ecp.fr> ) came back drunk with a cone. They then began a cone
collection (which is now quite impressive i must say). Some time later, the
VideoLAN project began and they decided to use the cone as their logo.

<http://www.nanocrew.net/2005/06/23/vlc-cone/> /
<http://forum.videolan.org/viewtopic.php?t=9792>

------
malkia
Somehow that reminds of the uncanny valley, the more human-like a robot
becomes, the more one starts looking for it's errors in details. Same with
computer graphics, video games - the more realistic the characters are, the
more you start looking for things that are not right - for example - eyes, but
no focusing, or moving. I worked long time ago on Metal Gear Solid port to the
PC, and we made all eye textures twice better, Kojima talked with us only once
through the whole project, and he was not happy with our new eyes in the game.
He said, that the game (back then) did not had the technology for the eyes to
move around, and focus, so their team decided to blur them - this way you
can't spot the problem - it was masked.

~~~
rickmode
Exactly. Past a certain level of detail the brain flips from the conceptual to
the specific.

More on the "uncanny valley": <http://en.wikipedia.org/wiki/Uncanny_valley>

~~~
tfh
This video explains the uncanny valley really well :

[http://www.youtube.com/watch?gl=US&v=FKTAJBQSm10](http://www.youtube.com/watch?gl=US&v=FKTAJBQSm10)

------
tjogin
One of the better design related articles I've read lately. Good way to
illustrate a problem that can otherwise be hard to explain.

~~~
diN0bot
hm... i came away with the opposite opinion. how do i know that the example
icons he showed hit the "sweet spot" between too much and too little
information...rather than everyone being trained to recognize those icons.

i'd rather see a user study with a control before i jumped to any conclusions.

often times people call a UI "intuitive" when what they really mean is
"familiar."

~~~
korch
The only "intuitive" interface is the nipple. After that it's all learned. \--
Bruce Ediger

With that said, we all know an intuitive interface when we see one. It's just
too difficult to separate an enormously complex and highly context-sensitive
technical process that we've learned from some kind of ideal optimum. Saying a
design is "intuitive" is analogous to saying one Turing complete language is
"better" than another.

~~~
BigZaphod
Ever since I've had a kid, I've felt that the nipple quote is bullshit.
Infants have to learn how it works at first when starting breastfeeding. They
don't just know how it works fresh out of the womb. The instinctive part of
the process is that the baby happens to have a natural desire to suckle stuff
- nipple-shaped or not.

~~~
Mz
As I understand it, most babies seem to just know. My oldest took a month to
figure out the whole breastfeeding thing. I have teased him that he was a
"stupid baby". The reality is that he seems to have less instinct than most
folks. This has its good points and bad points. But I did not see a lot of the
"normal, expected" baby behaviors until I had my second child.

In short: A sample of one does not disprove a generality.

------
mortenjorck
The Scott McCloud references are perfect for this topic. I wish I still knew
where my copy was -- one of my favorite professors in college assigned it for
an early design class, and it certainly never touched my semester's end sell-
back pile. It's more than worth a re-read.

~~~
Nekojoe
Scott McCloud also did the comic book for Google Chrome [1] I love the way
complex ideas are explained in a simple manner in that comic book. I do show
it my non-programmer friends to explain what goes on under the hood of a
browser.

I wish more programming projects were documented in this way.

[1] <http://www.google.com/googlebooks/chrome/index.html>

~~~
roundsquare
_I do show it my non-programmer friends to explain what goes on under the hood
of a browser._

Really? I read the first few pages... it gets fairly technical. I don't think
most of my non-programming friends know what a thread is. If they have some
vague idea, they certainly don't know the difference between a thread and a
process is.

------
yannis
Besides the useful contents I enjoyed this:

>If you see a typo, a spelling mistake, an error, or any other issue, please
tell me about it by opening a case in my _issue tracker_ or by sending me an
e-mail. _

~~~
vdm
Impressive, but it would be better if the newly opened bug had a link to the
page you're raising the issue about.

------
jauco
Good article, though he makes it sound as if there is an actual optimal amount
of detail that you can put into an icon, while in fact it's very dependent on
the context.

For example the right-most "house" icon looks very housey to me, because I
could gather from the line of icons that it was supposed to depict a house.

When building interfaces it's funny (or not, depending on the pressure) to
find that users interpret the icons in completely novel ways. For example:
trash cans are interpreted as brushes because someone expects the paste button
at that position.

~~~
frossie
_When building interfaces it's funny (or not, depending on the pressure) to
find that users interpret the icons in completely novel ways._

Which is why I always think - do I really need an icon here, or should I use
text?

The worst example I have come across was a package we took over where there
was an icon of a dog. Incredibly, this was supposed to be "Fetch from
database" (dog, fetch, geddit?). Even after days of using it my brain still
locked up looking at the damn dog - imagine my poor users who only had to
interact with the software occasionally. Switching the icons to text cleared
up any confusion.

Unless screen real estate is really at a premium (eg iPhone), I prefer to see
text, and any application that gives me the choice (eg. Firefox) I immediately
configure to do so.

------
andreyf
Only marginally related: how often do people use the "home" button on their
browsers? Is it fair to hypothesize "never"?

~~~
gb
I use it all the time, my homepage is a little document I have in my dropbox
with a search box and links to all the sites I commonly visit.

A bit redundant these days perhaps, but it still works for me.

~~~
access_denied
Redundant only if you use just 1 browser. Second: it's a piece of personal art
(pop-art).

------
statenjason
After reading, my mind was drawn to road signs which share the same principle.
Seeing a sign with a picture of two people standing awkwardly would not put
"crosswalk" into my mind. Also, I notice that the color of a sign itself is
significant. The red X in the corner of my browser shows color plays a role
here too.

------
alabut
I noticed an assumption that he makes that's worth pointing out. All the
examples he gives where overly realistic elements are distracting are
interactive ones, things you're supposed to click on, switch off, etc. However
it can enhance things that are read-only so to speak, like information
dashboards.

For example, Lexus's new LF-A sports car has digital gauges that sport very
realistic-looking dials that imitate the analog ones they replaced, with a few
enhancements like turning the face white for sport mode, turning it red when
the RPMs hit the redline, etc.

Quick video clip of it in action:

[http://paultan.org/2009/11/13/lexus-lf-a-has-one-really-
cool...](http://paultan.org/2009/11/13/lexus-lf-a-has-one-really-cool-meter-
panel/)

------
dabent
"Perfection is achieved, not when there is nothing left to add, but when there
is nothing left to take away...."

-Antoine de St. Exupery, Wind, Sand and Stars, 1939

~~~
barrkel
Unfortunately a recent trend in native app design is to remove more or less
essential elements, such as the menu bar. This makes it a lot harder to scan
the UI looking for a particular piece of functionality: you have to guess
which button is actually a menu, and which submenu of that menu the thing
you're looking for is hiding under.

For example, Chrome doesn't have a nice and simple Bookmarks menu like FF (or
Favorites in IE). You have to waste an entire chunk of vertical space on a
"Bookmarks Toolbar" before you can access the button which is actually a menu,
under which the bookmarks are hiding. One of several reasons I don't use
Chrome.

There are lots more examples in Windows Vista and Win7. Take wmplayer: how do
you open up a URL for streaming? It's hard to find that kind of functionality
in the visible UI, because it seems not to be present. Instead, you have to
use the context (!) menu on some of the window chrome (!!), and you can see
that they've squished what used to be the main menu bar into the context menu.
The UI actually ends up being _more_ complex (it's harder to get at the
features), the only "benefit" being that the application, on the surface,
appears to do less.

Not to mention the now-fashionable ribbon toolbars, used in Wordpad and
MSPaint - they've changed what used to be a _modeless_ UI paradigm, i.e.
menus, into a _mode-based_ one with switching tabs. In many ways it feels like
a step back into the 80s for me.

~~~
roundsquare
_This makes it a lot harder to scan the UI looking for a particular piece of
functionality: you have to guess which button is actually a menu, and which
submenu of that menu the thing you're looking for is hiding under._

Completely agree. These overly minimal interfaces are great if you only use
the most basic functions (open file, pause, play, stop) or already know what
you are doing. However, if you need to _figure something out_ its pretty
horrible.

------
parbo
This is all true, except for audio software (esp. plugins). Then the rule is
to make it super-realistic.

~~~
jcl
It's the _convention_ to use realism in audio software, but that doesn't
necessarily make it an effective interface.

It reminds me of the bizarre interfaces in Kai's Power Tools:

<http://en.wikipedia.org/wiki/File:Kai%27s_Power_Tools.jpg>

At the time, artists gushed over how fun and innovative the user interfaces
were, but such interfaces are rare in today's graphics software. Few people
want an interface where each dialog is a little puzzle, where you can only
have five presets because that's all that the UI designer thought looked good
in the layout, or where the dialog's background exerts undue influence on your
choices of color or texture.

------
edw519
_Let me explain this concept using an entirely unscientific graph_

Then he includes a bell curve with confusion on both outlying sides.

After reading so many black and white posts, "This is the right way," "Do it
this way or I will kill you," or "That's lame," it's refreshing hear, "Use
your judgment and find the sweet spot." A bell curve is the perfect
illustration.

Thank you, OP. This is advice that applies to alot more than just UI Design.

------
nkohari
Great article. This is why symbolism is so important. You reduce the cognitive
load to the absolute lowest level while still getting your point across, so it
takes less time to interpret.

------
faramarz
Sometimes the most difficult thing is to know when to stop adding features.

It's even more difficult when the designer has complete creative control. that
can lead to disaster!

------
kristiandupont
I used the same illustration to point out a similar phenomenon in code:
<http://bit.ly/76zHEQ>

