

Skeuomorphism - speednoise
http://skeu.it/

======
tb303
Hey all. I'm the curator (punch me in the feelings for saying that) of
Skeu.it.

Thanks for the support!

I'm enjoying the debate here and won't get too much into it. For those arguing
what is and isn't skeuomorphism, you're missing the point of the showcase.

Skeu.it, as specified on the masthead, celebrates arbitrary and gratuitous
user interface decisions. Specifically, this means the misappropriation of
visual artifacts designed for evoking familiarity in both form and function.

So yes, in my joyfully entitled opinion, using a big piece of frosted glass,
with paper hanging from a rope, with magic buttons that somehow exist on lined
paper, is a foolish design choice. Really, I wouldn't even call it a design
choice, I'd say it's more just a collection of photoshop tutorials
masquerading as an interface. Unnecessary skeu is the 2012+ version of the
House Industries' "Crackhouse" typeface
(<http://www.houseind.com/fonts/crackhouse>) appearing on every website and
flyer 10 years ago. It's a classic, recognizable typeface...but stare at that
for a moment, think back to how it didn't really make sense to announce free
puppies or a car wash in deconstructed type, and let the understanding wash
over you. Mmm, delicious understanding.

I have no hate towards skeu ("skeuomorphism must die" is silly) at all. In
fact, I defend it:

[http://www.quora.com/What-are-the-advantages-of-
skeuomorphic...](http://www.quora.com/What-are-the-advantages-of-skeuomorphic-
interfaces) (from last year, a bit outdated)

Thanks again, and please send any good candidates my way (@303, @skeuit) for
skeu.it!

 _Edit: Proper capitalization, the official end of my majuscular laziness._

~~~
gbog
Agree with your fight, thanks for carving this site about gratuitous user
interface decisions, really. However, I am puzzled that you don't apply this
to your writing and use proper capitalization.

~~~
tb303
Caught! I've been chastised for this laziness too many times. It ends now.
Thanks!

------
shinratdr
So skeuomorphism is now anything besides Windows Phone style "pure digital"?
Shiny = glass, black texture = leather, blue texture = denim, etc? That's
going to be really, really boring.

I don't know why texture is such a bad thing. Of course you can overdo it like
anything, but personally I prefer Reeder with a light paper-pulp backing
texture instead of a plain light peach background.

For example, what is so bad about this?

<http://skeu.it/image/24908403424>

It almost feels like people are calling it skeuomorphic so that's how they
expect the developer to feel about it. I don't think regular people look at
these as real world metaphors, expecting them to function as they do in real
life. That feels to me like a theoretical user posed by developers that
doesn't actually exist.

In reality, people see it for what it is. Design flair. Whether or not it's
unnecessary or helps the user with the app is missing the point entirely.
Design that's pleasing to the eye shouldn't get in the way and cause problems,
but it doesn't have to accelerate your use of the service to be positive
overall.

Aero Glass is a great example. It gets mixed opinions, but I think we can all
agree that it's far better than Luna and IE actually looks pretty great with
it. There is no skeuomorphic benefit to having glass everywhere. It's simply
design flair. With that in mind, I still prefer it.

~~~
hcarvalhoalves

        For example, what is so bad about this?
        http://skeu.it/image/24908403424
    

Because it reproduces a hypothetical real-world object, that not only doesn't
make any sense (what is a sheet of paper hanging from a glass panel anyway?),
but doesn't add any meaning to what this interface is supposed to do?

You _can_ use skeumorphism where it makes sense. The problem is that login
form has _no_ analog in real-life, so in this one designer just went crazy for
the sake of it.

EDIT: Yay, let's downvote.

~~~
gurkendoktor
> The problem is that login form has no analog in real-life, so in this one
> designer just went crazy for the sake of it.

That is not a problem. A problem is: "it is hard to use", "it uses a lot of
bandwidth", "people dislike it in A/B testing and buy less".

~~~
bwkeller
"it uses a lot of bandwidth" is exactly the problem that skeu-craziness is.
Purposeless high-resolution backgrounds and animations waste storage space,
bandwidth, cycles, and developer time. Time/money spent adding a fake leather
texture is time/money unspent on functional aspects of a product.

~~~
nollidge
> Purposeless high-resolution backgrounds

So you're against textures full stop, not just skeumorphism? Because of course
high-resolution textures are not necessarily skeumorphic.

> Time/money spent adding a fake leather texture is time/money unspent on
> functional aspects of a product.

Using a fake leather texture takes about as long as using some other texture
or choosing a solid color or choosing which direction the gradient goes in...
You're either spending time on design, or you're not. Even being minimalistic
takes time and intention.

------
Smudge
My designer friend and I are laughing so hard at this that we're crying.

In all seriousness, this is the perfect tool for showing people how
skeumorphism can be taken too far. I actually like many of these designs, but
the point is that the metaphors don't actually help, and sometimes only add to
the confusion. (Denim weather app? Pea coat button loops for on/off switches?)

~~~
RandallBrown
In all fairness, lots of these are just people on Dribbble flexing their
photoshop muscles.

The peacoat on off switch wouldn't be great in your app (unless you're selling
peacoats or something) but it still looks kinda cool.

~~~
MartinCron
The peacoat on/off switch is causing a lot of cognitive dissonance in me right
now. It's so pointless, but so adorable. I want to make a peacoat-related app
just to have an excuse to use it.

~~~
MartinCron
It turns out that I don't know my garment lingo well enough. That kind of
closure on a coat is called a "toggle" so it's a sort of visual pun.

------
nileshk
The audio plugin example is typical because the vast majority of music
production software exhibits a great deal of skeuomorphism. I personally don't
like this because it increases the cognitive load in trying to figure out an
interface, and I don't feel like it helps make things more intuitive than a
non-skeuomorphic interface -- rather the opposite, it becomes more confusing.

This is one of the reasons I like Ableton Live (
<http://www.ableton.com/suite-8> ): it has a simple, consistent user interface
elements and the entire user interface happens to be vector based. Not only is
it easy to navigate and understand, but the fact that it is vector based
allows it to have a resolution-independent interface that can be zoomed
in/out. Which addresses another problem with music production software: they
tend to use tiny fonts and other UI elements which makes it hard to read when
used with a high-PPI monitor and/or when the monitor is far enough away from
the user (which seems to often be case in many studio setups). And once you've
done a highly graphical skeuomorphic interface that uses lots of bitmaps,
scaling doesn't always happen smoothly.

On the other hand, many people like skeuomorphic interfaces when they've had
past experience with actual audio hardware. Reason (
<http://www.propellerheads.se/products/reason/> ) is one such example where
the interface is so skeuomorphic that is often considered a hardware
simulator. People who have past experience with such hardware often love
Reason because they are able to draw upon past experience to understand the
interface. I suppose in this case, this is a very appropriate use of
skeuomorphism.

People like me who don't have experience with such hardware aren't necessarily
going to appreciate this, though some people will enjoy it even without past
experience with hardware because some people simply enjoy visually appealing
graphical interfaces. So it's a tough call which group of people is in the
majority and who you want to cater to. Personally I like music/audio software
to focus on it's core task of being a music creation tool, and less on being
graphically impressive; but that's just me.

~~~
a45l98
The other thing to consider is that audio processing is resource intensive.
Many times you need to run many things at once and performance suffers.

Guess what else is resource intensive? Graphics. So everytime you have
gratuitous graphics (e.g. a guitar plug-in that has one or two controls but
goes to ridiculous lengths to reproduce a graphical image of, say, a guitar
pedal), it takes away some of your resources.

I think you're right though. The interface is aimed at people who are used to
looking at gear. That is the intended audience. They wanted to sell to the
same people who were buying physical gear. Unfortunately it alienates anyone
who understands how to actually use a computer beyond pointing and clicking or
keyboard shortcuts.

I mentioned it in another comment in this thread, but if you want to see how
things could be done in a "UNIX way", check out snd from the guys at Stanford
CCRMA. It has a long history, longer than Ableton, probably as old as Sound
Designer, the precursor to Pro Tools, though I'd have to check the dates.
These guys clearly "get it". This is how computers and audio should intersect.

But, functionally, it's not a substitute for MOTU, Ableton or Digidesign,
unfortunately.

~~~
nileshk
<https://ccrma.stanford.edu/software/snd/snd/snd.html>

"Snd is a sound editor modelled loosely after Emacs"

As an Emacs user, I am very much intrigued and will have to try this out.
Thanks!

~~~
a45l98
I really shouldn't have said "UNIX way". It really is more a "LISP way" I
guess. LISP predates UNIX. My point was just that it's an "interface" that's
more in line with how computers actually work.

------
clarky07
I don't understand all the hate for skeuomorphism lately. Who cares if the
todo app uses a design that makes it feel like a leather bound paper notebook.
The point of design is to make something functional and beautiful. As long as
it doesn't actively make the functionality worse, and some people like they
way it looks, _what is the problem_?

~~~
FuzzyDunlop
I see the current skeuomorphism trend, in a way, as cargo-culting. People saw
some questionable, but not entirely dreadful uses of it (basically Apple's
effort) and thought, "yeah that looks good! I'm going to give my app an
awesome real life texture!"

Take the denim weather app design for example.

To what extent does a denim effect, that one would associate primarily with
jeans, have anything to do with the weather? Did the designer think to
question that, or was it just a case of mind-bogglingly detailed texture being
the in thing?

I mean, if you can't come up with a reason for that particular choice of
visual metaphor other than "it looks good", then was it really the right
choice?

On a side note, I dislike the usage of this in native app design. You'd get
those ridiculous apps in Windows XP with bonkers custom UIs, including Safari
and Quicktime, for that matter. Now apps in OSX are skinned in odd ways (in
Address Book's case, detrimentally so) and Windows 8 appears to be aiming for
a consistent look and feel.

~~~
wvenable
A todo app uses a design that makes it feel like a leather bound paper
notebook is skeuomorphism. A weather application is with a denim texture is
just a weather app with a denim texture. It could just as easily have a
squiggly line texture or have a solid purple neon background. It might be ugly
and stupid but that doesn't make it skeuomorphism.

------
MatthewPhillips
See to me, some of these examples aren't skeuomorphic. This for example, I've
never seen a leather item in meat-space with aluminum buttons. Or a big
platic/glass button.

[http://skeu.it/post/29492973628/in-space-no-one-can-see-
you-...](http://skeu.it/post/29492973628/in-space-no-one-can-see-you-skeu)

~~~
Smudge
I think that's part of the point here. The visual metaphor of leather doesn't
make much sense, and is only there as an ornament because it (apparently)
looks attractive. Why include the leather at all, if it's not a helpful
metaphor for using the product?

~~~
wvenable
Design?

Some of these are actually pretty attractive and don't appear to interfere
with the usage of the app. Others aren't so attractive and many more are hard
to use.

Why is a texture automatically worse than a solid colored background?

~~~
Smudge
I wasn't arguing that texture is worse. When used appropriately, it's
generally better than solid colors, both in terms of UX and just visual
attractiveness.

But there is a certain category of textures that seem to come up most often on
this site. Things like leather, denim, paper that perhaps remind users of
rough, tactile, durable materials. These metaphors get a lot of use,
especially on iOS, and I find that it's funny to call them out sometimes.
Sure, it's attractive, but also perhaps a bit derivative.

~~~
gbog
Anything to back the claim that textures are "generally better" in terms of
UX? Studies? Statistics? A/B testing?

~~~
Smudge
That was just opinion. Should have made that clear.

------
bluthru
If skeuomorphism didn't have a name, I bet no one would give a shit.

~~~
qq66
Haha, completely true. It also helps that the name is kinda fun. There were a
lot of nerds messing around with XMLHttpRequest back in the day, but it got a
lot cooler when Adaptive Path christened it "AJAX."

------
dm8
As a designer, I couldn't agree more. Skeuomorphism can be great if done
right. Nowadays visual designers (who are wannabee UX folks) think any sexy
texture (leather patterns) can increase usability of an app. Even startup
founders think the same. They don't realize design is not the shiny new coat
of paint, design is how it works. In fact if your users think "it works fine",
it means you've done great job. Your objective is not to hear "wow it has sexy
design".

~~~
wvenable
I've been a software developer for many years and sexy design sells. For good
or bad, that's the way it is.

~~~
dm8
Somewhat agree. Dropbox didn't sell because it had shiny icons for folders or
sexy web interface. It sold because it provided immense value and it just
worked. Same can be said about Google, YouTube, Microsoft Word etc. None of
them had sexy design to start with but they simply worked and provided great
value to end-users.

~~~
wvenable
You've picked apps with necessarily minimal interfaces; the only exception
being Microsoft Word. Word doesn't need a new UI every other year but it gets
one because, without making the UI sexier each year, people don't buy it.

I like this anecdote from Raymond Chen on this subject:
[http://blogs.msdn.com/b/oldnewthing/archive/2004/05/25/14125...](http://blogs.msdn.com/b/oldnewthing/archive/2004/05/25/141253.aspx)

~~~
Turing_Machine
"You've picked apps with necessarily minimal interfaces;"

 _Necessarily_? Have we really forgotten what search engine UIs looked like
before Google came along?

------
egypturnash
Remember when you were 4 or so? And you had a "busy box"? Just a bunch of
levers to move, buttons to push, dials to turn?

A well-done skeuomorphic interface, I submit, can be a busy box for grownups.
What's wrong with having a few things in your life that partake of both "toy"
and "tool"?

~~~
bthomas
Do you have an example in mind?

~~~
egypturnash
Well, here's a post on the blog under discussion of a brightly-colored UI that
definitely has a "busy box" vibe: <http://skeu.it/post/28492549355/crysonic>

(A lot of music software has this ultra-skeumorphic vibe. I guess to appeal to
luddite musicians? Or just because it's fun to do. Maybe both.)

A lot of the skins from Audion ( <http://panic.com/audion/index.html> ) had a
busy box/toy kind of vibe too, though the animation was pretty limited:
<http://panic.com/audion/gallery/previews/panman.jpg>
<http://panic.com/audion/gallery/previews/contragrav.jpg> \- the better ones,
for me, had this kind of "here's a cool vinyl toy for your desk, except it's
virtual, and plays music".

------
Groxx
Evidently built by someone with a skeued sense of humor.

------
hakaaak
I think the main point being made is that the design shouldn't be distracting
unless that is the point of the design. For login forms to be hanging from
keys, and paper to be hanging from bolted glass panels is nonsense, and a
distraction. Unfortunately what different people find appealing, others find
distracting, but that's what usage metrics and testing are for- to help
determine what does and what doesn't work.

------
kbutler
Skeumorphism is including or retaining historical design elements for now non-
functional purposes.

The author asserts that Microsoft's Metro design moves away from it, but his
screenshot of Metro shows several instances:

\- a paper shopping bag icon \- MSFT stock symbol \- icon of analog alarm
clock with bells \- gear icon for control panel \- manilla folder icon for
windows explorer

And does anyone else cringe at the HTML slipping through on AT&amp;T?

The simple fact is that building on previous experience is useful.
Anachronistic visual remnants of previous technology can lend familiarity to a
new interface, reducing learning curve and increasing acceptance (e.g., rivets
on denim jeans).

Sometimes designers go even further and purposely introduce even more
skeumorphic elements, going for a "retro" feel.

Some people like it, some people don't. It isn't always done well, and it
isn't always done badly.

~~~
tb303
If the link went to the Fast Company article, your comment would make much
more sense!

------
tsahyt
I'm going to go against what seems to be the opinion of lots of designers and
bloggers these days and say: I actually like skeuomorphism, if it's well
executed.

EDIT: I'm talking about _visuals_ now. How it affects usability is part of
"well executed".

------
brendanobrien
If you're still complaining about this, I'm here to tell you to move on.

------
believeUme
Skeu is saccharine, and that's why it sucks. Mouthful of gloss. Yuck.

------
mbesto
This reminds me of one of the first biggest lessons I've learned about the web
- make it better than reality. Sadly, Jakob Nielsen found this out in 1998 [1]
and we still can't get past it.

> _It is painful to use the Web, so we need to reward users: give them
> something new and better that they didn't get before._

[1] <http://www.useit.com/alertbox/980308.html>

------
scott_meade
The anti-skeuomorphism crusade is more distracting than the designs it calls
out. If I were a designer and if I had any influence, I'd add some gratuitous
skeu-ness to a design just to attempt to calm the skeuphobia sweeping the
design world.

------
thomasfl
LOL "COME ON DOWN THE THE SKEU WAREHOUSE! WE’VE GOT LINEN! WE’VE GOT WOOD!"
<http://dribbble.com/shots/662571-Mo-Tab-bars?list=following>

------
simba-hiiipower
best line: _FUCK USABILITY WE HIRED A 3D MODELER AND WE’RE GOING TO GET OUR
MONEY’S WORTH!_

<http://skeu.it/post/28492549355/crysonic>

~~~
tsahyt
That thing is an audio plugin for music production. That sort of UI is what
many producers _want_ , because they want it to resemble the actual hardware
they had two decades ago. Whether this thing was an actual product or not
doesn't make a difference.

------
lovskogen
I wonder if skeuomorphic designs will be looked back at and be viewed like we
now view the interfaces from the 90s, with huge amounts of bevel and emboss,
shadows and gradients.

~~~
tb303
I believe this will be likely. KPT FTW!

------
vail130
Real quick go at it:

<http://jsbin.com/edoyoc/4/>

------
adjwilli
This is pretty awesome, but I wish they had called "Skeu You" instead.

~~~
tb303
I considered that, but decided the pun was more about my own disappointment
than aggression.

------
malkia
Kitsch UI 4tw!

------
its_so_on
I personally hate recognizing anything. If you think about it, even distinct
text characters one next to each other are a skeumorphism from movable type.

Obviously the only correct interface is a simple vertical list where hovering
over invisible areas of the screen reads you out loud an option and then
clicks it. Actually why read it out loud at all, a skeumorphism from
interacting with a person.

The only correct interface is a blank screen representing state with groups of
pixels that turn off and on without any skeumorphism, but simply representing
the state the program is in. Like the LED light showing whether your monitor
is off or on, but 1280x1024 of them.

anything other than that is just art monkey fluff, designers butting into
electronics where they don't belong.

a good rule of thumb is: if you recognize what's going on instead of having to
decode it, you are dealing with bullshit overpriced overdesigned fluff.

------
Evbn
Updated title no longer matches the content of skeu.it, which displays extreme
skeu, not just skeu in general or quintessential examples of skeu.

Also, skeu.it is really about textures and fail skeu, not actual skeumorphism,
which is about retaining obsolete details from a previous form, not just
pleasing textured imagery.

