2. SKILLS: UX, SEO, PHP, HTML, CSS, JAVASCRIPT, MySQL, OutSystems
David Marques
Gestor de Projetos
2
Contacto:
davidmarques@hi-interactive.pt
3. 3
Somos uma agência digital especializada
em user experience.
Há mais de uma década que trabalhamos
com empresas nacionais e internacionais,
desde startups a multinacionais.
Fazemos parte da comunidade STEAM,
uma empresa de consultoria com mais de
20 anos de presença no mercado.
4. Investigação
e estratégia
User Experience
e design
Tecnologias
e desenvolvimento
4
Áreas de Intervenção
11. A origem do termo é atribuída a Ethan Marcotte, quando em
2010 escreveu um artigo onde usou o termo “responsive
web design” para denominar uma analise ao comportamento
de um site visto em diferentes resoluções.
11
12. Este artigo veio dar origem ao famoso livro
“Responsive Web Design”.
12
14. Mais de 4000
devices diferentes!
14
Uma infinidade
de resoluções.
15. Acesso mobile
cresce todos os dias
15
O acesso mobile já ultrapassou
o acesso por computador!
7.210
Biliões
População
Total
3.010
Biliões
Utilizadores
Ativos
de Internet
2.078
Biliões
Contas de Redes
Sociais Ativas
3.649
Biliões
Utilizadores
Mobile
1.685
Biliões
Contas Mobile
de Redes Sociais
Ativas
16. 16
Indexação do Google prefere mobile
Recentemente no passado dia 21 de Abril o Google passou a dar
prioridade na indexação a websites compatíveis com mobile
quando a pesquisa é efetuada a partir de mobile.
17. 17
O que devemos ter em conta
quando pensamos em responsive
Parâmetros
Principais
19. 19
Resolução
A área visual que
temos para apresentar
os conteúdos
Se é touch
A forma como
utilizador interage
com o device
20. Resolução
A área visual que
temos para apresentar
os conteúdos
20
Se é touch
A forma como
utilizador interage
com o device
A velocidade
de acesso
A capacidade que o
device tem de reproduzir
os conteúdos
22. 22
Filtramos os conteúdos a enviar para o
cliente (device) do lado do servidor.
Optimizados os conteúdos do lado
do cliente (device).
Lado do
Servidor
Lado do
Cliente
25. 25
Apenas conteúdo necessário
Devemos filtrar os conteúdos para o device.
Em ecrãs de resolução inferior não temos espaço
para dar destaque a tudo, devemos ser mais precisos
no conteúdo que o utilizador procura.
Nem sempre é devemos enviar todo o conteúdo
que temos em desktop para o mobile.
26. 26
Desktop Tablet Phone
Optimizar as imagens
consoante o device
Devemos fornecer imagens com diferente
qualidade e resolução consoante o tipo de device
e a velocidade de acesso.
27. 27
Lazy load
Carregar lista de conteúdos à medida
que o utilizador vai efectuando scroll.
Loading...