WHAT IS MATERIAL DESIGN?

The Material Design and the design language by Google unveiled on June 25, 2014 during the Google I / O, the company's annual conference aimed at all the various programmers and developers of applications and devices with Google software and operating systems. Natural evolution of the Flat Design, aims to create a unicuum of strictly defined style. Like every design language self-respecting has its own forms, their own colors and your own font. In short, one essential grammar and unequivocal, a true language is exactly. This has not only influenced the visual aspect but above all the functional aspect in its use with the mobile devices (for which he was born).

But delving into the concept behind the Material Design (uniformity, UX, dynamism and simplicity) two questions can immediately arise: because "material" and what is Google's goal?

THE METAPHOR OF THE DIGITAL OBJECT

As can be easily understood, the key concept of Material Design is the word material. Where is it material, that is, the material, is a metaphor. E material is an object. There metaphor of the material it is used to make the graphical interfaces look realistic and, therefore, improve the user experience.

The Material Design (codenamed Quantum Paper) aims to make sure that graphical interfaces behave like real materials, like objects. In fact, it takes inspiration from world physical and his own texture, including the way they are reflected the lights and cast the shadows. However, behaving like existing materials does not mean blindly imitating their surfaces, but it does mean having the ability to adapt to various situations.

The designer Matías Duarte explained that, unlike the real card, digital material can intelligently expand and change. In fact, Material Design features physical edges and surfaces. Overlays and shadows give information about what you can touch and how it will move. Google claims their new design language is based on paper and ink. Just like paper, digital material can expand or shrink by intelligently reforming.

THE DIFFERENCES BETWEEN FLAT AND MATERIAL DESIGN

The Material Design was born in contrast and at the same time as a synthesis between the Flat Design and it Scheumorphism of the former iPhone from the Apple. In fact, it uses some of the fundamental features of the Flat, such as the use of a strong color palette, of the primary geometric shapes (square and circle) to represent the interfaces and the space left to the texts.

However, in a certain sense, it improves Flat Design by combining it with the metaphor of the material. In fact, the design rules of Material Design focus on a increased use of layout based on a grid, animations and transitions ed depth effects like lighting and shadows. However, it does so while remaining in the simplicity of the lines and shapes. This is the fundamental difference with flat design which, as the name implies, aims to flatten everything.

THE MAIN FEATURES OF MATERIAL DESIGN

The fundamental characteristics of Material Design are 4: le tactile surfaces, the intelligent animations, L'adaptability and thedigital ink.

THE TOUCH SURFACES

The first fundamental characteristic of Material Design is theuse of digital surfaces or quantum paper. In practice, each element of a graphical interface becomes one real surface and tangible, touchable. All surfaces are the thickness of 1 dpi (dot per inch, the minimum size in digital graphics).

Thanks to this structure, the elements acquire realistic shadows because they are structured in a hierarchical way one over the other. Basically, the subdivision into levels of digital surfaces improve user experience and focuses his attention on the important elements of the page. Eg, the main navigation buttons are placed in the foreground, while the card (the primary block structures of the interface) are positioned lower and with a much less consistent shadow.

INTELLIGENT ANIMATIONS

Obviously, graphical interfaces are not static and the designers and developers of Google have strongly focused on this aspect. An animation must be one consequence of a gesture and, therefore, of an intention of the user. In short, they must be intelligent animations.

The movement focuses attention and maintains continuity through thin feedback and consistent transitions. As elements appear on the screen, they transform and rearrange the environment with interactions that generate new changes. For example, it is very important that the animation starts exactly where the device is receiving the input (click or touch).

ADAPTABILITY IN MATERIAL DESIGN

All graphical interfaces must absolutely be responsive. That is, they must adapt dynamically and automatically to each device from which that interface is accessed, whether it is a computer, a Tablet or one smartphone.

Basically, adaptability it works by switching from general to specific. The amount of individual information shown on the screen is reduced in manner proportional to the size of the screen itself. This dramatically improves the user experience who will be able to read or watch videos and images the same way on every device.

THE DIGITAL INK

The last of the 4 main components of Material Design is the so-called ink digital, that is, the application of the needs of printing to the digital surfaces of the interfaces.

As in the world of "printed" design, typography plays a crucial role, and so does the digital design of language material. Indeed, Material Design relies on print design methods (grids, space, scale, colors and images) to immerse viewers in the experience. In particular, Google uses Roboto, a font that has 8 weights (plus the 8 versions in italics) which guarantee a wide use. By the way the Roboto is a font that Google distributes for free. Of course, digital ink also includes all colors and the images used.

THE INFLUENCE OF MATERIAL DESIGN

Google has been able to combine in a unique design language what have been the two trends of recent years in the world of technology and design. In fact, by taking the best of each of them, she has managed to create something innovative. The Material Design definitely is a point of reference and a trend throughout the scope of the web design he was born in design of graphical interfaces, the so-called interaction design. Moreover, it is becoming the new trend in the field of graphic design with its shapes, its structure and its colors.

For example, we of QuestionMark we were inspired by the Material Design for the realization of the new website de The Valley of the Gardens. In fact, in addition to the realization of their social media strategy, the famous brand of frozen foods once again turned to us to update his digital identity. Follow the guidelines of the material design it was our mission and we think we have accomplished it. Now that you know the principles too, you can evaluate our work by visiting the new site La Valle Degli Orti here.

Are you ready to ride the wave of novelty and try to follow this trend?