Google Introduces Material Design and Gives Shape to New Ideas in Design and Development

“We challenged ourselves to create a visual language for our users that synthesizes the classic principles of good design with the innovation and possibility of technology and science. This is material design.”

In June 2014, Google announced its newest design initiative: material design. Material design will launch first on the Android Watch, and the Android L operating system, which is set to launch in late 2014. Google will eventually update all their products (Android, Chrome OS, and the web) with the tenets of material design.

So what is material design? And how will this new visual language affect the way websites are designed and developed?

Material design is Google’s new visual language that’s meant to make content look similar across the screens of other internet devices, whether they be laptops, desktops, tablets, smart phones or watches. To a design-purist, this may sound disappointing; even unexciting, but since Google’s first and foremost tenet is to “focus on the user and all else will follow,” material design is all about the user.

In visual language terms, material design will encompass these guidelines:

• Bright colors (think neon!) in Apps
• Clean white cards that you can move around like physical paper
• Exact layering hierarchy
• Consistent drop shadows
• Animations that give you a sense of location and space
• Pixels are treated as 3D cubes with depth and change shape according to touch
• Complexity is only added when it is necessary; simplicity rules
• Generous white space for clarity and readability

Material design will also encompass a smarter and more complex algorithm; anticipating the information a user needs by ranking the queries of other users.

The rationale behind material design is that apps and websites are not intuitive; users must rely on their previous knowledge of working with other websites and apps, as well as what they know and understand about the natural world. Google designers acknowledged that the user can get lost between apps, pop ups, alerts, and various screens.

Here’s another way of thinking of material design: it can be likened to designing a huge house – all of the rooms have unique functions, different purposes and still require visual elements that tie each room together. So, the entire house looks and feels cohesive, but contains heightened functionality. Furthermore, occupants should feel confident that they will not get lost in the house and that they will be able to locate what they’re looking for in each room with ease. This is what Google’s material design is attempting to do across all their platforms; unifying them with a single visual language.

In this design philosophy, surfaces and edges will have a more realistic, in a virtual sense, purposefulness. This means that the visual objects on Google screens will “move, interact, and exist in space in relation to each other.” For example, a user would be able to make the page “ripple” like a piece of paper in the wind; different but similar to the way a real piece of paper would ripple in the wind.

But it’s not about making objects move just for the sake of it. “Motion provides meaning” and the realistic lighting, shadows, and hierarchy of the visual elements will enhance the user’s experience.

Since Google offers many technologies, it makes sense to create a unifying look and feel across all its devices. Consistency promotes understanding. According to Google’s Vice President of Design, Mattias Duarte:

“The human mind is built to build models…we’re constantly building models of the world and predicting how that world will work. When you have a digital world that has no rules, where every time you do something it behaves in a new and a different way… it makes it hard; everything is an adventure. But when you’re trying to get something done, you don’t want an adventure – you want things to behave in a predictable way.”

Enter material design.

So in what ways will material design affect the way we design and develop websites?

In the short term, developers will have to adapt their apps to the tenets of material design. Or, at least, seriously consider how this new philosophy and its guidelines can positively impact one’s mobile business.

Thankfully, Google has published their guidelines on material design animation, style (color, typography, icons, imagery), layout, components, patterns, and usability all online, making it that much easier to use.

Learn more about material design here.

Although some may say material design is nothing revolutionary, but only an extension of Google’s current minimalistic design, others say it’s an initiative measure to catch up with the trends made popular by Apple and Microsoft.

No matter where you stand on material design, one thing remains certain: designing intuitive, user-centered interfaces is the designer’s and developer’s ultimate goal.

Sources:
Google