Playground with canvas.

Canvas é uma tela de bitmap que pode ser usada para a renderização de elementos gráficos ou outras imagens visuais rapidamente. No HTML5 ele permite que se desenhem elementos gráficos usando JavaScript. Vamos abordar funcionalidades e recursos e porque você deveria estar pensando em utilizar o canvas no seu próximo projeto.

Transcript

1. Playground @raphamundi 2015 with CANVAS
2. @raphamundi
3. O fantástico mundo do canvas
4. Conte me mais sobre esse canvas…
5. Canvas
6. Canvas goo.gl/73dd0A
7. Okay, mas o que eu consigo fazer de legal com o Canvas ?
8. SWOOOP playcanv.as/p/JtL2iqIH
9. LucidChart lucidchart.com/documents/demo
10. Inception Experiment raphamorim.com/canvas-experiments/inception
12. Sim, Mas esse é só o topo do iceberg :)
13. <canvas> <canvas width="500" height="500"></canvas>
14. <canvas> <canvas width="500" height="500"></canvas> var canvas = document.querySelector(“canvas”), contexto = canvas.getContext(“2d”);
16. Sim, Saber geometria ajuda bastante ;)
17. Coordinates y x (0, 0) (largura, altura)
18. CODE TIME !
19. requestAnimationFrame
20. requestAnimationFrame paulirish.com/2011/requestanimationframe-for-smart-animating/
21. Object Recognize + Canvas
22. Object Recognize + Canvas
23. Object Recognize + Canvas raphamorim.com/canvas-experiments/scroll
26. engineering.flipboard.com/2015/02/mobile-web/
27. engineering.flipboard.com/2015/02/mobile-web/
29. github.com/raphamorim/ awesome-canvas