usabilidade navegabilidade - blog da prof andrea garcia...o que é usabilidade? por que usabilidade...

39
Navegabilidade Usabilidade

Upload: others

Post on 15-Jul-2020

3 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

NavegabilidadeUsabilidade

Page 2: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

• Home

• Conceitos

• W3C

• Erros

• Cases

Usabilidade

• Referências

/Home Usabilidade

Page 3: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

O que é Usabilidade?

Por que Usabilidade na Web?

Fatores envolvidos

• Home

• Conceitos

• W3C

• Erros

• Cases

• Referências

Usabilidade

/Home Conceitos/Usabilidade

Page 4: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

O que é Usabilidade?

Usabilidade refere-se ao grau com que o usuário consegue realizar uma tarefa.

• Home

• Conceitos

• W3C

• Erros

• Cases

• Referências

Usabilidade

/Home O que é Usabilidade?/Usabilidade/Conceitos

Page 5: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

Fatores envolvidos

Facilidade de aprendizado do sistema

Facilidade de uso

Satisfação do usuário

Flexibilidade

Produtividade

Segurança

• Home

• Conceitos

• W3C

• Erros

• Cases

• Referências

Usabilidade

/Home Fatores envolvidos/Usabilidade/Conceitos

Page 6: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

Por que Usabilidade na Web?

• Home

• Conceitos

• W3C

• Erros

• Cases

• Referências

Usabilidade

/Home Por que Usabilidade na Web?/Usabilidade/Conceitos

Page 7: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

Em 1998 cerca de 3 bilhões de dólares deixaram de ser ganhos

• Home

• Conceitos

• W3C

• Erros

• Cases

• Referências

Usabilidade

Voltar

Page 8: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

Em 2001 os Websites mais conhecidos de comércio eletrônico perderam 65% de suas vendas;

• Home

• Conceitos

• W3C

• Erros

• Cases

• Referências

Usabilidade

Voltar

Page 9: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

Em sites de comércio eletrônicos a interface precisa compensar a ausência do vendedor

• Home

• Conceitos

• W3C

• Erros

• Cases

• Referências

Usabilidade

Voltar

Page 10: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

O poder É DO CLIENTE

• Home

• Conceitos

• W3C

• Erros

• Cases

• Referências

Usabilidade

Voltar

Page 11: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

Na Web o usuário experimenta a usabilidade antes e compra depois

• Home

• Conceitos

• W3C

• Erros

• Cases

• Referências

Usabilidade

Voltar

Page 12: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

Recomendações (W3C)

Quando os sites são corretamente concebidos, desenvolvidos e editados, todos os usuários possam ter igual acesso à informação e funcionalidade.

Próxima

• Home

• Conceitos

• W3C

• Erros

• Cases

• Referências

Usabilidade

Home /Usabilidade/W3C

Page 13: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

Sugestões/Recomendações (W3C)

Terreno da tela

Área da tela

Tempo de resposta

Impressão

Facilidade

Anterior

• Home

• Conceitos

• W3C

• Erros

• Cases

• Referências

Usabilidade

Home /Usabilidade/W3C

Page 14: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

Erros da criação de web sites

Erro 1

Erro 2

• Home

• Conceitos

• W3C

• Erros

• Cases

• Referências

Usabilidade

Home /Usabilidade/Erros

Page 15: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

Não exibir o preço dos produtos no Websitehttp://www.nexxo.com.br/

Page 16: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

Sistemas de Busca pobres ou ineficazes http://www.chancetour.com.br/variados.asp

Page 17: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

Problemas de Usabilidade de Estudos de Caso

Case 3

Case 5

Case 1

Case 2

Case 4

• Home

• Conceitos

• W3C

• Erros

• Cases

• Referências

Usabilidade

Home /Usabilidade/Cases

Page 18: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

Objetivo: O usuário precisa apenas consultar o horário de vôo?

Problema detectado: A mensagem não estava clara

Page 19: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

Problemas com Usabilidade

Page 20: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

Problemas com usabilidade

Page 21: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

Olha o início

Page 22: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

Após 3 minutos

Page 23: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

Referências:

www.userdesign.comhttp://www.w3c.br/sobre/http://www.inf.ufsc.br/~cybis/ine5624/http://www.criarweb.com/artigos/469.phphttp://www.seara.com/fotos/editor2/usabilidade.pdfhttp://www.pdf-search-engine.com/usabilidade-pdf.htmlftp://ftp.unicamp.br/pub/apoio/treinamentos/tutoriais/tut_UsabilidadeWeb.pdfhttp://www.apostilando.com/download.php?cod=391&categoria=Outras%20Apostilas

• Home

• Conceitos

• W3C

• Erros

• Cases

• Referências

Usabilidade

Home /Usabilidade/Referências

Page 24: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

• Home

• Conceitos

• Projeto

• Avaliação

• Referências

Navegabilidade

/Home Navegabilidade

Page 25: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

O que é Navegabilidade?

Usabilidade X Navegabilidade

Qual importância da Navegabilidade?

Conceitos• Home

• Conceitos

• Projeto

• Avaliação

• Referências

Navegabilidade

/Home Conceitos/Navegabilidade

Page 26: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

O que é Navegabilidade?

Está relacionada à forma (maneira) como se navega por um site.

• Home

• Conceitos

• Projeto

• Avaliação

• Referências

Navegabilidade

/ O que é Navegabilidade?/Home Conceitos/Navegabilidade

Page 27: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

Qual importância da Navegabilidade?

Organização da informação

Princípio básico da Usabilidade

Wireframes

• Home

• Conceitos

• Projeto

• Avaliação

• Referências

Navegabilidade

Qual importância da Navegabilidade?//Home Conceitos/Navegabilidade

Page 28: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

Usabilidade X Navegabilidade

• Home

• Conceitos

• Projeto

• Avaliação

• Referências

Navegabilidade

Usabilidade X Navegabilidade//Home Conceitos/Navegabilidade

Page 29: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

Mecanismos

Projeto Navegacional

Considerar aspectos

Contextos Navegacionais

Atividades Produtos Interesses do Projeto

Projeto de Navegação

Nós, elos, estruturas de acesso, contextos denavegação, transformações navegacionais.

Mapeamento entre objetos conceituais e de navegação. Padrões de navegação para a descrição da estrutura geral da aplicação.

Leva em conta o perfil do usuário e a tarefa; ênfase em aspetos cognitivos e arquiteturais.

• Home

• Conceitos

• Projeto

• Avaliação

• Referências

Navegabilidade

Projeto/Home /Navegabilidade

Page 30: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

Avaliando a Navegabilidade de um site

Número de cliques

Menu

Mapa do site

Ajuda, Dúvidas Freqüentes ou FAQs

Botões

Campo de busca

Localização do usuário

Identificação dos links

• Home

• Conceitos

• Projeto

• Avaliação

• Referências

Navegabilidade

Avaliação/Home /Navegabilidade

Page 31: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •
Page 32: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •
Page 33: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

Botões

Page 34: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •
Page 35: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

Identificação

dos links

Page 36: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •
Page 37: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •
Page 38: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •
Page 39: Usabilidade Navegabilidade - Blog da Prof Andrea Garcia...O que é Usabilidade? Por que Usabilidade na Web? Fatores envolvidos • Home • Conceitos • W3C • Erros • Cases •

• Home

• Conceitos

• Projeto

• Avaliação

• Referências

Navegabilidade

Referências:

http://www.alexandremagno.net/blog/2009/04/14/navegacao-em-um-site-topo-esquerda-ou-direita/http://www.oficinadanet.com.br/artigo/413/como_garantir_usabilidade_navegabilidade_e_interatividade.#http://www6.ufrgs.br/cursos_echos/criterios/navegacao.htmhttp://paginas.ucpel.tche.br/~lla/resumo.htmhttp://www.artigonal.com/web-design-artigos/importancia-da-boa-navegacao-em-um-site-974589.htmlhttp://www.criarweb.com/artigos/627.phphttp://www.lifia.info.unlp.edu.ar/~fer/oohdm/pg023.htmhttp://inf.cp.cefetpr.br/ligia/material/hipermidia/oohdm.pdf

Referências/Home /Navegabilidade