You may have noticed a design trend on the web in recent years; websites seem to look undeniably flatter. The shine and polish seems to have been removed from our online experience. The use of artificial textures such as metal, leather, and rubber (technically referred to as skeuomorphism) also seem to be on the demise. The use of familiar and realistic graphics online such as a button looking like a real three dimensional button was thought to aid users understand how to use web pages by using design concepts and materials that are instantly recognizable. If a web button looked like a real button then users would know that they could press it. Perhaps such design cues were needed on web pages then but as everyone’s online use matures, perhaps real world visual cues are not needed quite so much. After all, we’re all living much more online than we did in the early days of the web and our understanding of web pages is more sophisticated.
To illustrate the emergence of flat design, here are the before and after browser icons from Microsoft, Google and Apple.
Gone are the shadows and the shine, the textures, and the 3d effects. And it’s not just web giants that are getting flatter; you may have noticed that there is a growing trend for flatter websites all over the web. But is flat design just the latest design fashion or is there something more to it? Is less actually more?
Flat design looks simplistic, minimalist and less cluttered than previous more complex and intricate design trends. Design complexity can mean more messy, messy design can lead to confusion and confusion is not a reaction that anyone would wish to install in their visitors. But it’s the meteoric rise of mobile web devices and the ability for flat design to scale down to smaller sizes so well and use less screen space that is likely to be driving the flat trend. Detail and complexity just doesn’t work as well on the small screen. Not to mention that the more complex images are, the larger they are and the longer they will take to load on the page. Flat design allows web pages to become efficient and easier to resize when being displayed on the many different screen sizes that pretty much all websites now need to contend with. On a small screen, space is a limited and premium resource that is consumed much more by complex design than it is by a minimalist one.
Mobile Surpasses the PC
It has been predicted for years and by mid 2014, mobile internet use surpassed the PC. And so perhaps it's less surprising that as flat design works so well on mobile, that it's become ever more ubiquitous. Increasingly higher definition screens make images that used to look crisp and bright, look ever more pixelated, out of date and somewhat amateurish.
There are certainly some challenges using flat design. For starters, simple design doesn’t mean easy. Just because web pages are taking a more minimal approach, that’s not to say that it’s an easy design concept to pull off. There’s a fine line between a simple, professional look that creates a great user experience and one that simply looks overly sparse, incomplete or just slightly amateurish. But that’s where professional designers play their part and their experience and knowledge of design resources such as flat design kits can really improve the final designs.
Obviously, great user experience is a vital aspect of all web pages and poor flat design can leave users wondering what's clickable on a page and what’s not. Don’t make the mistake of letting style outrank usability.
Might the Trend Reverse?
Mobile web is still in it's relative infancy. The current trend is seeing screen sizes getting bigger, not smaller. Screen definitions are getting much higher and not lower. Wifi speeds and mobile data networks are getting faster and not slower. And as these trends are surely set to continue, who knows, perhaps new technology might again reverse the trend of flat design and we might move toward ultra rich and detailed web designs.
Flat design done well has a pleasing aesthetic and simplistic appeal but more importantly, it’s a design idea that recognizes how people interact with the web today, especially with regard to mobile use. It actually puts functionality and practicality ahead of visual appeal and it’s simplicity and modesty somewhat plays down its sophistication.
Due to its pragmatism and wholesale adoption by some of the web’s largest players, I think flat design is a trend that will remain in ascendance and be with us for a good while yet.
What are your views of flat web design? Love it, hate it or do you consider it to a necessary and practical response to today's mobile web?