Is the New Google Interface Flat?

Just in time for Google’s annual I/O developers conference, the web giant launched a pretty dramatic redesign to its Google+ social networking arm and Google Maps.

And Google is on-trend.

SEE ALSO: Websites Featuring Flat Illustrations – Best Examples

The design scheme, while not completely flat, is almost flat and could evoke a whole new design trend of its own.

Flat Design Refresher

Flat Buttons

Flat design is a method that does not use any extra effects to create a scheme that does not include any three-dimensional attributes. There are no drop shadows, bevels, embossing, gradients or other tools used that help lift elements off the screen or create added depth. Icons and UI elements are crisp and without feathered edges and shadows.

Are you looking for responsive website templates and online website builder?

Get Startup Design Framework now!

Use coupon code START50 for 50% off!

Almost flat design is also without many bells and whistles, but can include some effects. Almost flat design uses many of the same principles of flat design – bold color for calls-to-action and simplicity when it comes to interface and typography. What’s different is the use of subtle gradients and drop shadows to help users understand what to click or tap and how to interact with what’s on the screen.

Google and Flat Design

First things first, the new Google design is not truly flat but it does borrow a lot of concepts from flat design. The new user interface is sharp and colorful (especially clickable buttons and calls-to-action such as those prompting you to complete parts of your profile). Google is giving items more room to breathe with added spacing and cleaner typography.

The look is simple and direct.

Flat text

Flat Page

Flat Text Editor

Google+ is based on a series of “cards.” Everything within each card is basically flat, aside from the small shadows on +1 and share buttons. Card edges include shadows and effects for extra depth. The same is true of the navigation bar across the top of the screen and if you look closely, the notification and share buttons contain light gradients. With a closer look, you will find that hovering the mouse of hashtags brings up a rather large shadow around the box.

No Flat Tags

Google Maps is getting a visual (and UI) overhaul as well. (You can request an early invite to be among the first to try out new desktop browser-based features.)

Flat Maps

The Google Maps design scheme, too, is almost flat. Logically, it looks like an extension of Google+ with cards overlaid on maps for directions, photos, places and more. If you use the Google Maps app for iOS, you already have a good idea of how it will look because it is already using an almost flat design scheme.

Google Maps

The new UI also includes feature updates such as transportation comparisons for directions, better and more photos that correspond to maps and more interactive maps that include a “clickable something” for almost any point on the map.

Gmail is also going to feature the flat style. The look, which debuted for iOS users earlier this year, features the same card-style look at the rest of the Google redesign and more colorful buttons and icons, that are very much representative of the flat design trend.

Gmail Flat

Desktop users likely noticed the change a few months back as well, although for those who use photo themes the change might not have been that noticeable. Where you can really see the influences of flat design are in labeling (hello, bright colors) and in the look of buttons. (I would anticipate that desktop mail begins to migrate more toward the look of the app in coming months.)

What Does this Mean for Flat Design?

So now that the flat design trend has been accepted by Google is it over? Or will more designers avoid the middle ground of almost flat design because Google did it?

That remains to be seen.

But we do know one thing. The flat design trend has come out in a major way. You can debate whether it works – most designers either love or hate it – but now you must acknowledge it.

A New Trend?

Almost flat design really makes a splash with the new Google look.

It’s not a new concept, but tends to get lost in the flat vs. skeuomorphism debate. The simplicity and the chatter surrounding the new Google look could be enough to really get it off the ground in a major way.

What’s more interesting to look at is the idea of cards for design. The look, which is very Pinterest-inspired, is beginning to pop up in more places. (ebay’s latest design also includes cards.) Is this the start of a renewed interest in modular design themes?

Other Google Announcements

In addition to design changes, Google had a few other bits of news to share. Here are some of the changes coming soon to a Google product near you – and you better believe each will include some of Google’s new, almost flat, card-style design.

Google Phones

Google Search: Voice activation is being added to Google Search for Chrome browser users. (Think Siri for Google.) This is a feature that you will be seeing on both desktop and mobile applications. Google is also adding voice-activated reminders and notes as well. The look is very much like some of the flat-designed apps we are seeing out there; it’s clean and easy to use. The search engine itself also returns results in a much flatter-looking style that is most noticeable in image search results.

Google Play Android

Google Play: The game services application is intended to make gaming more social on a cloud-based platform. Google Play users can share achievements, merge gaming activities with Google+ and play in real time. And the design is super-simple and basically flat.

Google Music

Google Music: Google is joining the music business with Google Play Music All Access for Android. The subscription service will go head-to-head against services such as Pandora and Spotify and the library includes millions of songs and will recommend new music for you. It too uses the card theme, and adds another element of the flat design trend – bold color I the headers.

Android Studio

Google and Android: Google has a new little nugget for developers as well, Android Studio, an IDE made just for Android developers. It’s available now for download   and free to use and is an open source development project. The concept is that the tools allow you to build a system that adapts to each project and includes a powerful code editor. It is based on Gradle and Google says it “provides flexibility, customized build flavors, dependency resolution, and much more.”

Carrie Cousins has more than 10 years experience in the communications industry, including writing for print and online publications, and design and editing. You can connect with her on Twitter @carriecousins and Google+.

Newsletter

6 Comments
  1. davestewart May 24, 12:53 pm

    “Nearly flat” is a great adjustment. The new MS Office suite is a slave to the flat look to its detriment. Anything that needs to pack a lot of information in, like options screens, toolbars, print preview and such like becomes hard to scan because of the conformity, and I expect over the next couple of years the UI is going to have to evolve out of necessity’s sake.

    My MS Outlook has hardly any room for the reading pane, and a ridiculous “Full Screen” button to let you see more of your own information, just because the UI needs so much space in order to be usable! THAT’S when you know form is triumphing over function :(

    With small displays as well, we simply don’t have the luxury of using white space, so some other device or techniques will have to dovetail in with the flat look to make things easier to scan / comprehend / use.

    Fingers-crossed Google’s improvements inspire the good folks at Redmond!

    Reply
    +12
  2. Bojan Markovic May 24, 1:48 pm

    Google accepting flat?

    Google more-less started the whole flat thing with their apps visual overhaul few years ago. Plus was flat before this overhaul. The only significant move toward “new flat standard” is the Apple style extra-fat margins around elements for separation.

    Reply
    +11
  3. dorrellwilson May 24, 2:29 pm

    Yeah it’s flat…not Microsoft flat, but flat.

    IMO the flat (what I call card) UI Google is using is F’n awesome. In fact, I re-designed my site with card UI and creating my developer blog to have the same look and feel. I wont use it all the time. But damn is it pretty to look at. By far one of the best looking UIs I’ve seen/used.

    For the most part, it’s all about keeping their interfaces similar which is a good thing Google is doing.

    Reply
    +1
  4. Victor May 24, 2:34 pm

    I think that “flat” trend is a logical evolution to the digital graphic and visual language. After ingesting and digesting a 10years era of a rich, colorful, realistic Apple-ish visual language, it was time for a radical break in the way we design and communicate. And this apple style era was an answer to the computer-ingeneer raw style from the 80-90 style, when the computers and Internet were in their childhood.

    Making a comparison with the Art, The Flat style can be linked with the 80s vs the 70s, when artists have wanted to stand in front of psychedelic and colorful visuals (70s), breaking the codes creating industrial and graphic design minimally and colorful oriented (80). Look at the Memphis-Italian era versus the San Francisco Fillmore posters. Straight lines, geometric shapes, simplicity.

    Same as music. The example of dance music. In the 70s, funk and disco dance incorporated many layers of horns, strings, vocals, and the productions were driven for creating magic with many textures in sounds. For a warm music, rich and deep. (Ex : Earth Wind and Fire, MJ-Off the wall…). Then, the 80s have come, with new ways of producing, and the will to create simplistic music, like New wave, coming from rock, with synths and rhythm boxes. A cold and minimal approach of music, a direct answer to the richness of the 70s era.

    Then, to come back to design, we may think that after this direct break between Apple textured and realistic style versus the Flat minimal style, people will have digested and designers create new visual standards taking advantage of the best of the 2visions. To create convenient, easy, smooth and timeless design.

    Reply
    +3
  5. chrisbergr May 28, 12:46 pm

    I’m pretty sure I’ve seen many details of this style on google and twitter before pinterest started. And now on the new (!) facebook profile pages we can also see many details of the same style.

    Overall, I like this style very much! Hopefully more SaaS/Networks/App-a-like websites going to use it.

    Reply
    0
  6. Tim Mannino May 31, 9:18 pm

    Great article Carrie. Flat design remains a controversial issue (though I’m not clear why – get over it people.) At the end of the day, good design is all about good communication for the right audience in the right medium. If that can be done via flat or near-flat design, great. If it can be done through skeumorphic, that’s fine too. Hell, if you can effectively get your message across using nothing but a Chinese elephant, a hot air balloon, and 53 paperclips, then kudos to you!

    It’s all about the users. Too many designers forget that and end up designing based on what they like (I certainly have been guilty of that in the past!) Flat or no flat – don’t lose site of your audience :)

    Reply
    -2

Leave a Reply

*
* Minimum length: 20 characters