O Presente e o Futuro (Próximo) da Web

De uma simples rede para compartilhamento de documentos científicos, a web se transformou em uma plataforma global para distribuição e execução de aplicativos, seja em computadores desktop ou em dispositivos móveis. Esta palestra aborda três tendências que fazem parte desta transformação, descrevendo como elas estão acontecendo atualmente e o como devem evoluir no futuro próximo.

Transcript

1. (proximo) http://www.flickr.com/photos/loosetrucks/8886801734/
2. Lailson Bandeira Bacharel em Ciência da Computação pelo CIn/UFPE Mestre em Ciência da Computação pelo CIn/UFPE Membro do grupo de pesquisa VIISAR Fundador do Frevo on Rails quem sou
3. Lailson Bandeira Guilherme Carvalho Lucas Marinho quem somos
4. Somos um estúdio de software especializado na criação de aplicações para a web agile html css mongodb javascript ajax json rails git mysql ux cloud heroku postgres sinatra padrino amazon websockets s3 apis ui
5. amazing clients
6. yeah,
7. contato@guava.com.br facebook.com/guavasoftware Rua Alfredo Coutinho, 74 – Casa Forte Quer
8. (proximo) http://www.flickr.com/photos/loosetrucks/8886801734/
9. Web: Documentos vs. Aplicações A web foi originalmente criada para troca de documentos
10. Web: Documentos vs. Aplicações Hipertexto
11. Web: Documentos vs. Aplicações
12. Web: Documentos vs. Aplicações “HyperText is a way to link and access information of various kinds as a web of nodes in which the user can browse at will. HyperText provides a single user- interface to many large classes of stored information such as reports, notes, data-bases, computer documentation and on-line systems help. […] A program which provides access to the hypertext world we call a browser.” — Tim Berners-Lee, 1990, CERN HyperText
13. Wikipedia | World Wide Web
14. Medium | Nem tudo é protesto
15. Medium | Nem tudo é protesto
16. Amazon | Don’t make me think
17. Submarino | Kit Livros: As Crônicas de Gelo e Fogo
18. Facebook
19. GMail
20. Basecamp
21. Web: Documentos vs. Aplicações Completamente Documento Completamente Aplicação Espectro “Documento–Aplicação”
22. Web: Documentos vs. Aplicações Completamente Documento Completamente Aplicação Espectro “Documento–Aplicação”
23. Web: Documentos vs. Aplicações 3 tendências presente-futuro
24. 1. Web móvel http://www.flickr.com/photos/brandon-huang/5372672372/
25. Web Móvel 1 Há pouco tempo atrás… – Apenas computadores desktop – Resolução previsível – Conexão sempre via fio – Poucos navegadores
26. Web Móvel 1 Smartphones
27. Web Móvel 1 Tablets
28. Web Móvel 1 Notebooks e Netbooks
29. Web Móvel 1 Computadores Desktop
30. Web Móvel 1 1.2 bilhões de pessoas acessam a internet usando dispositivos móveis
31. Web Móvel 1 15% do tráfego mundial de internet vem de dispositivos móveis
32. Web Móvel 1 desafios para desenvolvedores web
33. Web Móvel 1 Diferentes tamanhos de tela
34. Web Móvel 1 Diferentes tamanhos de tela
35. Web Móvel 1 Diferentes tamanhos de tela
36. Web Móvel 1 web design responsivo
37. Desktop
38. iPad | Horizontal
39. iPad | Vertical
40. iPhone | Horizontal
41. iPhone | Vertical
42. United Pixelworkers
43. MRY
44. World Wild Life (WWF)
45. Web Móvel 1 se você trabalha com web fique ligado
46. Twitter Bootstrap
47. Zurb Foundation
48. Zurb Gallery
49. Web Móvel 1 Performance Múltiplas formas de conexão EDGE 3G Wi-fi Ethernet
50. Web Móvel 1 Performance Variação na capacidade Processador Memoria Bateria
51. Web Móvel 1 Plataformas
52. Foco no conteúdo 2 2. Foco no conteúdo http://www.flickr.com/photos/amandabraide/8074140417/
53. Foco no conteúdo 2 “Media consumption, whether of text, audio or video, is probably the activity we engage in most on our devices, and for that use case, we just want the interface to get out of the way.” — Flat And Thin Are In, Smashing Magazine
54. Foco no conteúdo 2 Começou com smartphones…
55. Foco no conteúdo 2 …continuou no Windows 8…
56. Foco no conteúdo 2 …e chegou no iOS 7.
57. Foco no conteúdo 2 skeumorfismo vs design plano
58. Foco no conteúdo 2
59. Foco no conteúdo 2
60. Foco no conteúdo 2
61. Foco no conteúdo 2
62. Foco no conteúdo 2
63. Foco no conteúdo 2
64. Foco no conteúdo 2
65. Foco no conteúdo 2
66. Foco no conteúdo 2
67. Site Leaf
68. Moving Things Design
69. How much to make an app
70. Foco no conteúdo 2 Tipografia Ryca
71. Foco no conteúdo 2 Há pouco tempo atrás… Web Safe Fonts
72. Foco no conteúdo 2 Web Fonts EOT SVG WOFF
73. Petra Sell
74. Rule of Three
75. Vgrafiks
76. Trent Walton
77. Intégral Jean Beaudoin
78. G.H.Bass & Co
79. Foco no conteúdo 2 se você trabalha com web fique ligado
80. Google Fonts
81. Typekit
82. Foco no conteúdo 2 font icons          
83. Foco no conteúdo 2 Por quê? Escalável Funcionam em qualquer tamanho e resolução. Leve Vetores são menores que imagens. Acessível Não causam problemas em leitores de tela.
84. Font Awesome
85. Foundation Icon Fonts
86. Navegadores poderosos 3 3. Navegadores poderosos http://www.flickr.com/photos/jdawn82/4386127182/
87. Navegadores poderosos 3 Há pouco tempo atrás…   Servidor Cliente HTML,
88. Navegadores poderosos 3 2004 Asynchronous JavaScript and XML
89. Navegadores poderosos 3 2004 AJAX
90. Navegadores poderosos 3 Desde então, os navegadores têm ficado cada vez mais poderosos…
91. Navegadores poderosos 3 …e Javascript se tornou uma das linguagens mais usadas do mundo.
92. Javascript | The Definitive Guide vs The Good Parts
93. Google Chrome
94. Internet Explorer
95. Firefox
96. Safari
97. Opera
98. Navegadores poderosos 3 geolocation
99. Chrome Experiments | Disc
100. Chrome Experiments | The Cloth Simulator
101. Chrome Experiments | Hello Racer
102. Chrome Experiments | Small Arms Imports / Exports
103. Zombies vs Cows
104. Trigger Rally
105. Video Tracker | VTDraw
106. tracking.js
107. tracking.js
108. talky
109. ThreeNodes.js | Editor
110. ThreeNodes.js | Play mode
111. Cloud9
112. Picozu
113. Recapitulando 1. Web móvel 2. Foco no conteúdo 3. Navegadores poderosos
114. Isto é tudo, pessoal. II CONGRESSO DE TECNOLOGIA DA INFORMAÇÃO – COALTI Apresentação realizada por Lailson Bandeira em 29/09/2013 como parte do II Congresso de Tecnologia da Informação – COALTI, disponível em https://speakerdeck.com/lailsonbm. Slides criados no Keynote com as fontes Bernino Sans, American Typewriter e Nanum Pen Script. Todos os direitos reservados. LAILSON BANDEIRA @lailsonbm http://lailson.me/ http://github.com/lailsonbm http://facebook.com/guavasoftware
115. Corey Haines & Aaron Patterson