‘Material honesty’

Kevin Goldman's fine piece on A List Apart the other day is further evidence of the growing consensus that a radically simple, 'honest' design style is best suited to the medium of the web.

In Material Honesty on the Web Kevin rounds up and comments upon some of the best thinking of recent months on the 'flat' versus 'skeuomorphic' debate.

To summarise, flat designs consist of fundamental geometric shapes, simple colour schemes, legible typefaces, logical grids, and clear photography. Skeuomorphic designs are - to a greater or lesser extent - imitative of real world objects, embedding analogue design elements within a digital medium.

My reading of Kevin's article, and the other posts I've read on the subject, is that there two arguments for flat design:

The first is pragmatic. It is quite straightforward to develop flat designs purely within the bounds of the design languages native to modern web browsers: HTML, CSS and JavaScript. Used wisely these can be relied upon to guarantee consistent results on a wide range of browsing devices, from mobile to desktop. There's no need to import slow loading 'foreign' design elements such as large bitmaps or Flash animations.

The second argument, and this isn't always acknowledged, is subjective aesthetic preference. Flat design elements are perceived as being true to the digital medium. Clean lines, simple shapes, simple palettes, ordered grids and sans-serif typefaces are consistent with the functional modernist aesthetic that has been associated with digital technology for the past 60 years. By comparison skeuomorphism, with its organic background textures and ornamental typography, seems kitsch.

I'm something of an unreconstructed 'flatlander'. I think it's much better to use native browser technologies to develop reliable, speedy, responsive interfaces than to try to stitch something together with big bitmaps, grunge patterns and script fonts (I'm being somewhat unkind). Flat design evokes the golden era of modernism, which, in my book, attained its classic expression through the International Typographic Style.

Beyond the web

The flat/skeuomorphic debate is raging well beyond the world of web design. With the rather beautiful Windows 8 Microsoft has shifted the visual grammar of its user interfaces towards a flat aesthetic. And recent managerial changes within Apple suggest that the discord between the classic simplicity of the company's hardware and the textured complexity of some of their software offerings is under review.

Promising developments indeed. These days I permit myself to veer very close to flat design fundamentalism, the gloriously dogmatic assertion that there's really no place in user interface design for any kind of skeumorphism. Here, perhaps, is a realm where the modernist dream of logic, order, clarity and simplicity can at last be realised.

An exception?

And yet. There's one software application I use a lot which is shamelessly skeuomorphic, and, dare I whisper it, extremely usable precisely because it realises so well its objective of imitating a real world counterpart.

I'm referring to the digital audio workstation Reason, by Propellerhead Software, one of several software applications that demonstrate the remarkable power of modern high street computers by replicating in digital form all the functionality of a traditional recording studio. Indeed most of these 'DAWs' are considerably more powerful than the hardware they emulate.

Translating the functionality of all those cables, leads, dials, mixing desks and signal indicators to a single computer screen is a formidable user interface challenge. Propellerhead takes the most direct route possible by presenting the various instruments and devices that constitute the Reason studio as a 'virtual rack':

Reason 'virtual rack'

As you can see, the rack components are displayed just as they might be in a real studio. They are stacked on top of each other, and designed to look like their analogue equivalents. But the true extent of the skeuomorphic naughtiness is only apparent when the rack is 'turned round':

The back of the rack

The devices are 'patched' together through virtual representations of the kinds of leads and cables you might see in a real studio, which can be clicked and dragged into the various input and output slots. It gets worse: the devices even have mock fire hazard labels:

Faux fire hazard label

Absolutely disgraceful. But, it pains me to say, it actually works very, very well. This radical adherence to a real world model makes it possible for the user to intuit, quite quickly, just how everything fits together, and how the studio components can be reshuffled and repatched to facilitate different sounds.

I'm forced to accept, then, that it is permissible in unusual circumstances, when faced with the challenge of translating exceptionally complex functionality to the digital medium, to develop a virtual environment that replicates a real world equivalent.

It's interesting to note, though, that even in the world of software studios there's a popular, highly usable alternative to Reason without a skeuomorphic element in sight. Here's the interface of Ableton Live 9:

Ableton Live interface

No virtual cables, drop shadows, brushed steel dials, or fire hazard labels. Just a beautiful, crystal clear, wholly flat interface:

Ableton dials

Ableton Live does require a little getting used to, as all the visual cues referring to a real world studio have been removed. But only a little getting used to: a couple of days in and it all makes sense.

It seems to me that while Ableton, at present, is no more usable than Reason, the former is better placed to realise future developments in electronic music than the latter. Reason's strength consists in its taking advantage of the mental models we retain from familiarity with physical electronic instruments. But those models are becoming less useful as advances in music technology become ever more concentrated in a purely digital realm, with no analogue equivalents. How useful will Reason's virtual rack be as more and more of the real world objects that inspired it become obsolete, or never existed in the first place, having been designed purely and simply as software?

Not just an issue for Reason, I suspect, but for all skeuomorphic interfaces in an increasingly digital world.