On Surface and Screens


Printed designs have a tactile surface that is not present when that same design is delivered via a screen. Is this absence significant? Should we be concerned by the current trend for ‘flattening’ screen interfaces?

Letterpress print

Image Source: Kathryn Rotondo


Bret Victor in his ‘Brief Rant on the Future of Interaction Design‘ hinted at the issue, describing current projected visions as “pictures under glass” with more than a hint of exasperation.

A Glassy iPad

Image Source: Michael Ocampo


Yet illustrator Katherina Manolessou made an insightful remark to me about this last year. She pointed out that the majority of mass-produced magazines and picture books were also printed on fairly surfaceless ‘glossy’ paper stock. There are clear parallels between this, and how images come to be presented on screen, she argued.

A Glossy Book

Image Source: Martin Wichary


Creating a sense of surface texture within interface design isn’t terribly fashionable right now. Microsoft wholeheartedly embraced the surface-less aesthetic with the ‘Metro’ UI for Windows 8, often displayed on their (ironically titled?) new tablet, which consists largely of white icons and text set against flat blocks of colour. This approach makes the virtual nature of the UI design explicit. It is not pretending to represent anything other than what it is; a screen-based paradigm with no physical characteristics. And a fish…

Windows 8 Launch Screen

This may have been a conscious decision by Microsoft to place themselves in opposition to Apple’s increased use of skeuomorphism within the interface design of many of their iOS and OS X apps. It was perhaps one of the boldest design decisions made in the history of the company. So much so, that in a reversal of the usual dynamic, Apple appears to have taken it’s lead from Microsoft when devising the new look for iOS7.


Apple, whose origins are intrinsically linked with the first commercially available graphic user interface, had previously championed the use of visual metaphor as a way of making the unfamiliar familiar (and therefore friendly and intuitive) since day one. Many argued that earlier iOS examples pushed this logic into uncomfortably decorative realms. Faux stitched leather, green felting and a podcast app that depicted a Stazi-esque reel-to-reel recorder, all became points of derision.

iOS6 Gamecenter Icon

The redefining of Jonathan Ive’s role to include UI as well as industrial design has lead to the streamlining of some of these approaches. But making UIs allude to familiar and physical objects is still an integral part of Apple’s design philosophy and the use of metaphor is still apparent in the appearance of iOS7’s icons and that shifty parallax effect.

Both the ‘skeuomorphic’ and ‘flat’ design trends are extremes. Both can be appropriate in certain circumstances, and fail in others, depending on what needs to be communicated to the user. They exist at either end of a sliding scale of visual representation; from the figurative to the abstract, and certainly aren’t the only two options available.

Let’s return to the physical world for a moment. Printed designs exist in ambient lighting conditions – even a plain sheet of paper, or those glossy books mentioned earlier, will have subtle tonal differences as they reflect light that strikes them from different sources.

Lighting on a printed page

Image Source: Thad Zajdowicz


We are conditioned to expect objects to have these characteristics which is why purely ‘flat’ designs can sometimes look a bit cold and artificial (I think the designers of iOS7 saw this, hence the slightly hurried gradients and layered blurring effects). Yet if designers overtly try to simulate real surfaces or objects, we aren’t fooled, we know they are fake and struggle to take them seriously.

So it becomes a question of balance. With the use of subtle lighting and textures, screen designs can include some of the qualities that we come to expect from real-world items. But by abstracting, honing, removing redundancy, we can ensure that those same designs remain true to their nature; being the representation of ideas, rather than unconvincing simulations.

The MightyMeta logo with and without lighting effects

I don’t want to live in a purely flat world. Do you?

If you enjoyed this article, please consider sharing it using the above buttons, leaving a comment or subscribing to the RSS feed.

Warning: count(): Parameter must be an array or an object that implements Countable in /homepages/34/d210046418/htdocs/wp-includes/class-wp-comment-query.php on line 405

Leave a Reply

Required fields are marked *.

MightyMeta, 8 St Lawrence Lane, Ashburton, Devon, UK, TQ13 7DD

Powered by WordPress | Theme Derived From "Yoko" by by Elmastudio

Scroll To Top