261% More Sales Thanks to Minimalism: 3 Case Studies on Optimizing Conversions with Flat Design

• Flat design is minimalistic, content-centric, mobile-focused, and the opposite of skeumorphism (which is based on realistic-looking objects and textures).
• A European e-commerce platform boosted their sales by 35.81% after they replaced their Order button with a flat one.
• Underwater Audio boosted their conversion rate by 261% with a flat design for their home page.

Everyone (and their grandma) who works in web design Singapore touts the benefits of flat design. It is, by far, the biggest and most buzzworthy trend in User Interface/User eXperience design.

But what is flat design? Why should you care about it? And how can it actually make a positive impact on your bottom line?

We explore all this, plus 3 self-evident case studies that prove flat design can actually boost conversions by a large margin, in today’s post.

What is flat design?

Simply put, flat design is about bi-dimensional (flat) images and a minimalistic style. Flat design most often makes use of sans-serif fonts, which don’t use the small lines at the end of letter lines. And, perhaps most importantly,

Flat design puts content first.

The opposite of flat design is skeumorphism, a practice in which the objects designed are supposed to look as life-like as possible. To this end, skeumorphism makes use of drop shadows, gradients, and textures.

Initially, flat design was aimed at mobile apps and site versions. And while still mobile-centred, flat design has evolved over the past few years.

Today, the world’s biggest websites, from Google to Apple to Skype and CrazyEgg, work with flat design 2.0, which still aims for simple shapes and stark contrasts, but also adds in layers, plus a subtle dose of drop shadows into the mix, making designs gain in terms of depth.

Image source: Dapper Gentlemen

What are the benefits of flat design?

Since content gets to shine when highlighted by flat design, you can expect this practice to come with a slew of benefits and advantages. Here are the 5 main ones we could identify, with the help of our web design Singapore experts:

·         Flat design improves readability

No more complex images: just typography (in sans-serif), a unitary, contrasting background colour, and minimalistic icons. It’s easy to focus on the text and equally easy to drive any point home to them, through straightforward graphic presentations.

·         Flat design decreases page load time

Did you know that users expect pages to load in no more than 2 seconds?

With no skeumophic elements to load, pages are able to move faster. Most pages with flat design are based on vector and code-based graphics. And, in changing the typeface in its logo to a sans-serif one, Google itself stressed the importance of quick load times.

·         Flat design emphasises clutter-free white space

A landing page design that has done away with all the unnecessary trimmings is able to best direct the visitors’ attention to where it should be: on the product information and Call To Action buttons. White space is the single sure-fire way to achieve this kind of focus—and makes it simple to achieve, too!

·         Flat design boosts SERPs

The faster your page loads, the more chances it has to rank high in the SERPs and boost conversions through attracting high-intent users. Pro tip: Google is piloting a feature that will alert its users on whether a site is slow to load.

Image source: VWO

3 flat design case studies

1.      The Windows 8 fail

When done wrong, flat design can actually cause problems, as revealed by The NN Group’s usability test for Windows 8 actionable icons. Many users confessed to not knowing where exactly they can click and being confused by the lack of clear separation between icons.

The Metro-style user interface, which had been designed for mobile screens, and actually looked great on them, wasn’t working for a non-touchscreen surface. The usability test showed that several of the 12 experienced PC users involved in the test had problems with the design featured below.

Image source: The Norman Nielsen Group

2.      Flat buttons can lead to 35.81% more conversions

The image below comes from a usability test conducted by Unbounce for a European e-commerce platform selling hand-painted porcelain, whose name they did not disclose. A starkly contrasting button, with rounded edges and no drop shadows far outperformed the skeumorphic version with a colour gradient.

This test goes to show that the so-called web design Singapore experts who claim gradients are a must don’t really know what they’re talking about. And bear in mind that the flat button boosted not just click-through rates but actual sales by nearly 36%!

Image source: Unbounce

3.      Minimalism increased sales 3.6x – or by 261%!

Finally, check out this undeniable proof that minimalism and flat designs convert better and ultimately sell more.

Underwater Audio paired a stripped-down, clutter-free variant of their homepage, with their existing design. The flat version has no social proof buttons, as well as no product information and images. And it converted better than the more complicated version by 261%!

Image source: CrazyEgg