web design > usabilidade

32
WebDesign Eu uso, Tu usas, Nós usamos..

Upload: felipe-fernandes

Post on 22-May-2015

2.853 views

Category:

Documents


1 download

DESCRIPTION

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

TRANSCRIPT

Page 1: Web Design > Usabilidade

WebDesign

Eu uso, Tu usas, Nós usamos..

Page 2: Web Design > Usabilidade

WebDesign | Usabilidade

Conceito de usabilidade É a facilidade de uso que as pessoas podemempregar uma ferramenta ou objeto a fim de realizar uma tarefa específica.

Page 3: Web Design > Usabilidade

WebDesign | Usabilidade

Porque usabilidade é importante?

Page 4: Web Design > Usabilidade

WebDesign | Usabilidade

Porque usabilidade é importante? Se um site for dificil de usar, o usuário sai. Se a homepage não for clara o suficientepara mostrar o que a empresa oferece e o que é possível fazer, o usuário também sai. Se o usuário perder, ele sai. Se demorar pra carregar, e definitivamente sai.

Page 5: Web Design > Usabilidade

WebDesign | Usabilidade

O que devemos considerar?

1. Objetivos do website.2. Estudar o inimigo: visitar os sites concorrentes.3. Estudar os usuários através de seu comportamento.

Page 6: Web Design > Usabilidade

WebDesign | Usabilidade

"Um erro nos sites e intranets é estruturara informação baseado em como a empresa enxerga sua informação."

Jacob Nielsen (2004)

Page 7: Web Design > Usabilidade

WebDesign | Usabilidade

Mas como o usuário pensa? Os hábitos dos usuários não são muito diferentes dos hábitos de um consumidor numa loja ou supermercado. Dão uma olhada geral em cada página e clicam no primeiro link ou imagem que capture seu interesse ou que se pareça com o que está procurando.

Page 8: Web Design > Usabilidade

WebDesign | Usabilidade

Mas como o usuário pensa? (cont.) De fato, boa parte da página não é nem vista. A maioria dos usuários procura algo interessante ou útil para clicar. Assim que encontra algo promissor, ele clica. Se o resultado não supere sua expectativa, ele volta e continua procurando e sai.

Page 9: Web Design > Usabilidade

WebDesign | Usabilidade

Heat map do Google

Page 10: Web Design > Usabilidade

WebDesign | Usabilidade

Nossas metas. O usuário tem que conseguir usar.O usuário tem que querer voltar a usar.

Page 11: Web Design > Usabilidade

WebDesign | Usabilidade

Os 10 princípios básicos de usabilidade:

1. Não faça o usuário pensar

Page 12: Web Design > Usabilidade

WebDesign | Usabilidade

Os 10 princípios básicos de usabilidade:

1. Não faça o usuário pensar2. Não abuse da paciência do usuário

Page 13: Web Design > Usabilidade

WebDesign | Usabilidade

Os 10 princípios básicos de usabilidade:

1. Não faça o usuário pensar2. Não abuse da paciência do usuário3. Mantenha o foco de atenção do usuário

Page 14: Web Design > Usabilidade

WebDesign | Usabilidade

Os 10 princípios básicos de usabilidade:

1. Não faça o usuário pensar2. Não abuse da paciência do usuário3. Mantenha o foco de atenção do usuário4. Destaque os recursos e benefícios

Page 15: Web Design > Usabilidade

WebDesign | Usabilidade

Os 10 princípios básicos de usabilidade:

1. Não faça o usuário pensar2. Não abuse da paciência do usuário3. Mantenha o foco de atenção do usuário4. Destaque os recursos e benefícios5. Faça uso de texto objetivo

Page 16: Web Design > Usabilidade

WebDesign | Usabilidade

Os 10 princípios básicos de usabilidade:

1. Não faça o usuário pensar2. Não abuse da paciência do usuário3. Mantenha o foco de atenção do usuário4. Destaque os recursos e benefícios5. Faça uso de texto objetivo6. Valorize e priorize a simplicidade

Page 17: Web Design > Usabilidade

WebDesign | Usabilidade

Os 10 princípios básicos de usabilidade:

1. Não faça o usuário pensar2. Não abuse da paciência do usuário3. Mantenha o foco de atenção do usuário4. Destaque os recursos e benefícios5. Faça uso de texto objetivo6. Valorize e priorize a simplicidade7. Não tenha medo de espaços brancos

Page 18: Web Design > Usabilidade

WebDesign | Usabilidade

Os 10 princípios básicos de usabilidade:

1. Não faça o usuário pensar2. Não abuse da paciência do usuário3. Mantenha o foco de atenção do usuário4. Destaque os recursos e benefícios5. Faça uso de texto objetivo6. Valorize e priorize a simplicidade7. Não tenha medo de espaços brancos8. Comunique-se com "linguagem visual"

Page 19: Web Design > Usabilidade

WebDesign | Usabilidade

Os 10 princípios básicos de usabilidade:

1. Não faça o usuário pensar2. Não abuse da paciência do usuário3. Mantenha o foco de atenção do usuário4. Destaque os recursos e benefícios5. Faça uso de texto objetivo6. Valorize e priorize a simplicidade7. Não tenha medo de espaços brancos8. Comunique-se com "linguagem visual"9. Convenções são nossas amigas

Page 20: Web Design > Usabilidade

WebDesign | Usabilidade

Os 10 princípios básicos de usabilidade:

1. Não faça o usuário pensar2. Não abuse da paciência do usuário3. Mantenha o foco de atenção do usuário4. Destaque os recursos e benefícios5. Faça uso de texto objetivo6. Valorize e priorize a simplicidade7. Não tenha medo de espaços brancos8. Comunique-se com "linguagem visual"9. Convenções são nossas amigas

10. Teste sempre. Antes, durante e depois.

Page 21: Web Design > Usabilidade

WebDesign | Usabilidade

Sobre convenções... Diante da pesquisa com os sites de objetivos/conteúdos similares é bom identificar as convenções de interação a fim de aproveitar o modelo mental criado por elas para beneficiar a curva de aprendizado do usuário.

Page 22: Web Design > Usabilidade

WebDesign | Usabilidade

Page 23: Web Design > Usabilidade

WebDesign | Usabilidade

Page 24: Web Design > Usabilidade

WebDesign | Usabilidade

Page 25: Web Design > Usabilidade

WebDesign | Usabilidade

Page 26: Web Design > Usabilidade

WebDesign | Usabilidade

Você sabia que... A maioria das pessoas só pode memorizar de 4 a 7 pequenos fragmentos diferentes de informação na memória a curto prazo.

Page 27: Web Design > Usabilidade

WebDesign | Usabilidade

Você sabia que... A maioria das pessoas só pode memorizar de 4 a 7 pequenos fragmentos diferentes de informação na memória a curto prazo. Tá. Há espécies de peixes que suamemória só dura 5 segundos. E daí?

Page 28: Web Design > Usabilidade

WebDesign | Usabilidade

Você sabia que... A maioria das pessoas só pode memorizar de 4 a 7 pequenos fragmentos diferentes de informação na memória a curto prazo. Sendo assim, organização é fundamental.Converse com as pessoas que formam seu público alvo e coloque os itens de serviço que elas mais desejam nos lugares de maior destaque da sua tela.

Page 29: Web Design > Usabilidade

WebDesign | Usabilidade

Boas práticas que você deve ter em mente

1. Não use janelas popup ou frames2. Não mude o tamanho da janela do usuário3. Garanta legibilidade e não use fontes muito pequenas4. Use links curtos, claros, objetivos e URL amigáveis5. Não tenha links mortos ou sem saída6. Procure ter apenas uma animação por página (ou não ter)7. Empregue imagens para apoio ao conteúdo e não para

decoração apenas8. Evite a necessidade de plugins principalmente para navegar9. Evite links abrindo novas janelas (quando estiver transitando

em um contexto semântico).

Page 30: Web Design > Usabilidade

WebDesign | Usabilidade

Usuários felizes =

Page 31: Web Design > Usabilidade

WebDesign | Usabilidade

Usuários felizes = Websites de sucesso.

Page 32: Web Design > Usabilidade

WebDesign | Usabilidade

That's all folks!