In 2013, flat design became the newest trend. The idea behind this concept is to focus on function rather than form. Reducing visual noise and putting the focus on content is meant to improve the user experience. The idea is to eliminate distractions and focus on links and navigation. So who is using this, why and is it a trend that’s going to stick?
What Makes a Design Flat?
Flat design is meant to be a two dimensional rather than a 3D look. This minimalist approach focuses on typography and vibrant colors. The main characteristics of a flat design are
- Simple buttons and icons for the user interface
- A focus on typography
- A focus on color
- Fewer distractions:
- Fewer buttons
- Vibrant colors and high color contrasts
- Fewer gradients
- Straighter lines and corners
- No added Effects (shadows, bevels and textures)
- 2-Dimensional icons and images
What are the Benefits of Flat Design?
Flat design can be found in most areas of graphic design including icons, mobile apps and websites. It loads faster on mobile devices and desktops while removing distractions from the user experience.
Let’s take a look at a couple of websites to see flat design in action.
Flickr.com uses white text on a dark background to highlight the features of their site. To focus the attention on their calls to action, for example the “Sign up for Flickr” button, they use a bright pink color. When a user mouses over the clickable links (Biggr, Spectaculr, Wherevr, Forever and Sign In), they too turn bright pink.
Dropbox.com keeps their imagery very simple. The only three clickable links on the page are to sign up, sign in or learn more. That’s it.
The home page of Mailchimp.com includes their navigation menu and imagery. The only options that users have are to click on a menu item (Home, Pricing, Support, Blog, More), sign up or log in. The only clickable image is for their call to action – their “Sign Up Free” button. The image that makes up the rest of the page can’t be clicked on.
What Is Almost Flat Design?
While flat design works well on mobile devices, many graphic designers are leaning to a style that takes some of the flat design principles (such as flat color and no drop shadows) and combines that with buttons that have enough gradient to make a user want to click on it. In his article, “Almost” Flat Design, Matthew Moore explains the subtle differences and points out that Google Maps and Gmail are both excellent examples of what is referred to as almost flat design.
Is Flat Design Right for Your Business?
In Dissecting the Flat Design Trend, Allison Howen (Associate Editor of Website Magazine) says that “it puts the focus on content, which leads to a better ROI“. Allison goes on to say that “early testing found that they [flat icons] foster 49 percent more clicks”. She also stresses the importance of conducting user experience testing to discover which elements yield positive results for your business (ie: clicks/conversions).
While I tried to find some case studies and documented stats on the impact a flat design can have for a business, I pretty much came up empty handed. (If you know of any resources that I can share, please let me know and I’ll update this article.) So, while it’s a trend, the verdict is still out as to whether companies should embrace this style for their websites. While for mobile apps, it’s becoming the standard.
Meanwhile, if you’re looking for some flat design inspiration, you can read 25 Incredible Examples of Flat Design.
What Does This Mean to You?
Have you been following the “flat design” trend? Do you think this is something that would be a good fit for your business? Have you introduced simpler elements into your website design such as flat icons? We’d all like to know your thoughts and ideas about this.