projetando experiências mobile
TRANSCRIPT
P R O J E TA N D O E X P E R I Ê N C I A S M O B I L E
C E S A R B A R I Z O N A L F R E D O S C H A I T Z A
P O R Q U E M O B I L E I M P O R TA ?C R E S C I M E N T O
P R O B L E M A S E N E C E S S I D A D E S
C O N T E X T O D E U S O
C O M P O R TA M E N T O S
C R E S C I M E N T O _ V E N D A S
As previsões eram de que a venda de smartphones ultrapassaria o comércio global de desktops, laptops e notebooks em 2012.Isso aconteceu dois anos antes, no último quarto de 2010.
2010
2012
C R E S C I M E N T O _ V E N D A S
Previa-se que 1 bilhão de smartphones seriam despachados em 2016.
Isso já acontece agora.
Smartphones
PCs
Tablets
C R E S C I M E N T O _ P R I O R I Z A Ç Ã O D O G O O G L E PA R A S I T E S M O B I L E F R I E N D LY
A partir de abril de 2015, o Google prioriza sites mobile friendly como resultados de busca feita em smartphones.
http://googlewebmastercentral.blogspot.com.br/2015/02/finding-more-mobile-friendly-search.html
C R E S C I M E N T O _ U S O
6 em cada 10 espectadores usam o mobile ao mesmo tempo que assistem TV.
62% dos usuários têm mais de 25 anos
47% dos usuários de smartphones são da classe C, totalizando mais de 48,3 milhões de pessoas.
A classe C movimenta 495 bilhões de reais em renda própria por ano.
P R O B L E M A S E N E C E S S I D A D E S _ P O N T O S D E C O N TAT O
O mobile muitas vezes é o único ponto de contato do usuário com a internet.
P R O B L E M A S E N E C E S S I D A D E S _ I N Ú M E R A S T E L A S
Mais de 34 resoluções diferentes são comuns no mercado.
http://stats.areppim.com/stats/stats_mobiresxtime.htm
C O N T E X T O S D E U S O _ F AT F I N G E R F R I E N D LY
Considere suas áreas de toque para necessidades diferentes.
C O N T E X T O S D E U S O _ AT E N Ç Ã O R E D U Z I D A
Seu usuário pode estar em qualquer lugar, fazendo qualquer outra coisa.
C O N T E X T O S D E U S O _ L I M I TA Ç Ã O D E E S PA Ç O
Seja direto, não há lugar para excessos.
C O N T E X T O S D E U S O _ C O N E X Ã O
Smartphones nem sempre contam com uma conexão de dados estável.
C O M P O R TA M E N T O S _ A M B I E N T E S E H O R Á R I O S D E U S O
Se antes a navegação acontecia em momentos específicos do dia, em um determinado ambiente e contexto apropriados, hoje ela é muito mais constante, fluida e feita em vários dispositivos e espaços ao mesmo tempo: o usuário pode começar no smartphone e terminar na televisão.
Morning7 a.m.
Commute10 a.m.
Work11 a.m.
Lunch12 a.m.
Meeting4 p.m.
Dinner8 p.m.
Movie10 p.m.
C O M P O R TA M E N T O S _ P R O X I M I D A D E E P E R S O N A L I Z A Ç Ã O
O smartphone tornou-se um pertence muito próximo, sendo altamente personalizável, fortalecendo um laço emocional entre o gadget e o usuário.Assim como o smartphone fica com a cara do dono, este acaba esperando que apps e sites o "entendam" tão bem quanto seu aparelho o faz.
C O M P O R TA M E N T O S _ M I C R O M O M E N T O
Eles acontecem a todo momento, fazendo uso de um gadget (na maioria das vezes o smartphone) que uma pessoa precisa descobrir, aprender, comparar, encontrar, comprar algo.
"Como chego lá?" "Onde encontro isso?" "Quanto custa o que quero?"
https://www.thinkwithgoogle.com/intl/pt-br/articles/how-micromoments-are-changing-rules.html
C O M P O R TA M E N T O S _ M I C R O M O M E N T O
Os consumidores mudaram. Seu jeito de percorrer uma jornada de consumo também mudou. Não se está mais on-line. Vive-se on-line.
69% das pessoas que viajam a lazer e têm um smartphone buscam por ideias de viagem em momentos livres, como numa fila ou esperando o metrô.
82% dos usuários de smartphone consultam seus aparelhos enquanto estão na loja decidindo o que comprar.
69% dos consumidores on-line concordam que a qualidade, o timing ou a relevância das mensagens de uma empresa afetam sua percepção da marca.
https://www.thinkwithgoogle.com/intl/pt-br/articles/por-que-mobile.html
C O M P O R TA M E N T O S _ M I C R O M O M E N T O
Pensar em micromomentos é uma maneira mais eficiente do que se basear apenas em dados demográficos para atingirmos nossos usuários nos momentos certos.
C O M P O R TA M E N T O S _ M I C R O C O N V E R S Õ E S
Microconversões são métricas valiosas que consideram engajamento de um público ainda em fase de consideração.
O sucesso do mobile não pode ser atrelado apenas à conversão final (último clique).
C A M I N H O S P A R A O M O B I L EM O B I L E F I R S T
E S E J Á H O U V E R U M A V E R S Ã O D E S K T O P ?
L E V A N TA M E N T O D E D A D O S
M O B I L E F I R S T
P R O C E S S O C O N V E N C I O N A L
Desenvolvimento focado em desktop e notebooks Adaptação para tablets e smartphones
M O B I L E F I R S T
P R O C E S S O M O B I L E F I R S T
Desenvolvimento focado em smartphones e tablets
Adaptação de funcionalidades e conteúdos para notebook e desktop
M O B I L E F I R S T
O Q U E É ?Metodologia de desenvolvimento de projetos com o conceito de desenvolver primeiramente pensando em mobile.
P O R Q U Ê ?As restrições de contextos de uso forçam manter o foco.
E S E J Á H O U V E R U M A V E R S Ã O D E S K T O P ?
Não, não é apenas reduzir tamanhos. Muito pelo contrário, para garantir legibilidade e áreas de toque, é necessário aumentar muitos elementos.
E S E J Á H O U V E R U M A V E R S Ã O D E S K T O P ?
O importante é criar, não apenas transpor.
Considere contextos de uso, papel do mobile na tarefa desejada, micromomentos, como se diferenciar como um ponto de contato.
Defina uma personalidade para esses canal.
L E V A N TA M E N T O D E D A D O S
Use dados, qualitativos e/ou quantitativos, para guiar decisões sobre o papel do mobile na sua estratégia, como, quando e o que comunicar aos usuários, determinar relevâncias de conteúdo, etc.
C H E C K L I S T _ A F F O R D A N C E
Affordance é a qualidade de um objeto ser utilizado da maneira como foi projetado para ser.
Projetos digitais necessitam transmitir com clareza como os usuários podem interagir com elementos e quais elementos são realmente interativos.
APERTE
C H E C K L I S T _ A F F O R D A N C E
L O O K A N D F E E LUm elemento interativo deve parecer interativo.
Um elemento clicável deve parecer clicável.
Um elemento ajustável deve parecer ajustável.
Um elemento arrastável deve parecer arrastável.
Já deu pra entender...
C H E C K L I S T _ A F F O R D A N C E
TA P P A B L E R O L A G E M S W I P E
N E W Y O R K
I N P U T
C H E C K L I S T _ A F F O R D A N C E
A N I M A Ç Õ E S"Animações podem efetivamente guiar a atenção do usuário, tanto para informar quanto para agradar."
Meaningful Transitions - Google Material Design
C H E C K L I S T _ P R O P O R Ç Õ E S
Atente-se para a proporção dos elementos em relação ao todo.
C H E C K L I S T _ F E AT U R E S N AT I V A S
Faça uso das features nativas dos dispositivos móveis.
Localização (GPS, Wi-Fi, IP, Triangulação)
Gyroscope 360 (Movimentação)
Áudio (Input de áudio)
Vídeo e imagem (Captura de imagens e vídeos)
Conexões (Bluetooth, NFC)
Algumas features são acessíveis apenas através de aplicativos nativos
C H E C K L I S T _ F E AT U R E S N AT I V A S
O Google Maps, em seu modo de navegação, muda a interface para o modo noturno quando detecta que há pouca luz no ambiente. Por exemplo, ao passar por dentro de um túnel.
Versão mobile da Kayak possibilita a busca de hotéis próximos utilizando sua localização.
Com o Tilt Scrolling, o Instapaper permite que o usuário troque de artigo sem tocar o aparelho.
C H E C K L I S T _ C A L L T O A C T I O N N O M O M E N T O C E R T O
Mito: usuários não realizam scroll. Portanto, devemos deixar todos os calls to action importantes acima da "dobra".
Luke W aponta que, em uma amostra com 25 milhões de sessões, 75% das pessoas realizam scroll antes da página ser completamente carregada.
https://www.youtube.com/watch?v=Y-FMTPsgy_Y&feature=youtu.be&t=27m55s
Portanto, esteja pronto para identificar quando seu usuário está pronto para tomar uma ação e qual é a hora de posicionar seus calls to action.
C H E C K L I S T _ D I R E T R I Z E S - G O O G L E
O Google criou 25 regras: um checklist de boas práticas que devem se ter em mente quando o assunto é mobile. Algumas importantes:
https://www.thinkwithgoogle.com/intl/pt-br/research-studies/25-tecnicas-site-mobile.html
D E S TA Q U E S E U S C TA S
C H E C K L I S T _ D I R E T R I Z E S - G O O G L E
B U S C A E M E V I D Ê N C I A M E N U S C U R T O S
C H E C K L I S T _ D I R E T R I Z E S - G O O G L E
P E R M I T I R C O M P R A C O M O V I S I TA N T E
P R O J E T E F O R M U L Á R I O S E F I C I E N T E S