Google’s Material Design is an open source set of rules and guidelines for web and mobile app design. It wasn’t built only for Google Products or specifically for Android mobile apps. It’s a very detailed and useful guideline considering the multiple screen reality that web products need to handle nowadays.
When designers first started designing for the Web, they tried to design a action button look like a physical button in the real world so that people would know what it was,- a clickable button that they were supposed to push/click. Nowadays people have gotten used to virtual worlds: virtual controls, hover effects, buttons, menus, dropdowns and other web design elements no longer have to look like things that are in the physical world.
By using Google’s material design, web designers and developers are freed from the data bulkiness and the constraints of trying to make web elements look like real things in our world. Material design is a new design language, that helps developers to transcend most common web design principles. It aims to build a visual language that combines classic principles of a good design with technological possibilities and innovation. Material design goal is to create a single elemental system, that grants a consolidated experience across all device sizes and platforms. With a new generation of mobile devices and new form factors, such as Android smart watches, this move is seen by many as a logical evolution in design. It’s unlike other design languages out there because most of the design languages were developed earlier for older technologies.
Web Applications built with Material Design
Google is already using Material Design on most of their web applications. It allows them to be visually consistent from Web applications to Android apps, and adds a lot of the delightful small details such as transitions, motion, ripple effects, shadows and animations. Material design is quite well thought out on the Web applications as it is on mobile and the consistency is great. Apart of Google, there are plenty of web applications built using Material Design. It’s interesting to see how designers are adopting Material Design for their own web projects. Here is the list, featuring some of the best examples of web applications built using Material Design language.
1.Polymer Pitch Timer
4.Daily Stock Forecast
Daily Stock Forecast is a free service for day trading professionals created by Derek M Tishler. Application built with Polymer and Material Design.
Hey! We are seeking collaborators! Wanna join a cool opensource project? Just reply to this tweet! Share to anyone that might be interested!
— Paperkit Framework (@Paperkit) February 13, 2015
6.Spotify Artist Discovery
7.Material Design Playground
Polymer material design playground featuring most (if not all) material design elements.
8.Contact Manager Material Design Web App
Simple web application in material design built with Angular and Polymer.
Available on Github
Example of shopping cart implemented with Polymer, Web Components and Material Design.
This web application locks down the user interface so that the end-user isn’t able to adjust Android system settings or gain access to other applications. Build with MaterializeCSS framework