Palestra realizada em conjunto com Carla Nicole Calheiros, graduanda em ciência da computação e web developer, na Semana de Tecnologia do Instituto Federal de Alagoas. Com foco em front-end development, a palestra visou mostrar a necessidade de ter um design fluído nas aplicações, no caso com Material Design, e mostrar ferramentas que auxiliam esse processo.

1. PRETTY MATTERS
Web Components, Material Design and
Polymer

2. <about-us>
</about-us>
Maria Clara Santana
- Computer Engineering Student
- Artificial Intelligence Researcher
- Web developer
Carla Nicole Calheiros
- Computer Science Student
- Web Developer

3. Web Components ?

4. Web Components

5. ● Templates
● Shadow DOM
● HTML Imports
● Custom Elements

6. Material Design

8. Goals
- Create a visual language that
synthesizes classic principles
of good design with innovation
and possibiity of technology
and science

9. Goals
- Develop a single underlying system that
alows for a unified experience across
plataforms and devices sizes. Mobile
precepts are fundamental, but touch,
voice, mouse and keyboard are all first-
class input methods.

10. Principles
Material is the
metaphor
Bold, graphic,
intentional
Motion provides
meaning

12. Now we know about
Web Components and
Material Design
How do we use them
together?

13. polymer

14. WHAAAAAAAT???

15. “Web components usher in a new era of web development
based on encapsulated and interoperable custom
elements that extend HTML itself. Built atop these new
standarts, Polymer makes it easier and faster to create
anything from a buttom to a complete application across
desktop, mobile and beyond.”
Description

16. One more thing
Polymer was born to die

17. So why should
I care?

18. Why use Polymer?

20. Do you wanna sit and wait?
Only watch the world moving
around you? Don’t wait.
Join the revolution!

21. POLYMER 0.8
Easier. Faster. Better.
ALPHA

22. (Available on https://www.polymer-project.org/0.8/#benchmarks)

24. Polyfill library

25. Element registration

26. Local DOM template

27. Declared properties

28. Join the revolution: Learn!

30. polymer-project.org

31. Join the revolution: Build!

32. yeoman.io

33. polymer-designer.appspot.com/

34. CHROME DEV
EDITOR

35. Join the revolution: Share!

36. customelements.io

37. <contact-us>
</contact-us>
Carla Nicole Calheiros
+CarlaNicoleCalheirosP
nicole.calheiros@gmail.com
Maria Clara Santana
+MariaClaraSantana1
claarasantana@gmail.com

38. <thank-you>