Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Material Design Lite
Search
Maunash Jani
November 27, 2016
Technology
0
270
Material Design Lite
Google Developer Group Mumbai, DevFest 2016
Maunash Jani
November 27, 2016
Tweet
Share
More Decks by Maunash Jani
See All by Maunash Jani
Trends and Technologies to build Future-Proof Apps and Websites
maunashjani
0
75
Building Chatbots with API.AI - GDG Mumbai Meetup
maunashjani
0
79
Facebook Messenger Bot
maunashjani
0
140
Other Decks in Technology
See All in Technology
ExaDB-D dbaascli で出来ること
oracle4engineer
PRO
0
2.1k
Building Dashboards as a Hobby
egmc
0
240
Terraformあれやこれ/terraform-this-and-that
emiki
8
1.4k
Google Cloud の AI を支える裏側のインフラを垣間見る!
maroon1st
0
360
FrontDoorとWebAppsを組み合わせた際のリダイレクト処理の注意点
kenichirokimura
1
530
【NW X Security JAWS#3】L3-4:AWS環境のIPv6移行に向けて知っておきたいこと
shotashiratori
0
410
Cloud Native Java with Spring Boot (CNCF Aarhus, April 2024)
thomasvitale
1
180
Java EE/Jakarta EEの現状と将来―クラウドネイティブ時代にJava EEは対応できるのか?―
takakiyo
1
170
今日からできる!簡単 .NET 高速化 Tips -2024 edition-
xin9le
1
100
KubeCon EU 2024 Recap “Kubernetes Policy Time Machine: Where to Next?”
ryysud
0
220
Além do else! Categorizando Pokemóns com Pattern Matching no JavaScript
wmsbill
0
640
Building a RAG-poweredAI chat appwith Python and VS Code
pamelafox
0
110
Featured
See All Featured
It's Worth the Effort
3n
180
27k
Git: the NoSQL Database
bkeepers
PRO
422
63k
Imperfection Machines: The Place of Print at Facebook
scottboms
260
12k
Producing Creativity
orderedlist
PRO
337
39k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
21
1.6k
Happy Clients
brianwarren
92
6.4k
Infographics Made Easy
chrislema
238
18k
Scaling GitHub
holman
457
140k
Faster Mobile Websites
deanohume
299
30k
Teambox: Starting and Learning
jrom
128
8.4k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
187
16k
Thoughts on Productivity
jonyablonski
58
3.8k
Transcript
Material Design Lite DevFest 2016
Maunash Jani @MaunashJani Genius Lynx - Software Developer DevFest 2016
- Technical Trainer
MD Community Implementations Polymer Paper Elements Angular Material Material Design
for Bootstrap Material-UI DevFest 2016
Material Design Lite By Google http://getmdl.io Why? What? How? DevFest
2016
Material Design Lite - lets you add a Material Design
look and feel to your websites. It doesn’t rely on any JavaScript frameworks and aims to optimize for cross-device use, gracefully degrade in older browsers, and offer an experience that is immediately accessible. DevFest 2016
Why MDL? • Material Design • Cross-OS web developer's toolkit
• Modern Browsers • Responsive • Content Display websites • Progressive Enhancement DevFest 2016
MDL DevFest 2016
Get Started https://getmdl.io/started/index.html • Include the master CSS & JavaScript
• Use the components • General rules and principles • Use MDL on dynamic websites • What are MDL's responsibilities? • What's next? DevFest 2016
Templates • BLOG • ANDROID.COM MDL SKIN • DASHBOARD •
PORTFOLIO • TEXT-HEAVY WEBPAGE • STAND-ALONE ARTICLE DevFest 2016
Components DevFest 2016
Styles Material Design Lite is a light-weight implementation of Material
Design, specifically crafted for the web. ➔ Typography ➔ Icons - Material Design Icons ➔ Color palette DevFest 2016
Showcase DevFest 2016
Tech Renegade App - College Event (@Genius_Lynx) DevFest 2016
Chakrakuyh App - College Event (@Diplomads) DevFest 2016
Community DevFest 2016 https://github.com/google/material-design-lite Contribute Report Issue Stack Overflow =>
Material-Design-Lite
Q & A DevFest 2016
Resources • Material Design - https://material.google.com, https://material.io • Official Website
- https://getmdl.io • Github Repository - https://github.com/google/material-design-lite • Materials Design Icons - https://materialdesignicons.com • Stackoverflow - http://stackoverflow.com/questions/tagged/material-design-lite • MDL vs Bootstrap - http://tutorialzine.com/2015/07/comparing-bootstrap-with-mdl • Web Starter Kit - https://developers.google.com/web/tools/starter-kit DevFest 2016
THANK YOU! @MaunashJani DevFest 2016