Angular Material
Reward your app with
high-quality UI
in minutes
Maxim Salnikov
@webmaxru
-
Google Developer Expert in Angular
-
Angular Oslo Meetup organizer
-
ngVikings Conference organizer
Products from the future
UI Engineer at ForgeRock
Google Experts are a global network of experienced product strategists, designers, developers and marketing professionals actively supporting developers, startups and companies changing the world through web and mobile applications.
Google Developer
Experts
How to...
Material Design
Material is the metaphor
Bold, graphic, intentional
Motion provides meaning
20+ Components
Visual Language
Implementations
Material UI
Materialize
Material Design Lite
Angular
A complete application development
frameworkplatform
Angular Material
A set of high-quality UI components
Internationalized and accessible
Performant
Customizable
Well-documented
Cross-platform
Angular Material
b.3
Why to use?
Quick UI bootsrapping
Check the best practices
Essential choice for "materialized" apps
Foundation for UI libs
Upcoming features
More components
Better testing
API docs / Guides
Common UI / Component toolkit
New features /
Better testing
Unit
E2E
Performance
Screenshots
Accessibility
New features /
Common UI toolkit
Overlays
Gestures
Responsive
Accessibility
More cool
things
Mini-workshop time!
Tour of Material Heroes
Original
Materialized
http://bit.ly/material-workshop
Accessibility
A product is accessible when all people – regardless of ability – can navigate it, understand it, and use it successfully. Products should aim to be accessible to the widest possible audience.
WAI-ARIA
ARIA Roles
main
article
banner
...
ARIA States and Properties
aria-hidden
aria-invalid
aria-disabled
aria-valuemin
...