Pros and Cons of Flat Design
:: By Lori Wagoner, Ink Colour ::
All those who believe that beauty lies in the simplicity of things probably knew that simple things need not necessarily be dull, ordinary or average. If you look at a user interface (UI) with a flat design, you’ll know that simple is anything but mediocre. This UI has taken website and mobile design by storm in recent times.
Flat design is everything that skeuomorphism isn’t. When it comes to UI, flat designs have been pronounced as the current big thing, what with designers and users wanting to see more of the colorful, crisp, no-nonsense and user-friendly interfaces that these designs typically lead to.
As opposed to skeuomorphism, a flat design is two-dimensional and makes use of simple icons or tiles and an extensive gamut of colors to create the required minimalist Web page. The idea behind a flat design is to keep the site as fast, uncomplicated and clutter-free as possible, thereby making it easy to maintain and to use.
(Image credit: http://www.pinterest.com/pin/26036504069626996/)
Refer to iOS7, Instagram, Etch and Windows 8 and you’ll see flat designs at work. Despite being simplistic and minimalistic, this design has managed to break through the drop shadows, gradients, heaviness and complexities of the skeuomorphic designs and grabbed everyone’s attention.
While one cannot deny that flat design has become all the rage and does extend a neat, clean and aesthetic appeal to a Web page, one also needs to take into consideration the pitfalls of this UI.
In this post, we take a look at the pros and cons of flat design.
Coolest Design Trend
→ Flat design is catching on quickly and turning out to be the preferred design trend for Web pages as well as mobile operating systems like the iOS and Windows 8. It provides a good break from the clutter of skeuomorphism as it is fresh and bare. It has attracted a lot of positive attention from website interface designers, bloggers, app developers and social influencers.
→ Yes, flat design is the hottest UI trend currently, but what remains to be seen is for how long it can keep our imagination engaged. Thanks to the fast-evolving technology, something newer and better is always coming up which makes the sustainability factor of the flat design questionable.
(Image credit: http://www.pinterest.com/pin/219057969348654781/)
Simpler User Interface
→ In a flat UI, you see all your icons/buttons simply laid out next to each other in a format that’s predictable and hence less complicated, requiring minimum scrolling. The links look like flat buttons devoid of any embossing, sometimes with an arrow attached to them. Intuitive graphics are also used as icons to simplify things even further, for example, a house icon is used to depict the homepage.
→ Due to the lack of definition of the icons and the minimal information density in this UI, some users might not be comfortable using it or may take time in familiarizing themselves with it. It is a known fact that when Windows 8 was first released to the public, the users (although appreciative of the new look) did take a long time adjusting to the new interface, particularly with the absence of the standard ‘Start’ or Windows icon on the bottom left of the screen. In other words, it might be difficult for some users to determine where to click.
→ A flat design UI makes use of a wide variety of bright and bold colors to look attractive, and engaging. The colors also work as a guide to indicate the various icons and links for the users. The use of contrasting colors provides a welcome change from the select few archetypal Web-safe colors and makes the UI exciting.
→ Involving the use of several colors may make it difficult for Web designers to match them appropriately. Contrasting colors may not necessarily work well together for all websites as when it comes to creating a color palette with many different colors, one needs to consider aspects like color saturation, brightness and contrast before putting them together. Consistency should be compromised just to create a good-looking website.
(Image credit: http://www.pinterest.com/pin/482518547546856018/)
→ Since flat design is so simple, the proper use of typography is important here. It is crucial to choose the right typography by focusing on matching the tone of the fonts with the design theme in general. Simple and clean fonts look great within a flat design as opposed to decorative font styles, which would just look mismatched. Sensible typography can enhance the overall look of the design. Elements such as 3D shadows and embellishments in fonts are a strict no-no.
→ Finding the right fit is crucial here and hence choosing the wrong typography can completely ruin the design. Trying to pit a flat design and ultra-bold font together can spell disaster for the overall look of the website. Hence, one can say that scope for decoration is limited or non-existent in flat design. Additionally, incorrect usage or words, misspellings and inappropriate text can stick out like sore thumbs.
→ In a flat design, it is imperative to have clean and sharp user interface. The icons/buttons, lines and shapes need to have a minimalist look and feel to them, which make it easy for the users to use the interface. Buttons and other UI elements are made using shapes with basic contouring for corners or edges, in some cases. For example, the home icon on a website may be displayed with a square or rounded box with a house-like icon inside.
→ One of the disadvantages of a flat design is that the interface can look overly simple. Skeuomorphism loyalists are of the opinion that features such as a bold underline or a shadow around a button adds practicality to make the interface user-friendly and easy to comprehend.
(Image credit: http://www.pinterest.com/pin/158400111866661316/)
What Message Do You Want to Send?
Whether you choose a flat design or go for skeuomorphism for your project, you need to pick a UI based on the look, feel and tone you want to convey through your content. Although flat design is “in” currently, it might not be perfect for all projects. The level of usability and functionality differs and the design can be chosen based on particular needs.
Lori Wagoner is the Web Community Manager for Ink Colour, a prominent printing equipment retailer in the UK. Lori has blogged at Tweak Your Biz, Get Entrepreneurial and many other business and tech blogs. You can reach her @LoriDWagoner on Twitter.