A Look at Microsoft, Google and Apple’s Approach to Flat Design

Editor’s note: TThis is a contributed post by designer Roman Po who has done projects for Disney and ABC. He is a writer at DesignCrowd.com, where he obsesses over innovations in mobile GUI, UX and web design. You can find his latest blog posts over at Techolo.com and OneDesignPH.com

Flat design has been a trend in user interface design for a few years now. It is basically simplifying the interface by retaining the essentials and removing unimportant elements such as gloss, bevels and textures. Flat design can be described as being true to its digital medium without the need for any graphical parallelism to real world objects.

The most popular operating systems in the world, Windows, iOS and Android, have slowly been shifting their design language to a more minimalistic and cleaner look that is characterised by presenting data in grids, larger title headers, extensive use of white space, adoption of solid color palettes and condensed flatter font-types.

Recommended Reading: Ultimate Guide To Flat Website Design

Let’s take a look at how these 3 companies approach and implement flat design on their own OS and related services.

Microsoft: It’s hip to be square

Microsoft first introduced their “authentically digital” interface with the launch of Windows 8 and their Modern UI. Windows Media Center and the now defunct Zune brand ushered in this new era of design for Microsoft but it was Windows 8′s radical departure from the sea of icons â€" which most desktop OS used ever since â€" that changed the game.

The new Windows 8 Start screen is now powered by Live Tiles (animated, notification-like widget) sorted in grids with a horizontal scrolling layout that takes advantage of common landscape displays.

Windows 8′s Metro Modern UI is based heavily on the Bauhaus movement, founded by architect Walter Gropius, including proponents of the school’s philosophy Ludwig Mies van der Rohe, Le Corbusier and modernist painter Piet Mondrian. It was also inspired by metro transit signs in terms of icons and typography.

Microsoft’s Swiss-inspired interface eschews non-essential elements like shadows, gloss, textures and puts content first before Google’s Chrome browser. Grid alignment, typography and negative space make up the whole, giving a full-screen experience engaging and immersive for users, especially those on touchscreen devices.

Google: Holding The Cards

Google started defining clear design guidelines for Android with the launch of Android 4.0, code named Ice Cream Sandwich (Android 4.4 is now called KitKat!) Google created a distinct design style of its own and dubbed it Holo, playing with a TRON theme at first but eventually maturing into a minimalistic card-type interface that is now prevalent on most of its products and services.

Google’s card-based design can be seen most notably on Google Now. The use of white spaces and condensed Roboto typeface make the overall layout very clean and easy to digest. The design, while considered flat, still uses subtle gradients and shadows as elements to aid highlighted, stacked cards.

Textual information is organized per size and color and in order of importance. Title headers are usually larger and dark while descriptive copies are grayed and sometimes italicized. Google’s use of flat-toned vector illustrations and icons also echoes the company’s dedication to clean and modern design.

Apple: In with the Neue

Apple just redesigned the look and feel of its new mobile version, iOS7, to have flatter and solid color tones compared to its old interface. iOS7 has taken some cues from Microsoft and Google using simpler icons, fresh type treatment and an overall flatter environment in this recent iphone redesign.

It can be said that critics of Apple’s hyper-skeuomorphic (or obsessive design realism) approach on its platform, notably native apps like Game Center with its felt background and Calendar’s leather textures, prompted the change.

With iOS7, Apple introduced the use of blurred translucency to provide a sense of context and place for the onscreen elements. The new version also introduced a thinner, modern-looking typeface in the form of Helvetica Neue Light. This fits the overall new user interface with a lighter and breathable layout especially in the Mail and Calendar app.

Subtle improvements like the parallax effect add depth and motion to the launcher screen. Granted not everyone loves Apple’s drastic switch to the new iphone design, with designers are creating iphone design alternatives but we can expect to see more of it as the new iPhone 5S roll out soon.

Different Ideals

These 3 tech companies have different directions on their new user interfaces. Microsoft focused on delivering a colorful, purely flat and utilitarian interface with its Modern UI. Google, on the other hand, is more comfortable presenting useful and timely data on white, card-like containers, quite similar to how the Google home page looks.

Apple meanwhile takes on Microsoft’s colorfulness (on software and hardware) while also adding cool digital tricks like iOS7′s home screen’s parallax effect. Most of these new interfaces are also similar in a way that they are now also designed to be responsive and flexible since they run on multiple devices from small form-factor phones to large-screen tablets and desktops.

The Microsoft Effect

While Microsoft didn’t start the flat design trend (as much as Google started web search), I believe they were the ones who’ve made a big impact by virtue of the development and marketing of Windows 8 which has mandated every PC on the planet and its user to become accustomed to this new and unique interface.

If you’ve ever watch Microsoft’s Vision of the Future, you’ll realize that the Modern UI we have right now is just the beginning of a new breed of natural user interfaces combining touch, voice and sensors. Microsoft’s properties like Xbox+Kinect, Windows Phone and even Bing is already implementing Microsoft’s "3-screens and a cloud” vision of a unified platform (PC, television and mobile) so the future presented may not be too far at all.

Moving Forward

It’s clear that Apple, Google and Microsoft are now moving to more streamlined, minimalistic and cleaner designs for each of their operating systems. Form over function or function over form, as the famous modermist aphorism dictates, users will eventually have to decide which of these 3 approach they’d prefer.

It’s probably safe to say though that flat design trend has already made a mark and will be here for quite some time. Flat is just the beginning as we move to a more genuine and honest design future.