In defence of skeuomorphism

Just a few short years ago the majority of web designers wouldn’t have been able to spell skeuomorphism, much less provide an accurate definition. Now, skeuomorphism is set up as the pantomime villain; the Wicked Witch of the East to flat design’s Dorothy.

Flat design has come to define itself as ‘not skeuomorphic’, but this is misleading; skeuomorphism isn’t the polar opposite of flat design, in fact flat design is frequently skeuomorphic.

What skeuomorphism (really) is

A simple definition of skeuomorphism is as follows: a decorative feature that imitates a functional aspect of an earlier technology. For example, decorative arches are often used in architecture, mimicking the functional arches of earlier centuries; this is skeuomorphism.

Design movements — in fact, movements in most cultural fields — have a tendency to reject the previous generation’s values. Consequently culture progresses as a series of revolutions and counter-revolutions. Skeuomorphism frequently occurs when technology or fashion turns full circle and old values become popular again.

A neo-modernist working in the early twenty first century may well find themselves imitating the qualities forced upon modernists by the limits of the technology a century ago; we frequently see posters designed with simple flat color, not because we can’t print gradients, but because we’re imitating the style of poster designers like Toulouse-Lautrec whose style was imposed by the printing technology he had commercially available to him.

What skeuomorphism (really) isn’t

An oft-cited example of skeuomorphism in website design is a button styled with bevels and a drop shadow. The current trend is to make the button ‘flat’ by removing the bevels and the drop shadow, which supposedly removes the skeuomorphic nature of the button; in fact it does nothing of the sort.

A button remember, is a mechanical lever which changes state when one applies pressure. We don’t create buttons on web pages, we create an image of a button that we can touch or click and which mimics the function of the older technology. Any button, on any web page, is inherently skeuomorphic, regardless of its styling.

Another frequently cited example of skeuomorphism is the leather texture and stitching used for certain apps on older versions of Apple’s iOS. The argument is that the texture is carried over from traditional personal organizers and is therefore skeuomorphic.

I question whether this is in fact skeuomorphism. Certainly the leather texture imitates the earlier technology, but it’s decoration imitating decoration. You could perhaps argue that leather is hard-wearing and the texture is functional in the original design, but I think that would be laboring the point. The leather texture in early iOS apps isn’t skeuomorphic, it’s something much worse: it’s lazy design.

Skeuomorphism and flat design

Microsoft’s Windows famously embraced flat design and rightly received the plaudits for having the guts (if not the chops) to pursue a new direction. Apple followed suit with iOS7 and, if rumors are to be believed, will continue on a similar path with their next major OS.

Window’s initial jump, and iOS’ capitulation are widely seen as the first, and last nails in the coffin of skeuomorphism.

However Windows 8, MacOS Mavericks, and in all probability the next generation of both platforms are inherently skeuomorphic; they use the concept (and likeness) of files and folders; something borrowed from centuries old filing systems. Many people choose not to interact with data in this way and instead rely on the command line or terminal; but it’s very rare to find someone who doesn’t do at least a little dragging and dropping.

You might remove some superficial aspects of a design which are skeuomorphic, but you’re still looking at a web ‘page’, through a browser ‘window’, that sits on your ‘desktop’.

Flat design then, impacts very little on the amount of skeuomorphic design that we experience on a daily basis.

The inevitability of skeuomorphism

Arguably the biggest rejection of a skeuomorphic web occurred when we stopped clinging to the idea of web sites being screen-based versions of print design and embraced responsive design. However, unless we develop a William Gibson-esque internet, in which information is seen as it is — infinitely extensible, editable streams of interconnected data — then we’ll continue to treat the Web as a metaphor for real-world documents and the Web will remain skeuomorphic.

Just as uppercase letters are derived from stone carving, and old-style serifs are derived from cursive scripts, so too is all culture based on what preceded it. As Sir Isaac Newton said, “If I have seen further it is by standing on the shoulders of giants.”

One day in the not too distant future, print will cease to be anything but an historic process. The materials that we print now will be replaced by surfaces, the molecules of which will change their color to create text, images and movies — imagine a sheet of paper with the interactive abilities of a tablet. In that exciting future, you’ll still find the echoes of a medieval monk, ensconced in a library somewhere in northern Italy, painstakingly illuminating a copy of the Bible.

In this, we find skeuomorphism’s salvation: skeuomorphism isn’t a design trend particular to the Web, it’s a characteristic of all human culture. Without skeuomorphism our ability to experience the Web is substantially diminished. Without skeuomorphism every leap in technology would be accompanied by a learning curve so steep, it would be prohibitive. Without skeuomorphism, I wouldn’t be typing this, I’d be in a forest somewhere hitting a nut with a stick.

The non-skeuomorphic web

This is not to say that all aspects of the Web are skeuomorphic, or that there is no progress without skeuomorphism.

Take for example the hover state of buttons. Whilst buttons themselves are deeply skeuomorphic, the change in the visual nature of the button, not when it is pressed, but when the user is considering pressing it, is (to my knowledge) unprecedented.

Some cutting edge developments are equally unique. Take for example the experiments with gaze-tracking that scroll a page up and down based on the motion of your eyes or head.

One of the truly great achievements of the Web is the distribution of information to the visually impaired. Text readers have made billions of pages of data available to those with visual disabilities. No books, magazines, or print of any kind ever had a function that read content to you. The development of text readers, and more recently speech control is a genuinely new technology and as such carries with it no skeuomorphic decoration.

The future of skeuomorphism

Skeuomorphism exists, and will continue to exist because it guides our paths into new technologies and new experiences.

Skeuomorphism is a positive force within design, it teaches new interfaces in the same way that children learn: if ‘a’ means ‘b’ in ‘c’ situation, then in all probability ‘a’ means ‘b’ in ‘d’ situation. Imagine a world in which the cold faucet in the bathroom was colored blue and the cool cycle on a washing machine was colored orange — skeuomorphism accelerates communication.

What then is the problem with skeuomorphism and why are so many people keen to reject it? The answer is twofold. Firstly, people rarely reject skeuomorphism, what they reject is lazy design and superfluous decoration; secondly, as with most design techniques, if users notice it you’re overdoing it.

So it’s wise to drop the bevels and drop shadows if they’re drawing attention to themselves, but be aware that everything you design on screen uses skeuomorphism to some degree.

As is so often the case, don’t blame skeuomorphism, blame the designer who over uses it.

Is flat design the antithesis of skeuomorphism? Does skeuomorphism still have a role to play in web design? Let us know your opinions in the comments.

Featured image/thumbnail, skeuomorphic button image via Shutterstock.

WDD Staff

WDD staff are proud to be able to bring you this daily blog about web design and development. If there's something you think we should be talking about let us know @DesignerDepot.