What factors led to flat design catching on in web and app design? I know that Microsoft and Apple led the way in abandoning skeuomorphism in favour of more austere designs, but what motivated this evolution?
What caused it....
People/Designers just following trends... that's all.
Its the same thing that caused skeuomorphism to spread wildly... and the same thing that is causing the "material" design to spread.
Skeuomorphism had a basis in some reasoning... in that it was originally used to try and get users comfortable with digital content by making it appear familiar by being close to real-world objects. However, since digital items are very, very commonplace now, there's no need to try and ween users into digital worlds. Everyone understands digital content today. So designers, as a whole, are freer to design however they want. When Apple, Google, and Microsoft all bucked the trend of skeuomorphism it opened the door for other designers to follow them.
Some larger company decides to redesign... and a whole rush of other designers tries to copy them in an effort to conflate their design with the large corporations design...
a la ...
I love Apple.... this site is designed like the iOS, it must be good....
I love Microsoft, this site is designed like Windows 8 ... it must be good.
It's a way of gaining client/user credibility purely through appearance. Kind of like name recognition for a politician.
There's no great cause or reasoning behind any of it, other than designers just following what other designers (in more visible companies) are doing.
There was a great post on Nielsen Norman Group a couple of months ago that covered this topic. Essentially:
The release of Microsoft’s Metro design language and Windows 8 in 2011 was particularly influential in popularizing flat design. Microsoft’s design documentation referred to its new style as ‘authentically digital’—a phrase that neatly captures the appeal of flat design for many designers. Unlike skeuomorphic design, flat design was seen as a way to explore the digital medium without trying to reproduce the appearance of the physical world.
The flattening of Apple’s homepage provides a useful benchmark for the growth of the trend’s popularity. Skeuomorphism and realism had long been trademarks of Apple design, and its homepage resisted the flat trend until around 2013.
Recently, designers have begun to realize the usability issues of flat design. As a result, a more mature and balanced interpretation of flat design has emerged. Designers are finding they can be ‘authentically digital’ and explore the unique opportunities of the medium without compromising usability.
This is sometimes referred to as ‘semi flat,’ ‘almost flat,’ or ‘flat 2.0.’ This design style is mostly flat, but makes use of subtle shadows, highlights, and layers to create some depth in the UI.
(This is more of a comment, but I don't have enough rep to posts comments, so I'll post a pseudo-answer)
What caused the rise of flat design? Fashion.
It's just a style thing, and rounded corners were no longer fashionable.
This biggest irony that I see is that "web 2.0" was largely typified (in a style sense, not the technology sense) by rounded corners and glass effects. In the early days, this was hard to do since CSS/browsers didn't support the radius property well, and PNGs with alpha channels were also not widely supported.
By the time standards and browser implementations caught up to all of this, BAM!. Rounded corners weren't cool anymore, and suddenly it was all flat design.
Flat design is easier to work with when designing for the web (from a developers perspective), but just give it a year or two. Flat design will be out and the next thing will be in.
Microsoft and Apple led the way in abandoning skeuomorphism
There's your answer. If they aren't trend setters, I don't know who is.
I do have to nip-pick about the use of skeuomorphism here, though. It's a word with a definition that has been stretched beyond recognition, IMHO.
A skeuomorph is an element than emulates it's real-world counterpart. It's more of an interaction design concept than aesthetic. A simple example is the calculator app in iOS. The original app and the new 'flat design' app are essentially the same in that it emulates a real calculator with real buttons and a real LCD screen. They are just styled very differently.
I believe that Mobile first and the need for speed are at the heart of a return to simple flat design as it forced a rethinking of skeuomorphism and the extra weight of rounded corners, shadows and other elements.
Then came Paula Scher's redesign for the Windows logo with a clean and stark approach which seemed to have opened a floodgate of rethinking web and mobile graphics——Microsoft's Metro-, Apple's flat- or Google's material-design at the same time that Sketch became a prominent tool.
In short it was in the air!