Flat Design 2.0

Flat Design Has Evolved

I'm available for hire!

With more artists adding ornamentation to their flat design work, the style has gradually evolved to something I like to call flat design 2.0 or just Flat 2.0

Flat 2.0 is an evolution, not a revolution. Where flat design was a radical departure from the rampant skeuomorphism of days gone by, flat 2.0 is a playful branch off the flat tree. Flat design is the Christmas tree, Flat 2.0 is the ornaments and candy canes. And presents. No tinsel though, that stuff is a mess to clean up.

Flat Design works very well in a world where users own many devices, and use those devices to access and consume the content we passionately craft for them.

Flat design can be built to dynamically scale to a content-appropriate size much simpler than a pixel-perfect design. Content wants to work on a phone held in landscape mode, a tablet with 2 apps open and snapped on both sides of the screen, a 5K retina monitor, and a thousand other possibilities. Give the content what it wants by breaking out of static based units of measurement. She will love you more for it once the pain of change has passed.

Quietly Introducing Flat 2.0

Flat 2.0 is still flat, he just wants to have a little fun. This isn't a serious black-tie event after all, it's the digital universe! Home to such wonderous creates as Mr. Information Super Highway and Dr. World Wide Web

Flat on the left. Flat2.0 on the right. Flat and Flat2.0

Let's play Spot The Diferences!

Mr. Information Superhighway

(The handsome gentleman with the bowtie)

  • Tophat has a highlight
  • Tophat casts a gradient shadow (polygon to keep the nose lit)
  • Left eye has a dropshadow (polygon 1 color)
  • Freckles have multiple values
  • Bowtie has a multiple value
  • Bowtie casts a gradient shadow

Dr. World Wide Web

(The dapper wizard)

  • Wizard hat casts a gradient shadow (polygon to keep the nose lit)
  • Left eye has a dropshadow (polygon 1 color)
  • Monocle has multiple dropshadows
  • Monocle has a highlight

Flat 2.0 is about subtle changes, a natural evolution to the design. It is not about rebelling against the current trends but about enhancing those trends with simple shapes and gradients.

What Are the Rules?

Art has no rules -Someone Pretentious

There have to be rules, otherwise we would have chaos! Other than following basic design rules (color theory, composition, KISS) try to keep everything simple enough to render in an SVG without including bitmaps. By keeping everything simple enough to be rendered as an svg, we open up many scaling and animation options. It makes my brain spin in anticipation of what the future holds.

Otherwise, as every managing director I've ever worked under said:

"Make it POP."


Flat 2.0 Inspiration

There are many talented artists out there already doing this. Here are some amazing pieces I used for inspiration for the upcoming redesign of our main page and for this article. If you have some examples let me know and I'll add them to the board.

Tell me your thoughts on twitter or dribbble!
If you liked this article tweet it and give me an instant ego boost.