Material Design: Paper and Ink.

Google I/O brought with it the latest preview release of Android, L and some new Android goodies such as Android Wear and Android TV. However, Google laid a special emphasis on interface design this year. It wanted interfaces to be scalable, imaginative and layered. So, it went forth and released a completely new design guideline for Android and Web alike and showcased the ‘paper and ink’ inspired, ‘Material Design’ to the world.

Material design is an attempt at solving one of modern design interface’s biggest problem, scalability and versatility. Interfaces nowadays have to be hardwired to a particular resolution and screen size. Different assets of an application such as images and graphics have to be made in different screen densities so they look sharp on any display. However, this creates a lot of problems for developers and designers who have to make the same thing over and over again. Therefore, in an attempt to bring the web interfaces and mobile interfaces in sync, Google released this new design language.

Material design is all about combining old-school skeuomorphism with modern-day minimalism into something truly magical. It aims to utilise the new elevation attribute along with the beautiful card layout which has become standard on most Android and Google apps. Google has aimed at replicating the same effect as the traditional paper and ink have on our lives. Similar to how a stack of paper moves when on a study desk — with the most important document on top -, apps designed with this guideline focus on the users current priority. Each transition has to be in accordance with our touch feedback and Google has recognised that with ‘Material Design’. Google states that user interaction is at the core of this new design language and each pixel is meant to respond to user inputed feedback and react accordingly.

[caption id=”attachment_854" align=”aligncenter” width=”620"]

The all new People, Weather and Dialer application with paper and ink inspired interfaces.[/caption]

[caption id=”attachment_810" align=”aligncenter” width=”620"]

The new Material designed Calendar, Gmail and Google Play Music app.[/caption]

This new ‘pixel’ based feedback has resulted in a massive emphasis on transitions, bold colour choices, use of large graphics as well as the new, slightly rounded Roboto font. There is a new ripple effect — that resembles the spilling of ink — which serves as a feedback whenever a button or element is pressed. It gives a sense of presence and makes the experience top-notch. Symmetry is also at the core of some of the basic interface icons. They aim to be readable at even the smallest of screen sizes. Also included are transitions for most actions that required a pop up dialog box in earlier iterations to make everything transition smoothly as the user uses a multi-panned or multi-paged app. Colour has also been carefully embodied in many core interface elements. The status bar is now a darker shade of the primary colour used in the app. All in all, Google has focused on three core aspects when working on this new guideline: the tactile feedback mechanism, bold colours, and paper like user interface for scalability.

[caption id=”attachment_848" align=”alignleft” width=”620"]

The emphasis on bold colours to be prevalent throughout the app interface.[/caption]

[caption id=”attachment_847" align=”aligncenter” width=”620"]

The new system icons compared to the older holo system icons.[/caption]

Overall, the experience of using some Material designed apps has been magical. Everything is so beautifully placed and designed that it elevates the experience multiple times. The new Dialer and Calculator apps are truly pieces of art. The rest of the Google suite of apps also aim to achieve this feat. They all looked jaw-dropping when Google gave us a sneak peek at I/O. This is the beginning of a bright future for Android L and the Web. This is a guideline which refuses to look mediocre or bad on any device. As far as I can tell, it is the best not only because of the new ideas, but also because of the sheer execution.

Twitter || Facebook || Instagram || Google Plus || Android L Hands-On || Polymer — Material Design Demo ||