Everybody believes that we are seeing flat web designs all around us thanks to the design language Microsoft created.
Metro design language was created by Microsoft for Windows 8. It is true that Microsoft is responsible for making it such a big trend, but actually Google is the pioneer of flat color designing. If you remember, most of Google’s tools’ homepage consisted of flat web designs. Google Calendar, Reader, Docs and so on. They all contained flat web designs long before Microsoft developed this language.
Despite the popular opinion that flat web designs are not “cool” the trend is growing rapidly among designers. Designers believe that anyone can play with shadows, effects and gradients but only true designers are able to create good designs using only flat colors and line. An addition to this is that flat web designs load very quickly and they are very friendly with responsive web designing.
On the other hand, there’s another opinion; some designers say that routine clients never get satisfied with flat color designs, they need wowing effects so gradients and shadows and stuff is completely necessary and there’s nothing wrong with using these effects.
Flat Web Designs
At first it was considered that this trend would never pick up. Even Windows 8 received loads of negative reviews because of their use of flat colors all around.
But today we see that it has become quite a successful trend and proved most of the people wrong who were making predictions in the beginning of this year.
Actually flat color designs are fresher. They don’t put much load on the eyes but they carry all the designing aesthetics.
Skeuomorph was believed to be the next big thing in the end of last year, but as ever, internet surprised again and made flat colors a trend.
I’ve prepared a showcase of 30 creatively and effectively designed flat color web designs. Let’s check them out.
Being the creator of Metro design language, Microsoft’s official windows page tops this chart.
This is a very famous internet magazine. They recently went through a redesign and this is what they finalized as their new look.
This is a design studio that works with clients from all over the globe. They had to make a website that impresses professionals.
Wistia is a video sharing solution for business users. This video sharing site takes flat design to new heights.
David Hellman is a web developer from Germany. His art direction also polishes his portfolio. And he shows how flat designing is done.
This is a team of four web designers and developers based in Baltimore. Rather than designing something flashy, they designed this extremely simple web page.
This is a UK based advent calendar. Until 31st December 2013, this is closed but the flat design stays open.
On the first look it might look a little mediocre but when you scroll your mouse over the page and check out the transitions, not bad!
A designer and illustrator from New York shows off his flat design skills.
Brighton (UK) based design house is going highly successful. Is their impressive flat web design making a difference?
Symbolset uses font magic to change words into icons. Made with love for computers and people.
I just kept watching the video they’ve made. 😛
This is a designing and development company. You open their website, you see their work and you take a bow. At least that’s what I did.
This is a word game for iOS, Android and Mac. But we are not interested for the game but their web page design. Gorgeous.
This is a business monitoring tool for business owners. The web design uses flat colors (apart from the background image in the header).
They are a glamorous design studio. Since their material/content was highly eye-catching, it required a simple, in fact dull looking background. They went with flat designing.
An Indonesian website dedicated to music.
An independent design studio’s homepage. Personally I feel their selection of colors is not as perfect as it should be. Cyan-like light blue for background and white text on top is something I didn’t like that much. But again, maybe its just me.
They are kind of a training college for learning to develop fonts.
The design and animation house brings a very out-of-the-box flat web design.
The twitter based app for PC and Win 8 makes a new homepage. All blue flat web design.
Telephony service in Australia uses such refreshing colors, such as the Aussie character.
A marketplace for designers create an extremely simple layout for themselves.
A responsive grid system for fixed and fluid layouts. Built in SCSS, it gives you flexibility and full control.
Interactive agency based in London proves that Europeans are better at flat designing.
Another UK based web design agency does flat design beautifully.
A multi-purpose app for desktop has a brilliantly designed flat color homepage.
Even social NGOs and NPOs are using flat web designs.
This is a cool free tool if you have more than one email address. The design is also impressive. Even their character/mascot is made using flat color design.
This is an interview show by the designers, for the designers. Of course, the homepage is also designed nicely.
A few things you should keep in mind while designing flat color designs is that use large objects everywhere. That’s not just for mobile devices but also for creating color contrasts.
Even before creating the layout, you should finalize your color scheme. Speaking from personal experience, if you draw the layout first and then try to find suitable colors, it is like finding a needle in haystack. You won’t find suitable colors.
And in the end, I’d say that in my opinion, I don’t think this flat color hype will continue for a long time. Right now it is an obsession but I believe that by the end of the year, things will be pretty calm. That’s because working with flat colors creates a lot of limitations… and designers don’t like limitations!