Desenvolvimento HTML5 para Smartphones e Tablets BlackBerry

1,710 views
1,563 views

Published on

PDF com slides da palestra na UNICAP sobre desenvolvimento HTML5 para Smartphones e Tablets BlackBerry.

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,710
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
23
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Desenvolvimento HTML5 para Smartphones e Tablets BlackBerry

  1. 1. DESENVOLVIMENTO HTML5 PARASMARTPHONES E TABLETSBLACKBERRYBruno Mota e Felipe Andrade
  2. 2. vídeo exibido em 26 de Agosto de 2012
  3. 3. Exemplos• Cute the Rope: jogo criado em HTML 5 com uso intenso de física e gráficos dinâmicos• Games em HTML5: agregador de games em HTML5• Red Hot Chili Peppers: clipe interativo muito bacana!• Draw a Stick Man: interaja com o desenho!
  4. 4. HTML5 no seu BlackBerry• Uma das principais apostas da RIM para acelerar o crescimento no número de aplicativos na promissora plataforma BlackBerry 10• Roda como um aplicativo nativo• O navegador apresenta um dos melhores suportes ao padrão HMTL5 entre os líderes de mercado
  5. 5. Quais as vantagensde desenvolver apps nativos com HTML5?
  6. 6. HTML5 no seu BlackBerry• Roda como um aplicativo standalone• Utilize frameworks como o Sencha®, PhoneGap®, jQuery® ou Dojo®• Adicione funcionalidades nativas em seu aplicativo HTML5 (ex: BBM, PIM, etc)• Desenvolva apps apenas com HTML5, JavaScript e CSS• Distribuição e venda através da loja App World
  7. 7. BlackBerry® WebWorks™ É a plataforma de desenvolvimento para criação de aplicativos para o tablet BlackBerry PlayBook e para os smartphones BlackBerry usando HTML5, JavaScript e CSS.
  8. 8. BlackBerry® WebWorks™• Permite que os desenvolvedores escolham as próprias ferramentas para testar e desenvolver. Se encarrega de empacotar aplicativos para tablets e smartphones BlackBerry.• Plataforma web aberta em todos os sentidos possíveis.• Principal objetivo? Avançar ao estado da arte todos os aplicativos mobile com HTML5.
  9. 9. Como testar o seu aplicativo?• É mais simples do que você imagina.• Basta digitar o endereço de um site que está rodando o seu app BlackBerry WebWorks no Ripple Emulator
  10. 10. Como começar?BB10 WebWorks SDK: crie apps para o BlackBerryAlpha 10 Dev ou BlackBerry Simulator 10.Ripple: emule os seus aplicativos utilizando o GoogleChrome.BlackBerry Graphical Aid: instale e crie aplicativospara a plataforma BlackBerry.WebWorks Samples: exemplos de projetos HTML5para você testar a integração com característicasnativas (GPS, Acelerometro, in-app-purchase).
  11. 11. É FÁCIL COMEÇAR! <!DOCTYPE html>
  12. 12. O que é o HTML5?• Evolução incremental do padrão HTML• Linguagem melhor preparada para criação de aplicações web e multiplataforma• Independente de plugins• Empresas como a Apple, Mozilla, Opera e Microsoft apoiam o projeto
  13. 13. O que posso utilizar?• WebGL (3D) • Orientação do dispositivo• Canvas (2D) • Detecção de Modo• Gráficos Vetoriais (SVG) Offline• Áudio e Vídeo • Armazenamento local• Geolocalização • Novas tags
  14. 14. QUAKE2 NO BROWSER http://goo.gl/mB74
  15. 15. NOSSAS DICASque vão te custar R$ 1 milhão!!! :)
  16. 16. Singleton PatternOrganize o seu projeto em um “JSON”
  17. 17. Benefícios• Organização de dados e padrão de projeto• Agrupamento de Atributos e Métodos• Ótimo para Iniciantes
  18. 18. Exemplovar APP = APP || {};App.Home: { setUp: function() { }}
  19. 19. CCS3• Media Queries• Seletores@media (orientation: portrait) { background-image: url(bg.png);}.item:checked { background-color: #FF0000;};
  20. 20. CASE: APP SEBRAE LIKE A BOSS•É possível desenvolver e publicar aplicativos paraBlackBerry PlayBook em menos de 12 horas•Instalado em 16 tablets BlackBerry PlayBook na açãoSEBRAE LIKE A BOSS que aconteceu na CampusParty Recife 2012•Cadastro de dados de participantes da Campus Party,Armazenamento Offline com Local Storage, Cache dearquivos e Sincronização de dados com Servidor WEB
  21. 21. Anatomia de um App
  22. 22. Obrigado!!! Bruno Mota @bruno_motaFelipe Andrade @felipeandrade

×