Technically, Material Design is a language developed by Google with design guidelines ad specifications that help developers create standard, good-looking experiences across a variety of devices, from very small phones to large displays. Of course, graphic designers may or may not follow these guidelines stringently – we creatives have a way of breaking rules it seems!

Material Design, Defined

The hallmark of this design style is summed up by Google like this: A material metaphor is the unifying theory of a rationalized space and a system of motion. The material is grounded in tactile reality, inspired by the study of paper and ink, yet technologically advanced and open to imagination and magic.

At a glance, the style appears minimalist with (usually) bright, flat colors, on white or dark backgrounds. If you want to really learn more about this, Google goes into detail about how animation, responsiveness, touch, graphs and other functions should work to create the “material experience.”

The foundation of material design is usability and accessibility. When we create standards across multiple products, sites and platforms of performing tasks consistently the learning curve for the user is greatly diminished. From an accessibility standpoint, consistent standards are everything. Once a user learns how to function in a brand’s apps, they can navigate around so much easier so all of these standards and best practices conspire to create an atmosphere of ease-of-use, speed and task achievement… ideally.

Click the image to see all the examples.

Material is Colorful, but Much More!

Material Design is meant to feel tangible. “Paper” and shadows provide cues that ground the user. Movements work consistently so the user never has a jarring experience – using apps on touch devices are smooth and easy and things speed up as expected in real life.

For an authentic experience, use the Material Color Palette: https://www.google.com/design/spec/style/color.html#

I recommend you don’t go crazy with colors. Pick a few that will be the dominant colors and then use a few as secondary colors, or if you have a product line, consider color-coding each product or each section of a site which will help users stay oriented and focused. Watch this video by xda tv to learn more.

Pre-Designed Artwork

Why wait? You can get a headstart with some of these fun, well-designed templates or themes from Creative Market right now if you want to design something, or just look at them to get ideas and an understanding of the style.

01_home_2-oSite/App

Soft Material UI Kit
http://crtv.mk/d0TVV

Mate PSD Templates
http://crtv.mk/j0eJ8

Oslo PSD Template
http://crtv.mk/e0TSQ

Themes

HTML Theme
http://crtv.mk/v6Bw

WordPress Themes
Beetle http://crtv.mk/j0eJ5
Firefly http://crtv.mk/x6CZ
Colours http://crtv.mk/f0eFH

Branding & Marketing

Minimalist Logos
http://crtv.mk/z7Cq

Business Icons
http://crtv.mk/d0TVc

SlidePro Powerpoint
http://crtv.mk/e0TSI

Material Flyer/Datasheet
http://crtv.mk/g0diC

Business Card
http://crtv.mk/a0TSD

Identity Set
http://crtv.mk/u6GF

Food for Thought

Is this style a fit for your products or projects? Analyze how it strikes you on first impression and determine whether or not you think this is a style you would enjoy looking at and performing tasks in on a long-term basis.If you don’t like it, try to pinpoint why that is. You can also:

  • Look through the Material Design website that Google offers: https://www.google.com/design/spec/material-design/introduction.html# to learn more about the style and purpose.
  • Check out your phone apps – can you identify any that have been designed with Material principles?
  • Share your favorite material design sites or interfaces! Leave links in the comments section – I’d love to see them.

Fabulous Freebies!

Email Templates
http://www.materialup.com/posts/email-template

Meteor Wallpaper – Seriously Cool!
http://www.materialup.com/posts/meteor-material-wallpaper

Android UI Kit for Sketch
http://www.sketchappsources.com/free-source/659-android-l-ui-kit-sketch-freebie-resource.html

UI Kit
https://visualhierarchy.co/shop/product/material-design-ui-kit-freebie/

There are three essential factors in all human activity: spirit, materials, and action. ~ Chiang Kai-shek

Leave a Reply

Your email address will not be published. Required fields are marked *