Mobile Apps Cross-Platform

  • 1,457 views
Uploaded on

Palestra sobre Mobile Apps Cross-Platform realizada por Adriel Café na Semana Cientifica da FAZAG (26/10/12)

Palestra sobre Mobile Apps Cross-Platform realizada por Adriel Café na Semana Cientifica da FAZAG (26/10/12)

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
1,457
On Slideshare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
41
Comments
0
Likes
2

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. MOBILE APPS CROSS-PLATFORMAdriel Caféac@adrielcafe.com/adrielcafe@adrielcafe/in/adrielcafe
  • 2. Plataformas
  • 3. Tantas plataformasTantas linguagens Tão pouco tempo Tão pouco dinheiro Precisamos fazer escolhas...
  • 4. Como anda o mercado? Parcela do Mercado Sistema Operacional (2º Sem. 2012)Android 68,1 %iOS 16,9 %BlackBerry 4,8 %Symbian 4,4 %Windows Phone 2,5 %Outros 2,4 % Fonte: IDC Worldwide Mobile Phone Tracker, 8 de Agosto de 2012
  • 5. Mas ainda assim enfrentamos um grande desafio: Criar aplicativos multi-plataforma
  • 6. O que os desenvolvedores querem? Fonte: Developer Economics 2012 (developereconimics.com), Junho de 2012
  • 7. • .NET Framework (C#, • Java, C/C++, HTML5, Adobe Visual Basic, F#, AIR IronPython, IronRuby...) • Android Runtime• Visual Studio• Objective-C • Java, C++• X Code • Eclipse, NetBeans, MotoDev...• Mac OS • Open Source
  • 8. Objective-C C++ Java C# Adobe AIR Visual Basic Como criar um aplicativo multi-plataforma neste cenário?Visual Studio Eclipse NetBeans MotoDev
  • 9. Tecnologias Web
  • 10. Tecnologias Web• Arquitetura Cliente-Servidor• Rodam em quase todas as plataformas existentes• Fáceis de aprender• Rápido desenvolvimento
  • 11. Tecnologias Web Disponível em: http://goo.gl/aX8yE
  • 12. HTML5, CSS3 & JavaScript
  • 13. HTML5
  • 14. CSS3• Novas propriedades • @font-face • Border-radius • Box-shadow • Opacity • Transform • Transition • Resize • ...
  • 15. JavaScript• Linguagem client-side• Orientada a objetos• Tipagem fraca e dinâmica• Possui milhares de API’s • AJAX, JQuery, ExtJS, Node.js, GWT, MooTools, RaphaëlJS...
  • 16. Estão pensando o mesmo que eu? Que tal utilizar tecnologias web para criar aplicativos móveis multi-plataforma?
  • 17. Mobile Apps Cross-Platform
  • 18. Mobile Apps Cross-Platform• Write Once, Run Anywhere• Utiliza, na maioria das vezes, tecnologias web• Técnicas utilizadas • JavaScript Frameworks • jQuery Mobile, Wink, Zepto JS, LimeJS... • App Factories • AppMkr, Tiggzi, Mobjectify... • Web-to-native wrappers • Sencha Touch, PhoneGap, MoSync... • Runtimes • Titanium Mobile, Unity, Adobe Air, AppMobi...
  • 19. Mobile Apps Cross-Platform• Reduzem drasticamente o custo e tempo de desenvolvimento• Permitem que os web developers possam reutilizar seus conhecimentos em uma nova plataforma
  • 20. Frameworks mais utilizadosFonte: Cross-Platform Tools 2012 (crossplatformtools.com), Fevereiro de 2012
  • 21. Solução perfeita? Não.Nem tudo são flores...
  • 22. Native App, Web App & Hybrid App
  • 23. Native AppPrós•Melhor performance•UI nativa•Pode armazenar mais informações offline•Disponível nas App Stories•Acesso a todas as funcionalidades do aparelho•Instalado no aparelhoContras•Mais demorado e custoso para desenvolver•Suporta apenas uma plataforma•Precisa ser aprovado para ser publicado na App Store
  • 24. Web AppPrós•Utiliza tecnologias web (HTML5, CSS3 & JavaScript)•Suporta múltiplas plataformas•Não é preciso ser aprovado nas App Stories•Atualizações instantâneasContras•Linguagem interpretada•Não possui acesso a todas as funcionalidades do aparelho•Não pode ser encontrado nas App Stories
  • 25. Hybrid AppPrós•Utiliza tecnologias web (HTML5, CSS3 & JavaScript)•Suporta múltiplas plataformas•UI nativa (suportado por alguns frameworks)•Pode armazenar mais informações offline•Disponível nas App Stories•Instalado no aparelho•Suporta muitas funcionalidades do aparelhoContras•Linguagem interpretada•Precisa ser aprovado para ser publicado na App Store
  • 26. Qual a melhor opção?• O aplicativo requer o uso de alguma funcionalidade especial? (Câmera, acelerômetro, GPS, armazenamento...)• Qual o seu orçamento?• O aplicativo requer conexão com a internet?• Quantas plataformas você pretende suportar?• Quais linguagens de programação eu, ou minha equipe, domina?• A performance é muito importante?• O tempo é curto?
  • 27. Ferramentas Cross-Platform
  • 28. • Baseado no jQuery e jQuery UI• Suporta as plataformas iOS, Android, Windows Phone, BlackBerry, WebOS, Bada, MeeGo, Symbian• Possui o Download builder<!DOCTYPE html><html lang="en"> <head> <title>Hello jQuery Mobile</title> <link rel="stylesheet“ href="http://code.jquery.com/jquery.mobile.min.css" /> <script src="http://code.jquery.com/jquery-1.5.2.min.js"></script> <script src="http://code.jquery.com/mobile/jquery.mobile-1.0a4.min.js"></script> </head> <body> <div data-role="page"> Hello jQuery Mobile </div> </body></html>
  • 29. • Suporta as plataformas Android, iOS e Blackberry• Baseado nas bibliotecas javascript ExtJS, jQTouch e Raphaël• Possui sua própria IDE: o Sencha Architect• Possui a extensão Sencha Animator• Roda apenas na engine webkit• Documentação perfeita Ext.application({ launch: function () { Ext.create(Ext.Panel, { fullscreen: true, html: Hello World! }); } });
  • 30. • Suporta as plataformas iOS, Android, Blackberry, Symbian, Bada e Windows Phone• Possui suas próprias APIs javascript que possibilitam o uso de recursos nativos que as plataformas oferecem var showMessageBox = function() { navigator.notification.alert("Hello World!"); } function init(){ document.addEventListener("deviceready", showMessageBox, true); }
  • 31. • Suporta as plataformas iOS, Android e Blackberry (beta)• Possui sua própria IDE: o Titanium Studio• Possui sua própria loja virtual: a Appcelerator Marketplace• Suporta as linguagens server-side PHP, Python e Ruby• Possui suas próprias APIs javascript que possibilitam o uso de recursos nativos que as plataformas oferecem var winHello = Titanium.UI.createWindow(); var lblHello = Titanium.UI.createLabel({ text: Hello World!, }); winHello.add(lblHello); winHello.open();
  • 32. Conclusão“Cada caso é um caso” (Autor desconhecido)
  • 33. JOptionPane.showMessageDialog(null, "Muito Obrigado!“);System.exit(0); Adriel Café ac@adrielcafe.com /adrielcafe @adrielcafe /in/adrielcafe