Web Design Trend: Flat Design

Posted in Design

Flat design has been around for a while, but with more and more websites showcasing this type of design, flat design has become a very popular and trendy user-interface design style over the last couple of years. Microsoft was one of the first companies to introduce this style with their mobile interfaces. And now they use it with Windows 8 as well. Google also showcases flat design on all their sites.

What exactly is flat design?

With its minimalistic approach and clean, open structure, this style is very user-centric and focuses on easy usability, as well as easy readability of content. Flat design removes unnecessary distractions and gets to the point quickly.

Another great thing about flat design is that it works well on mobile as well as desktop devices, which is what you want to aim for with responsive web design.

The Don’ts

Simplicity is key. Flat design does not include any complicated or detailed illustrations, patterns, gradients or heavy shadowing. Keep it as clutter free as possible. Flat design does not include three-dimensional elements either.

The Do’s

  • Flat design focuses on bright colours, big, solid elements and typography.
  • Different variations of one font-type is the way to go. One specialty font can be used to add a bit of artistic flare, but keep it simple.
  • Fonts should be big and bold, with efficient wording. Along with clean, open spaces, this helps the user to focus on the purpose of the website, which can be a call-to-action or important content.
  • Illustrations and icons are two-dimensional with no or very subtle shadowing and highlighting.
  • Simple photography can add some natural depth to flat design.

See it in action!

I recently built a website for WayWithWords. Feel free to test the site for responsiveness! It features stunning banners in a flat design style. These banners were done by Tanya Geel, a very talented designer and friend of mine.

WayWithWords-screenshot

Here are some other examples of websites using flat design:

Aubrey Johnson

aubrey-johnson

Theme Armada

theme-armada

Benjamin Vilain

benjamin-vilain

Hylla en kompis

hylla-en-kompis

Bright Byte

brightbyte

InVision

invisionapp

TriplAgent

triplagent

As you can see, flat design allows you to create a beautiful, user-friendly website that can scale down to any size. What more do you need? For more flat design inspiration, visit my Pinterest board!