Web Design > Usabilidade

  • View
    2.836

  • Download
    1

Embed Size (px)

DESCRIPTION

Introdução a usabilidade, boas práticas e princípios para uma boa experiência.

Text of Web Design > Usabilidade

  • 1. WebDesignEu uso, Tu usas, Ns usamos..

2. WebDesign | UsabilidadeConceito de usabilidade a facilidade de uso que as pessoas podemempregar uma ferramenta ou objeto a fim derealizar uma tarefa especfica. 3. WebDesign | UsabilidadePorque usabilidade importante? 4. WebDesign | UsabilidadePorque usabilidade importante?Se um site for dificil de usar, o usurio sai.Se a homepage no for clara o suficientepara mostrar o que a empresa oferece e oque possvel fazer, o usurio tambm sai.Se o usurio perder, ele sai.Se demorar pra carregar, e definitivamente sai. 5. WebDesign | UsabilidadeO que devemos considerar?1. Objetivos do website.2. Estudar o inimigo: visitar os sites concorrentes.3. Estudar os usurios atravs de seu comportamento. 6. WebDesign | Usabilidade"Um erro nos sites e intranets estruturara informao baseado em como aempresa enxerga sua informao."Jacob Nielsen (2004) 7. WebDesign | UsabilidadeMas como o usurio pensa?Os hbitos dos usurios no so muito diferentes doshbitos de um consumidor numa loja ou supermercado.Do uma olhada geral em cada pgina e clicam noprimeiro link ou imagem que capture seu interesse ou quese parea com o que est procurando. 8. WebDesign | UsabilidadeMas como o usurio pensa? (cont.)De fato, boa parte da pgina no nem vista.A maioria dos usurios procura algo interessante ou tilpara clicar. Assim que encontra algo promissor, ele clica.Se o resultado no supere sua expectativa, ele volta econtinua procurando e sai. 9. WebDesign | UsabilidadeHeat map do Google 10. WebDesign | UsabilidadeNossas metas.O usurio tem que conseguir usar.O usurio tem que querer voltar a usar. 11. WebDesign | UsabilidadeOs 10 princpios bsicos de usabilidade:1. No faa o usurio pensar 12. WebDesign | UsabilidadeOs 10 princpios bsicos de usabilidade:1. No faa o usurio pensar2. No abuse da pacincia do usurio 13. WebDesign | UsabilidadeOs 10 princpios bsicos de usabilidade:1. No faa o usurio pensar2. No abuse da pacincia do usurio3. Mantenha o foco de ateno do usurio 14. WebDesign | UsabilidadeOs 10 princpios bsicos de usabilidade:1. No faa o usurio pensar2. No abuse da pacincia do usurio3. Mantenha o foco de ateno do usurio4. Destaque os recursos e benefcios 15. WebDesign | UsabilidadeOs 10 princpios bsicos de usabilidade:1. No faa o usurio pensar2. No abuse da pacincia do usurio3. Mantenha o foco de ateno do usurio4. Destaque os recursos e benefcios5. Faa uso de texto objetivo 16. WebDesign | UsabilidadeOs 10 princpios bsicos de usabilidade:1. No faa o usurio pensar2. No abuse da pacincia do usurio3. Mantenha o foco de ateno do usurio4. Destaque os recursos e benefcios5. Faa uso de texto objetivo6. Valorize e priorize a simplicidade 17. WebDesign | UsabilidadeOs 10 princpios bsicos de usabilidade:1. No faa o usurio pensar2. No abuse da pacincia do usurio3. Mantenha o foco de ateno do usurio4. Destaque os recursos e benefcios5. Faa uso de texto objetivo6. Valorize e priorize a simplicidade7. No tenha medo de espaos brancos 18. WebDesign | UsabilidadeOs 10 princpios bsicos de usabilidade:1. No faa o usurio pensar2. No abuse da pacincia do usurio3. Mantenha o foco de ateno do usurio4. Destaque os recursos e benefcios5. Faa uso de texto objetivo6. Valorize e priorize a simplicidade7. No tenha medo de espaos brancos8. Comunique-se com "linguagem visual" 19. WebDesign | UsabilidadeOs 10 princpios bsicos de usabilidade:1. No faa o usurio pensar2. No abuse da pacincia do usurio3. Mantenha o foco de ateno do usurio4. Destaque os recursos e benefcios5. Faa uso de texto objetivo6. Valorize e priorize a simplicidade7. No tenha medo de espaos brancos8. Comunique-se com "linguagem visual"9. Convenes so nossas amigas 20. WebDesign | UsabilidadeOs 10 princpios bsicos de usabilidade: 1. No faa o usurio pensar 2. No abuse da pacincia do usurio 3. Mantenha o foco de ateno do usurio 4. Destaque os recursos e benefcios 5. Faa uso de texto objetivo 6. Valorize e priorize a simplicidade 7. No tenha medo de espaos brancos 8. Comunique-se com "linguagem visual" 9. Convenes so nossas amigas10. Teste sempre. Antes, durante e depois. 21. WebDesign | UsabilidadeSobre convenes...Diante da pesquisa com os sites de objetivos/contedossimilares bom identificar as convenes de interao afim de aproveitar o modelo mental criado por elas parabeneficiar a curva de aprendizado do usurio. 22. WebDesign | Usabilidade 23. WebDesign | Usabilidade 24. WebDesign | Usabilidade 25. WebDesign | Usabilidade 26. WebDesign | UsabilidadeVoc sabia que...A maioria das pessoas s pode memorizar de 4 a 7pequenos fragmentos diferentes de informao namemria a curto prazo. 27. WebDesign | UsabilidadeVoc sabia que...A maioria das pessoas s pode memorizar de 4 a 7pequenos fragmentos diferentes de informao namemria a curto prazo.T. H espcies de peixes que suamemria s dura 5 segundos. E da? 28. WebDesign | UsabilidadeVoc sabia que...A maioria das pessoas s pode memorizar de 4 a 7pequenos fragmentos diferentes de informao namemria a curto prazo.Sendo assim, organizao fundamental.Converse com as pessoas que formam seu pblico alvo ecoloque os itens de servio que elas mais desejam noslugares de maior destaque da sua tela. 29. WebDesign | UsabilidadeBoas prticas que voc deve ter em mente1. No use janelas popup ou frames2. No mude o tamanho da janela do usurio3. Garanta legibilidade e no use fontes muito pequenas4. Use links curtos, claros, objetivos e URL amigveis5. No tenha links mortos ou sem sada6. Procure ter apenas uma animao por pgina (ou no ter)7. Empregue imagens para apoio ao contedo e no para decorao apenas8. Evite a necessidade de plugins principalmente para navegar9. Evite links abrindo novas janelas (quando estiver transitando em um contexto semntico). 30. WebDesign | UsabilidadeUsurios felizes = 31. WebDesign | Usabilidade Usurios felizes = Websites de sucesso. 32. WebDesign | Usabilidade Thats all folks!