Skeuomorph is a word with two Greek bits in. “Morph” we see all the time, and it means “shape”. “Skeuo” means “tool”. So the word means “tool-shape”, but tools are not themselves considered skeuomorphic. An object is skeuomorphic, or has skeuomorphic features, if it has stylistic or design components reminiscent of an earlier necessity.
To what extent are any features in a computer UI skeuomorphic? If a notes application displays a yellow canvas with rules, is that a skeuomorphic aspect of the design, or is it just design? We could say that it is reminiscent of a legal notepad, which is an idea Americans have and those pads are typically yellow. They are typically yellow because they always used to be yellow, and most yellow legal pads that Americans have used have been dyed. A long time ago they would have been yellow because the paper was unbleached. So is yellow legal notepaper skeuomorphic, or just “a design choice”? Is a yellow notes app skeuomorphic, if the thing it is copying did not need to be yellow? If it is not really a tool shape?
Please do not write in, the answer is completely inconsequential. I am interested in the design inheritances that are consequential, where the inherited design tells us how to use something by analogy with something else we know how to use.
Sometimes the things that we need and the things that we do not need are closely connected. We need the instrument cluster in a motor car to give us feedback about the state of the machine. It is usually mounted on the dashboard, which was introduced to stop pebbles and nails kicked up from the horses’ hooves from hitting the driver. We do not particularly need that any more.
The kinds of interface analogies we benefit from in the computer world are analogies. Computer interfaces are completely unlike anything else we use. I mean, some of them are, they do not have to be. A modern motor car’s controls are a computer interface, providing input to the engine control unit, anti-lock brake system, traction control system, and potentially other computers. But the analogue to a pre-computer motor car’s controls is complete. But things like the desktop computer interface and the touch screen phone interface are completely novel, and any analogy we can grasp is useful.
Some of the analogies make sense in isolation, but fall apart when they are combined in one place on a computer. I have windows onto files in folders, said windows all being on top of the wallpaper that is decorating my desktop. I also keep my trash can in a dock on the desktop.
The point of these analogies is not just vestigial reminders of tools that preceded the computer: the only people who previously read my files through a window were my competitors. No, the point is to give affordances: entry points into cognition of the new tool through metaphor with existing, understood concepts. A window is a window in that it shows a view onto a scene (in our case, a document) which may be complete or partial. A folder is a folder in that it is a place where you can group zero or more files.
These ideas of windows, desktops, files and folders are affordances for the kinds of people who had familiarity with the existing objects. The market for personal computers sold by the likes of Commodore, Apple, and IBM in the 1980s was affluent Westerners, typically those in white-collar occupations. They will not have trouble with folders on their desktops, but probably have somebody else to do their typing so may not be comfortable with the QWERTY keyboard.
But the reach of the computer has vastly outstripped the reach of the lifestyle depicted in Mad Men and the Dilbert comic strip. Both in space – people have computers who never had office jobs – and time – people who have office jobs now get computers and do not getpaper filing systems. The affordances of the desktop-and-files metaphor are now the affordances of familiarity, not the affordances of metaphor.
Let me give a different example. I have a digital radio. It receives MPEG layer 2 data streams over the airwaves and lets me choose one of them to decode and listen to. I pick which channel I hear through a rotary knob on the front panel: not as the easiest way to select from hundreds of channels; not as a throwback to the cat’s whisker radiogram from the 1920s; but because that is now the expected user interface for radios. So it is with files and folders.
It is tempting to think that we can do away with these affordances now because nobody uses the original object from which the affordance takes form. Just as the floppy disk is now the “3D-printed save icon”, so the filing cabinet is now the Society for Creative Anachronism’s USB stick. But we have to be careful. These affordances are not only analogies for people new to the computer, they are now increasingly analogies to existing computers for people familiar with the computer.
Innovation in user interface is of course possible, and can be beneficial. The now ubiquitous “pull to refresh” gesture was introduced by Loren Brichter in Tweetie 2.0 over a decade ago. But it also relies on analogy to explain its operation: you are looking at a list of tweets, arranged chronologically (back in the days before The Algorithm) from newest downward. So anything newer than the most recent tweet you can see must involve scrolling up from the top: pull down to see newer things.
If you confuse affordance with skeuomorph then you will throw away useful hints because they look like vestigial anachronisms. A button has bevels both so that it looks like a button on a 1970s transistor radio, and so that it is distinguishable from non-interactive UI. Multicoloured icons increase distinguishability as well as fidelity.
A flat UI becomes an expensive, inflexible sheet of paper, when it can be so much more. Beware of discarding utility in the name of novelty.
Cover photo by Chandan Chaurasia on Unsplash.
