Aula introdutória sobre como é o processo de construção de aplicativos móveis para smartphones e tablets. Apresenta como está o cenário atual, o que muda em relação ao desenvolvimento tradicional e como ferramentas como PhoneGap e Sencha Touch podem ser usadas para aumentar a produtividade no segmento de aplicativos móveis.

1. Desenvolvimento de aplicativos móveis
com Phonegap e Sencha Touch
Prof. Leonardo Soares
Campus Garanhuns
S

2. Sobre o curso
S Carga-horária: 28 horas
S Dias na semana: quinta-feira
S Pré-requisitos:
S Conhecimento em HTML
S Conhecimento em JavaScript
S Conhecimento em Java e Orientação a objetos
S Critérios de aprovação:
S Projeto do término do curso
S Até 25% de faltas

3. Sobre o professor
• Mestre em engenharia de software pela UFCG
• Professor do Instituto Federal de Pernambuco
• Forum Nokia Champion (2007, 2008)

4. E vocês?
• Como se chamam?
• Quais as perspectivas com o curso?
• Já programam para dispositivos móveis?

5. Por que estamos neste curso?
• 253 milhões de celulares no Brasil [Anatel/2012]
• 27 milhões são smartphones (14% da população
brasileira) [MMA-IMA2012]
• Aproximadamente 50 bilhões de downloads de
aplicativos realizados [Google-Apple/2012]
• Mais de 5 bilhões de doláres pagos aos
desenvolvedores [Google-Apple/2012]

6. O Que iremos aprender no
curso?
S O que são aplicativos móveis
S Rápidamente HTML e Javascript
S Padrões de projeto
S Diferença entre aplicações nativas e aplicações móveis para
web
S Desenvolvimento de aplicações com PhoneGap
S Desenvolvimento de aplicações com Sencha Touch 2
S Integração de ambos

7. Afinal, o que são
smartphones?
• Combinação dos recursos de telefones
móveis com a computação (daí surge o termo
smart)
• Principais características destes aparelhos:
• Sistema operacional aberto a aplicações
• Telas maiores que o convencional
• Teclado QWERTY ou touch-screen
• Conectividade de alta velocidade: 3G, WI-FI
• O uso como telefone praticamente passa
para o segundo plano

8. E tablets?
• Computador móvel com tela
touchscreen de 5” a 12”
• Removemos as limitação das telas
pequenas dos smartphones,
aproveitando todos seus benefícios
• Mais processamento e memória em
comparação aos smartphones
• Mesmo sistema operacional

9. Usos de smartphones e
tablets
• Como uma extensão de nosso computador
• Para uso de recursos de GPS e câmera
• Como nossa carteira (NFC)
• Como forma de acompanhar nossos exercícios físicos
• Avaliar a situação de nosso carro
• Dentre outras possibilidades…

10. Qual o nosso alvo com o
desenvolvimento para dispositivos
móveis

11. Mas também pode incluir…

12. O Que precisamos saber?
• Precisamos entender o que muda em relação ao
desenvolvimento para desktop
• Conhecer os sistemas operacionais móveis
existentes
• Definir a linguagem de programação que será
utilizada

13. O Que muda em relação ao
desenvolvimento tradicional?
S Nossos aplicativos passarão a “ir” com seus usuários
S Em geral são adaptadas a estes dispositivos
S Podemos trazer o diferencial de nossa aplicação ao usar
os recursos que os dispositivos móveis nos oferecem

14. Aplicações legais

15. Market share dos sistemas
operacionais
Mercado em 2012 (Gartner)
0% 2% Symbian
5%
6%
RIM
iOS
19%
Microsoft
3% Mobile
65%
0% Linux
Android

16. Qual linguagem de
programação utilizar?
S Android – Java e C++
S Windows Phone – C#
S iOS – Objective C
S Dentre outros..

17. Aplicações nativas
• São desenvolvidas utilizando a linguagem de
programação padrão suportada pelo sistema
operacional
• Em geral são mais rápidas e possuem maior acesso
aos recursos dos dispositivos
• Aplicações são instaladas diretamente no smartphone
ou tablet
• Normalmente são baixadas através de lojas de
aplicativos como Play Store ou AppStore

18. Desenvolvimento de
aplicações nativas
E para desenvolver para Symbian, Windows Phone, Bada ou Blackberry

19. Qual o problema?
S Um aplicativo para cada sistema operacional
S Tempo e custo
S Conhecer várias linguagens de programação
S Tempo, custo e dificuldade em encontrar pessoal
capacitado

20. Qual a solução? Aplicações
web
S Uma vez prontas funcionam em qualquer browser
independente de sistema operacional
S Utilizamos apenas uma linguagem, com recursos padronizados
que facilitam o desenvolvimento
S Porém trazem alguns problemas:
S Acesso limitado aos recursos do hardware
S Necessidade de conexão com a Internet
S Falta de padronização nos componentes visuais da aplicação
S Não podem ser comercializadas em app stores

21. Qual a solução? Aplicações
híbridas
S O ideal seria escrever apenas um código que pudesse
ser executado/compilado para todas as plataformas
S Melhor a linguagem utilizada fosse fácil de aprender e
padronizada
S Um intermediário entre as aplicações nativas e
aplicações para web
S Trás o verdadeiro conceito de Write once, Run anywhere

22. Aplicações híbridas

23. Por que desenvolver com
estes frameworks é legal?
S A curva de aprendizado de HTML, CSS e JS é
extremamente baixa
S Estamos trabalhando com tecnologias muito recentes
S Há grandes empresas por trás
S MIT
S Adobe
S Micosoft
S Dentre outras…

24. Comparativo entre aplicações
nativas, web e híbridas
Nativas Web Híbridas
Cross- Não Sim Sim
plataforma
Empacotada Sim Não Sim
App Store Sim Não Sim
API do Sim Não Sim
dispositivo

25. Sencha Touch
S É um framework para construção de aplicativos móveis
cross-plataform baseados em HTML5, JavaScript e CSS
S Muito utilizado principalmente para construir a interface
gráfica da aplicação (com um visual similar às aplicações
nativas)

26. Interação de um aplicativo
Sencha
Nosso aplicativo
É um browser sem bordas
e botões

27. Funcionalidades do Sencha
Touch

28. Plataformas suportadas –
Sencha Touch

29. Plataformas suportadas –
Sencha Touch

30. PhoneGap
S É um framework para construção de aplicativos móveis baseados
em HTML5, JavaScript e CSS
S Difere do SenchaTouch pelo seu foco ser em oferecer recursos
nativos dos dispositivos móveis às aplicações que o utilizam
S Sua API em JavaScript faz a ponte entre os recursos nativos dos
dispositivos (que precisariam ser acessados através de uma
linguagem de programação nativa) com a nossa aplicação
HTML/JS

31. Funcionalidades do PhoneGap

32. Desenvolvimento com
PhoneGap

33. Funcionamento - PhoneGap
Créditos: Introduction to PhoneGap/Mihail Corlan

34. Plataformas suportadas -
PhoneGap

35. PhoneGap + Sencha Touch
Créditos: Creating and distributing mobile web applications with PhoneGap/James Pearce

36. PhoneGap + Sencha Touch
Créditos: Creating and distributing mobile web applications with PhoneGap/James Pearce