Mobile Apps Cross-Platform

1. MOBILE APPS CROSS-PLATFORM Adriel Café ac@adrielcafe.com /adrielcafe @adrielcafe /in/adrielcafe

2. Plataformas

3. Tantas plataformas Tantas 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 utilizados Fonte: 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 App Pró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 aparelho Contras •Mais demorado e custoso para desenvolver •Suporta apenas uma plataforma •Precisa ser aprovado para ser publicado na App Store

24. Web App Prós •Utiliza tecnologias web (HTML5, CSS3 & JavaScript) •Suporta múltiplas plataformas •Não é preciso ser aprovado nas App Stories •Atualizações instantâneas Contras •Linguagem interpretada •Não possui acesso a todas as funcionalidades do aparelho •Não pode ser encontrado nas App Stories

25. Hybrid App Pró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 aparelho Contras •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

Mobile Apps Cross-Platform

Esté a ler uma amostra.

Confira estes a seguir

Mobile Apps Cross-Platform

Mais Conteúdo rRelacionado

Diapositivos para si (20)

Semelhante a Mobile Apps Cross-Platform (20)

Mais de Adriel Café (8)

Mais recentes (20)