Google Products

Visual Design for Google

Google Products

Google’s visual redesign identity project was inspired by the CEO Larry Page in 2011 to enhance the company’s main products identity including search, maps, mail and software suite especially app icons and the UI elements. The project was then started in January 2012 leads by their senior graphic designer Roger Oddone, art director Christopher Bettig and with their designers team.

Gmail icon design

The are simple, modern, friendly and sometimes quirky. Product icons are highly simplified, exaggerated and caricatured in nature so that they are appropriate for use at small size.

Let’s see how the design dept of Creative Lab behind this internet giant develop and redesign the User Interface (UI) of Google’s visual assets for their products and become guidelines for their product’s UI designers, app developers and their vendors. The style then being trendy all over the net.

Redesign Process

Google Earth
Google Earth
Design on White background
Design on Dark background

 

Corporate color
Simplified from 3D to Flat Design
Simplified from 3D to Flat Design

 

The Design Principles

The designs should be simple, straight forward and user friendly, so they are several rules to be made clear.

Good Geometric Shape – the more geometrical shapes used, the better and make it as precise as possible.

Design Principle - Geometric
Geometric

.

Front Facing – front view and symmetrical shapes always communicate better for user compared to isometric 3D style.

Design Principle - Front Facing
Front Facing

.

Flat & Shadow – flat design looks clean & beautiful, light and fast loading.

Flat & Shadow
Flat & Shadow

.

Pixel Perfect – as these designs are tiny and for screen devices, always make sure the pixels are in their grid to keep them perfect for HD or retina screen.

Design Principle - Pixel Perfect
Pixel Perfect

 

Source: Google Visual Assets Guidelines P1 | Google Visual Assets Guidelines P2
a

Visual Design for Google seems getting smatter and lighter. We might probably see Google start transforming their visual assets into SVG near future..

Google Trends in Full Screen

Google Trends
Hot Google Searches visualize in full screen grid

Last couple of days Google has update their Hot Search trending data in visual style. What make it looks cool (or hot) it presented in full screen and best of all we can view it in grid, just choose the grid size (at the top left icon) that suits your screen size. For every keyword shown in the boxes, represents for certain countries. For now it’s only showing searches from 11 countries – US, UK, Canada, Australia, Japan, Russia, Hong Kong and few more. View it in full screen.

Google seems to show how nice the web-tech should be presented, simple, clean and following the new style flat design interface web trends. Also the popular grid style layout with their 4 corporate colors. But I’m not really sure if the Red color represents the hottest keyword searched compared to the other 3, I assume it just random.. and the script renders the output as vector ☺

via googleblog.blogspot.com

Vectorise Forum

Vectorians community, a place where we provide the vector source files to download & for contributors to upload as well, sharing infos, tutorials, tech, mobile, gadget’s talk, etc..