mobile apps cross-platform
Post on 18-Jan-2015
1.503 Views
Preview:
DESCRIPTION
TRANSCRIPT
MOBILE APPSCROSS-PLATFORMMOBILE APPSCROSS-PLATFORM
ac@adrielcafe.com
/adrielcafe
@adrielcafe
/in/adrielcafe
Adriel Café
Plataformas
Precisamos fazer escolhas...
Tantas plataformasTantas linguagens
Tão pouco tempoTão pouco dinheiro
Sistema OperacionalParcela do Mercado
(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
Como anda o mercado?
Mas ainda assim enfrentamos um grande desafio:
Criar aplicativosmulti-plataforma
Fonte: Developer Economics 2012 (developereconimics.com), Junho de 2012
O que os desenvolvedores querem?
• .NET Framework (C#, Visual Basic, F#, IronPython, IronRuby...)• Visual Studio
• Java, C/C++, HTML5, Adobe AIR• Android Runtime
• Objective-C• X Code• Mac OS
• Java, C++• Eclipse, NetBeans, MotoDev...• Open Source
Java
C#
Objective-C
Visual Basic
Visual Studio
C++
EclipseMotoDevNetBeans
Como criar um aplicativo multi-plataforma neste cenário?
Adobe AIR
Tecnologias Web
Tecnologias Web• Arquitetura Cliente-Servidor• Rodam em quase todas as plataformas existentes• Fáceis de aprender• Rápido desenvolvimento
Tecnologias Web
Disponível em: http://goo.gl/aX8yE
HTML5, CSS3 & JavaScript
HTML5
CSS3• Novas propriedades• @font-face• Border-radius• Box-shadow• Opacity• Transform• Transition• Resize• ...
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...
Estão pensando o mesmo que eu?
Que tal utilizar tecnologias webpara criar aplicativos móveis
multi-plataforma?
Mobile Apps Cross-Platform
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...
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
Fonte: Cross-Platform Tools 2012 (crossplatformtools.com), Fevereiro de 2012
Frameworks mais utilizados
Nem tudo são flores...
Solução perfeita? Não.
Native App, Web App & Hybrid App
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 aparelho
Contras•Mais demorado e custoso para desenvolver•Suporta apenas uma plataforma•Precisa ser aprovado para ser publicado na App Store
Web AppPró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
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 aparelho
Contras•Linguagem interpretada•Precisa ser aprovado para ser publicado na App Store
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?
Ferramentas Cross-Platform
• 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>
• 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!' }); }});
• 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); }
• 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();
Conclusão
“Cada caso é um caso”(Autor desconhecido)
JOptionPane.showMessageDialog(null, "Muito Obrigado!“
);System.exit(0);
ac@adrielcafe.com
/adrielcafe
@adrielcafe
/in/adrielcafe
Adriel Café
top related