Our Blog

We like sharing about design, technology, marketing & occasionally fun stuff.
Don't miss a beat by subscribing to our RSS feed.

Forward > Blog > Skeuomorphism or Flat Design?
posted by Ryan Magallanes

Skeuomorphism or Flat Design?

25 July 2013

Skeuomorphism or Flat Design - Forward Solutions

Design serves as the face of a product. In terms of web design, mobile applications or simply computer graphic design, two design principles stand out: Skeuomorphism and Flat Design. Usually, design trends and styles are considered temporary because there is no guarantee that a particular style will stick around for a long time. But both are widely used in the realm of graphic design especially in websites and mobile applications; despite the fact that many are still not aware of their meaning and some even consider them foreign. But before we explore the depths of both terms, let us first look at their definitions.

Skeuomorphism comes from its root word “skeuomorph” which Wikipedia defines as a derivative object that retains ornamental design cues to a structure that were necessary in the original. In layman’s terms, skeuomorphism is simply a design based on its original, practical structure. For example, the notepad software available in Apple Operating Systems is made to look similar to a real notepad. It is like resembling an object or something that is already familiar to us. However, skeuomorphism does not really have to be always creating a replica of an object; realistic designs are examples of skeuomorphism but the term skeuomorphism is not always synonymous to realistic design.

Flat Design, on the other hand, is the stripped down version of a skeuomorph object. It does not involve realistic elements; no gradients, shadows, texture, nor 3D effects. In other words, it embodies the terminolgy itself: flat.

Many established brands have embraced Flat Design such as Google and Microsoft. If you notice their designs, they simply emphasize on a strong identity based on their approved guidelines. On the other hand, Apple is known as a big fan of skeuomorphism. It is obvious in the designs of their computers and mobile phones that the icons resemble real life objects; and this is due to the influence of Steve Jobs; who believed that the use of computers should be relatively simple, in that a novice can operate the machine with the use of basic instinct alone. In contrast to Apple, it is very evident that Microsoft fully embraced flat design when they launched Windows 8 in the last quarter of 2012. An opposite shift is expected from Apple; as they are set to launch the final version of iOS 7 later this year; showing design from skeuomorphism to flat. It seems that skeuomorphism is being left out of the designers’ lunch box in recent years as Microsoft and Apple are baring apparent swings in their design approaches.

Does this mean that Flat Design is winning the battle over the other?

While design is an integral part of a product especially with computers, cellphones, websites, among others, one of the problems designers face today is that their designs should make the user “feel good” while using it. User experience is still the priority particularly in building a good, functional website because it will carry your brand’s name on the World Wide Web. To make a mark on the online scene, your design must be notable, one that would be associated with your brand at first sight.

It is also a matter of taste for the users as one may prefer realistic objects over flat ones and vice versa, or some may enjoy a mixture of both. The two styles both have their strengths and weaknesses; so here’s a tip you can keep before we end this article: choose a style you are most comfortable with or one that suits your product, and design it the best way you can. Designers especially those with expertise in websites should learn how to embrace the differences of both styles and select which one best strengthens the site or application and which style matches the concept or theme.

Comment/s

no responses to
"Skeuomorphism or Flat Design?"

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>