Luke Andrews

Flat interface style in the retina age

21 January 2013

Marc Edwards offers a useful tonic to John Gruber’s idea that the so-called “flat” interface style is catching on because of high-resolution displays. Print may generally be a high-resolution medium, but any screen designer who’s tried to print bright blue on a CMYK printer knows that screen design can’t just “look to the history of print design”. As Edwards says, “Print design looks like print design, because there is no other choice.” On the screen, we have a choice.

Like Edwards I think the overuse of shadows, transparency effects and faux-gloss of modern screen design exists in part because we have the hardware to render it easily and quickly. Give a kid a crayon and some paper, and they will eventually start writing on the wall. When I first installed OS X, I could scarcely believe my 2000 G4 Mac was powerful enough to do all the anti-aliasing and compositing necessary to render the smooth type and drop shadows the interface demanded. Well, it wasn’t really powerful enough, but my next computer was, and so was the 2007 iPhone. Freed from the embarrassment of cartoon drop shadows and thick, forgettable bevels, designers naturally responded by embracing these more lifelike effects.

And isn’t that what it’s about, really? An attempt to breathe life into the cold, clinical screen? Physical materials cast shadows, reflect light, have texture and color variation. They have round corners. Solid, textureless colors — the ones computers are best at showing us — are as unnatural as square eggs, and I believe as humans we respond more sympathetically to things that reflect the world around us. An old trick for choosing complementary colors is to pluck some out of a photo of a nature scene — because either nature has a way of avoiding clashing palettes, or because we’re just psychologically programmed to find “natural” colors harmonious.

Still, as with all style in all things, there’s bound to be excess. If you watch movies from the late 1970s and early 1980s, you notice that synthesizers dominate the scores, often to the point of distraction. By the mid-80s, they basically ruined rock music, and it took another few years before grunge came along and basically banned synths entirely. Now we’ve achieved a healthier balance: it’s okay to use electronic keyboards in your rock song as long as you don’t go all Starship with them.

I can’t bring myself to utter the S word, but simulating physical things with digital things may have had its Starship moment with, well, “We Built This Calendar”. Does that make Windows 8 “Come As UI Are”? (Okay, I’ll stop.) Android UI is more like post-modern architecture — the Sony Tower perhaps, a forgettable building that tries to echo the past. Windows Phone is Farnsworth House, no ornament, but maybe missing some fundamental parts like walls. The point is: screen designers, like composers and architects, will play with style, some skillfully adapting the past to the present, or one medium to another, while others reject any artifice or false note, and the great majority follow trends. Mies van der Rohe inspired countless architects, but that doesn’t mean that every dour, modernist building is a success. We would be equally foolish as designers to think that a “flat” trend would mean the UI world was all restrained to perfection — for every Letterpress, there will be a Windows 8 settings menu where someone takes the concept too far and important context is lost.

There’s no doubt that the practice of software interface design will benefit enormously from the high-resolution screens now available. For example, I expect screen designers to take more chances with type now that good typefaces look good, and Typekit et al make it possible to use them. But I don’t expect shadows or gloss to go away. It’s true, as Gruber says, that print designs tend not to benefit from drop shadows or glossy effects added in Photoshop, but that’s because print already gets them for free — they’re part of the paper, and the choice of paper is a big part of the practice of print design. Magazines are printed on glossy paper because blacks look blacker, colors more vibrant. Occasionally, there will be something like The Believer to show how one can do it differently, and a few others will follow, but there has been no matte-finish magazine revolt. Likewise, I hope the current flat trend breathes some restraint into the digital medium, but as long as we’re still clicking and tapping pretend “buttons”, the artifice still serves a purpose. Before we can graduate out of simulated real-world lighting, we’ll have to graduate out of simulated real-world objects.