8. Tamanho da tela
Quantidade de cores suportadas
Capacidade de processamento
Capacidade de armazenamento
Tempo de vida da bateria
Mecanismos de interação limitados
Largura de banda e custo de plano
de dados
Falta de padronização no suporte à
mídias
9. Uma visão direta (ágil) sobre
desenvolvimento móvel
http://futurefriend.ly/
10. Tela grande Parada
Focada
Entrada
eficiente Confortável
Conexão rápida
CPU poderoso
CONTEXTO
15. Responsive Web design
• O mesmo HTML para todos os dispositivos;
• Grid flexível; @media screen and (min-width: 480px) { .content {
• Media queries; } .social_icons {
float: left;
• Imagens flexíveis; }
display: none
• Não há adaptação de conteúdo no servidor;
• Resolve bem o problema de resolução de
browser;
• Future-friendly;
• Manipulação ineficiente de imagens, se não
tomar cuidado;
• Só resolve problema da resolução;
16. Mobile
First
Luke Wroblewski
http://static.lanyrd.net/cropped-profile-photos/6bc54848de8f99c13a1025ac9420b96b01257e09.jpg
17. Progressive Enhacement
• O mesmo HTML “base” para todos os dispositivos;
• Java script para cada perfil;
• Melhoramento progressivo, de acordo com a
demanda;
• A adaptação vai mais para o lado cliente;
• Resolve bem o problema de resolução de
browser e já ocorre uma adaptação mais fina;
• Confiar demais na engine do navegador
cliente;
• Mesmo HTML e imagens continuam...
20. Server-side adaptation
• Mais antiga e mais utilizada em grandes aplicações;
• Detecção de dispositivo e entrega de
conteúdo refinado;
• Usada por Google, Facebook, Amazon,Youtube, eBay,
Yahoo, INF-UFG...;
• “It is difficult to find a successful mobile website that
does not use server-side content adaptation” goMobi;
• Maior adaptação possível, com riqueza de
detalhes;
• Bibliotecas de detecção de dispositivo com
preço caro;
• Maior tempo de implementação;
22. Mobile browsers
• Muita diversidade;
• Alguns muito limitados;
• Alguns muito inovadores;
• Alguns baseados em proxy;
• A maioria sem documentação;
• A maioria sem ferramentas de debug.
23. Mobile browsers
• Interação
• Baseados em cursor;
• Baseados em touch;
• Baseados em multi-touch;
• Alguns com suporte a zoom;
• Alguns desconhecidos dos
desenvolvedores.
25. JQuery Mobile não é
• Um framework alternativo ao JQuery
comum;
• Um SDK com compilação híbrida/nativa;
• Um framework para fazer tudo com
JavaScript;
• Uma solução para todas as aplicações;
26. JQuery Mobile é
Framework multi-plataforma
para criação de webapps cuja
interface de usuário acontece
via touch.
27. Web app
• Site ou serviço que roda dentro do
contexto de um browser.