Transição do desenvolvimento web para apps - o caminho suave

707 visualizações

Publicada em

Publicada em: Tecnologia
0 comentários
0 gostaram
Estatísticas
Notas
  • Seja o primeiro a comentar

  • Seja a primeira pessoa a gostar disto

Sem downloads
Visualizações
Visualizações totais
707
No SlideShare
0
A partir de incorporações
0
Número de incorporações
11
Ações
Compartilhamentos
0
Downloads
2
Comentários
0
Gostaram
0
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

Transição do desenvolvimento web para apps - o caminho suave

  1. 1. o caminho suave Transição do desenvolvimento web para apps
  2. 2. ou…
  3. 3. - Renan Oliveira e Felipe Ramos "Como foi o último ano"
  4. 4. globo .com Renan Oliveira renanoliveira.net
  5. 5. web
  6. 6. CLIENT-SERVER
  7. 7. o começo…
  8. 8. 1280x800px
  9. 9. Benefícios ‣ Mundo conhecido ‣ Muitas ferramentas ‣ Grande comunidade ‣ Diversas soluções
  10. 10. 1° passo
  11. 11. RESPONSIVE
  12. 12. Use ‣ Media Queries ‣ Adapte suas imagens ‣ Permita gestos ‣ Layout Flexível ‣ Adapte os menus
  13. 13. tendência
  14. 14. MOBILE FIRST
  15. 15. Progressive Enhancement Seguindo a linha
  16. 16. app
  17. 17. 2° passo
  18. 18. WebView
  19. 19. "Jeito mais barato de validar se uma app faz sentido" Seguindo a estrada
  20. 20. Quem usou/usa?
  21. 21. Titanium Kivy Cordova
  22. 22. Cordova JS API Cordova Native Lib Cordova Native Lib Cordova JS API Cordova Native Lib Cordova JS API Android Framework + SDKs iOS Framework + SDKs Silverlight Framework + Windows Phone SDK
  23. 23. API Built-in ‣ Accelerometer ‣ Camera ‣ Connection (wi-fi, 3g e etc) ‣ Geolocation ‣ Notification ‣ Storage
  24. 24. Geolocation
  25. 25. "Podemos fazer código nativo e trazer via JS para app" Plugins
  26. 26. git.io/2pLd_Q Cordova PhoneCallTrap renanoliveira/cordova-phone-call-trap
  27. 27. EXISTEM PROBLEMAS!
  28. 28. ‣ Animações ‣ Evite reflow do HTML ‣ Falta de padronização das respostas do celular ‣ WebView antiga é igual codar para o IE6 ‣ Alert Driven Development Problemas
  29. 29. 3° passo
  30. 30. NATIVO
  31. 31. "Ainda podemos usar WebView" WebView + Nativo
  32. 32. "Procurando mais fluidez, maior performance, um passo além do que você conseguiu até agora." Nativo
  33. 33. 3.2% 4.2% 7.1% 85.1% Android iOS Windows BlackBerry Bada Gartner - SmartPhone by OS Market Share - Brazil 2013 AndroidWin!
  34. 34. ‣ Code em qualquer ambiente ‣ Android Studio ‣ Java Android ‣ Muitos devices ‣ Emulador lento ‣ API em evolução
  35. 35. My 2cents
  36. 36. ‣ Precisa de um Mac ‣ É pago para gerar o pacote ‣ Objective-C iOS ‣ Poucos devices ‣ Ótimo simulador ‣ API madura
  37. 37. Nativo Híbrido HTML Natural para desenvolvedores web Acesso a API nativa Distribuido via APP Store Atualização instantânea Distribuição irrestrita Natural para desenvolvedores web Interações avançadas de uso/layout Altamente performático Distribuido via APP Store Capacidade plena Capacidade parcial Uma plataforma Múltiplas plataformas
  38. 38. e o futuro…
  39. 39. GLASS
  40. 40. AndroidWear
  41. 41. Baseado em movimento
  42. 42. Assistente Pessoal
  43. 43. "O importante é o seu conteúdo, a sua ideia, aonde ele vai aparecer tá nas mãos dos usuários"
  44. 44. IWantToWorkAtGlobocom github.com
  45. 45. globo .com Obrigado! renanoliveira.net
  46. 46. Referências ‣ http://www.dipockdas.com/2012/11/its-hybrid.html ‣ http://chelramsey.com/phonegap-vs-native-builds-a-12-month-review/ ‣ http://www.risingj.com/archives/267 ‣ http://designshack.net/articles/css/mobilefirst/ ‣ http://adrocknaphobia.github.io/preso-future-of-mobile/#/ ‣ http://myshadesofgray.wordpress.com/2014/04/15/hybrid-applications-and-android-native-browser/ ‣ http://shineravindra.wordpress.com/2013/05/20/hybrid-mobile-app-development-using-phonegap-a-case-study-for-beginners/ ‣ http://sa.inceptum.eu/sites/sa.inceptum.eu/files/Content/Phonegap%20Lecture%20Notes.pdf ‣ http://www.passion4teq.com/articles/ios-android-development-comparison-1/ ‣ http://www.passion4teq.com/articles/ios-android-development-comparison-2/ ‣ http://www.forbes.com/sites/anthonykosner/2014/02/15/web-apps-raise-the-ceiling-above-html5-as-famo-us-recreates-facebooks- paper/ ‣ http://techcrunch.com/2012/12/13/facebook-android-faster/ ‣ http://arquiteturadeinformacao.com/user-experience/5-coisas-que-aprendi-em-um-projeto-mobile-first-responsive-design-para-o- google/ ‣ http://tableless.com.br/faut-tolerant-base-progressive-enhancement/

×