6 minutes

Skeuomorphic vs Digital interfaces and what will 2013 bring us

17 Comments

We’re well into 2013 already, but now that 2012 is gone, it’s the time to talk about one of the biggest trends in web and user interface design of the past year, and also one of the most loved and hated one, the Skeuomorphic interface.

2012, the year of Skeuomorphic

2012 was specially prolific in mobile and web applications, and with them, several skeuomorphic interfaces were designed and launched, one of the most talked about were the redesigns made by Apple, because of the so harsh transition from their previous digital aqua interface to a completely skeuomorphic skin, and how that created such controversy .

Apple calendar

Skeumorphic is defined as “an element of design or structure that serves little or no purpose in the artifact fashioned from the new material but was essential to the object made from the original material”. A clear example of that is the textures used in skeumorphic interfaces, or even the flip page animation in iBooks, elements and behaviors that are not needed but are maintained to keep a link with the original element, in this case the book.

Reactions of the design community belong on two completely opposite sides, people would either love these interfaces or hate them, there was no middle term in between. Those apps were loved and downloaded by hundreds and millions of users, and hated by as many too. John Gruber wrote a great post about this trend and how it affected the user interface design.

ibooks

The good about skeuomorphic

Skeuomorphic interfaces have been said to be condescending to the user, because the user feels that the application assumes the user ignorance and the need for a digital replica of a daily used object to explain how he will interact with the interface, but hate it as you want, skeuomorphic has its place in the interfaces world.

Audio software such as Propellerhead Reason have been skeuomorphic from day one, and this example serves to show the main advantage of these kind of interfaces, the direct connection between digital interface and analog interface, and in this case it makes sense.

Impress your audience with animated websites and web presentations.

With Slides, we don’t make you start from an empty slate. All you have to do is to pick the elements you like best and combine them. Each slide has been carefully crafted to satisfy three key criteria: aesthetic, function and usability. That way you know every element works together seamlessly while enhancing the impact of your content.

Create a Website

If you’re an audio professional, you probably know exactly everything these cables and buttons and knobs do, and if you don’t and you do learn all that in the software, when faced with a physical mixing table and hardware, you’ll probably know your way around easily after that. So the main positive things about these interfaces are the inherent ease of use, when applied to an already known kind of product, the attention to detail in design, which made the users really attracted by how much detail and care was into every single detail, and the overall richer visual experience when using such interfaces.

The bad about skeuomorphic

Truth be told, most interfaces that went skeuomorph last year didn’t really made a real use of this, and were designed and developed just to stick to a visual trend and win the users by beautifying the interface with shadows and textures.

On the usability side, skeuomorphic interfaces sometimes hinders the use of a product, because by simulating the real and original object, it will end up creating a harder to use interface, adding more clicks and/or menus in between actions, instead of just using newer and better interactions such as gestures. And the biggest disadvantage of sticking to the traditional interface is the fact that it limits the design to replicate something that already exists, not letting the designer to free himself to create and develop new interfaces and paradigms of use.

2013, the year of Flat Design

In all honesty, the original intention of this article was to somehow predict that 2013 would be a year of digital interfaces, but the community and the trend have spoken  already and this prediction is now more of a fact. The fact that the skeuomorph was so heavy, made it desirable and sexy for some time and tiring and old after a while, and with the launch and development of Metro interface from Windows 8, Clear innovative interface, this year will be definitely more focused on creating Flatter, simpler and more digital experiences.

The other end of the skeuomorphic is this simpler and digital interfaces that have been called around the design community as Flat UI or Flat Design, even though some already are trying to change this name to a better one. This look is heavily influenced by Xbox 360 dashboard, Windows 8 and Windows Phone 7, because these were products that invested a lot in these interfaces and had great success with them. Clearapp was also one of the kings of Flat Design in 2012, and was extremely successful due to their gesture-based interface, having no ornaments and no elements besides the essential ones.

You can find all about Flat Design and great examples and inspiration right here in Designmodo. But the reality is that Flat Design is most likely, such as Skeuomorph, a temporary and passing trend.

The almost Flat Design

During 2013, Flat Design will influence the designers to think more about digital interfaces, but in the end this isn’t a solution or a formula that can be applied to any interface to make it great. Matthew Moore has written a great article about this where he talks about an “almost flat design”, a middle ground between the two approaches, where the interface isn’t limited by a trend but instead by focusing on creating a usable and light interface, giving focus on the elements that need it most, and laying out the content in a light and readable way.

The example Matthew gives as a good player in this middle ground is Google, that in the last couple of months/years redesigned pretty much its whole experience in web and mobile, creating simple and flat color interfaces, but not sticking to a flat mindset, instead using bevels and light shadows where they are really needed.

gmail ios

So, what now?

In the end, it all comes down to a design and visual choice of the designer.

Last year I had the chance to design a mobile tourist guide, and used a skeuomorphic approach, since the focus was on developing an interface that would resemble as much as possible an old book (that was the origin of the tourist guides) and to create a personal relation between the user and the interface. This decision was made after being told that a book could never be replaced by an application, because the whole experience of handling a book, touching the cover and the pages, smelling the paper and even the way that a book degrades and crumbles with the passing of time and usage.

So the focus was to create something that appealed to those senses visually, using the textures that one could find in its analog counterparts, even though you can’t replicate the smell and the texture, the visuals were there and the emotional connection of the user with the interface was a bit better due to these details.

Skeuomorphic guide

All in all a conclusion of studying both of these approaches is to not “follow” a trend. A trend is what it is, a passing fad that influences designers and interfaces to follow a specific look and feel, but when designing an interface, the designer should develop a look that is more adequate to the intent of the application, and is one of the beliefs of the community.

António Pratas

I'm an Interactive and Web/Mobile Designer who also writes code for the web. Co-founder and designer at unplu.gg, I sometimes also write at antoniopratas.com. You can follow me on twitter at @antoniopratas.

Posts by António Pratas
Cookie Icon
We use cookies to ensure that we give you the best experience on our website.
  • I disagree
  • I agree