Tag Archives: flat design

Skeuominimalism: Ending the Debate?

Edward Sanchez has written an article to end the debate between flat design vs skeuomorphism.

It makes a lot of sense.

He notes the undeniably advantage of skeuomorphism – “There is validity to a skeuomorphic approach. To create any good interface, it is essential for the designer to understand the cognitive models that a user brings to any new product”.

Drawing cues from Donald A. Norman’s “Design of Everyday Things”, Edward notes that it is important for designers to consider the common affordances that we humans are familiar with – “switches” that are meant to be flipped, “buttons” that are meant to be pressed.

In contrast, flat design can be visually stunning at a low development cost. Typography and layout do most of the heavy lifting, loading times decrease and responsive design becomes much easier. Yet, flat design carried out too far affects the usability of design.

Edward suggests the merger of these two design trends – taking the inherent usability of skeuomorphism and slapping on a minimalistic design. He calls it skeuominimalism.

“Skeuominimalistic design is simplified up to the point where simplification does not affect usability. And its skeuomorphic affordances are maximised up to the point where it does not affect the simple beauty of minimalism.”

Indeed – i mentioned the idea of using abstracted versions of these affordances in order to fit into the flat design trend in my earlier post here.

Let’s not go all crazy with new design trends and forget that we are design for humans eh?



What Happened to Skeuomorphism?

The debate between skeuomorphism vs flat design is always somewhat associated with the battle between Apple vs Microsoft, with Apple embracing the former for the initial iterations of iOS interfaces and Microsoft adopting the latter for Win 8 designs.

And with iOS7 going flat, it seemed as though Apple had raised the white flag on skeuomorphism.

But what actually is skeuomorphism? And what were its flaws?

This article gives us some really interesting clues on this. I’m not going to spend much time discussing flat design here since it’s pretty much the flavour of the moment in design worlds now, but rather, let’s understand skeuomorphism.

Skeuomorphism, in essence, describes the way designs borrow a particular feature of the past, even when the functional need of it is gone.

Case in point, the ‘clicking’ sound of cameras used to originate from actual mechanism – yet phone cameras have appropriated this sound in their own iterations.

Likewise, switches can be flicked up or down – and certain toggle buttons on interfaces cater for this as well.

The interesting point to note here is that skeuomorphism in its purest sense is different from the design trend we commonly ascribe to Apple’s earlier iterations of iOS, which should be more accurately described as a combination of skeuomorphism and visual realism.

Taking the calculator app as an example, skeuomorphism influences the placement of the buttons as referencing the traditional calculator, whereas visual realism skins the buttons in a way that gives the buttons dimensionality.

The article mentions that of course, these two design elements usually go hand in hand — skeuomorphic designs tend to look realistic (to make the connection with the original object clear), and realistic designs tend to be skeuomorphic (otherwise the realism would look out of place). It also notes that whilst realism only contends with superficial skinning and textures, skeuomorphism influences design at a deeper, more functional level. 

Now, we can’t discuss the decline of skeuomorphic and realistic designs without talking about what replaced it – flat and minimalistic design. Flat design counters visual realism by removing the shadows, highlights, gradients and textures, in essence, removing what made things “real”. But in doing so, it unfortunately also removed the skeuomorphic element of the designs – buttons could be confused as banners and the like. The resultant design is clean and professional looking, but an overuse of flat design could seriously thwart the usability of interfaces.

So what were the problems of skeuomorphic designs?

1. (the silly reason) Realistic designs rendering leather-y and wooden textures lost their appeal with people – it quickly became kitsch. Such rendering also faced issues with the advent of responsive design – resizing and shape-shifting made it difficult for fixed-size assets (used to skin the textures) to be used. 

2. (the more sensible reason) Skeuomorphic design needs to inherit all design elements of its predecessors in order to make sense. This led to two issues:

a. When not all the elements could be implemented, the realism illusion breaks and people are left even more confused or unsatisfied. Consider an app rendered in the form of a book but could not allow virtual pages to be flipped. =(

b. Inheriting all design elements meant inheriting the good AND bad and previous constraints associated with the previous design. The iOS calculator only allowed a single line display of characters even though functionally it could possibly calculate more.

So the hey-days of skeuomorphic and realistic designs seem to be over. But nowadays designers can fall into the trap of making designs so flat they lose all usability cues. Which is kind of a step back. I’ve always disagreed with Win 8 apps in particular because you never know what to press.

I think successful design in the flat-design era is one that abstracts realistic/skeuomorphic gestures whilst adhering to the flat/minimalist visual aesthetic. I suppose that is what the article cites of skeuominimalist. One good example i think is how articles now can be swiped from right to left to move forward, and left to right to move backward – abstracting the flipping of pages from books. I think this abstraction frees skeuomorphism from the gaudy realistic textures and also from inheriting unnecessary “baggage” from previous poor designs.