Material DesignMade Real

Tally Barak

We challenged ourselves to

Create a visual language that

synthesizes classic principles of

good design with the innovation

and possibility of technology and

science. The movie

Icons made by Yannick, Freepik, Google from www.flaticon.com is licensed by CC BY 3.0

Bold, graphic, intentional Motion provides meaning

Material is the metaphor

Material Properties

Material is the metaphor Motion provides meaning

Bold, graphic, intentional

http://www.google.com/design/spec/style/color.html#color-color-palette

http://www.materialpalette.com/

http://materialdesignicons.com/

Material is the metaphor Bold, graphic, intentional

Motion provides meaning

Beautiful Meaningful

Surface Interaction Material Response Radial reaction

Responsive

Visual Continuity

Examples

examples

Delightful Details

• Layout

• Gestures

• Scrolling

• Touch

• Errors

• Navigation

• ARIA

• RTL

Made Real

http://developer.android.com/training/material/index.html

Android

Polymer Project

https://www.polymer-project.org/ Designer

https://material.angularjs.org/#/

Angular-Material

https://material.angularjs.org/#/

Thank You!