Web design - Usabilidade - IFBA

631 views

Published on

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
631
On SlideShare
0
From Embeds
0
Number of Embeds
12
Actions
Shares
0
Downloads
0
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Web design - Usabilidade - IFBA

  1. 1.  Primeira Lei da Usabilidade de Krug (2005). Usuário : - Qual a coisa mais importanteque eu devo fazer se quiser me assegurarque meu website seja fácil de usar? Krug: - “Nada importante deve estar amenos de dois cliques de distância” ou“Fale a língua do usuário”, ou “Sejaconsistênte”, ou…
  2. 2. Não me FaçaPensar!
  3. 3.  Seu objetivo é deixar que cada páginaseja clara, de forma que apenasolhando o usuário comun já saiba o queé e como usá-la. Auto-explicativa.
  4. 4.  Pessoas perdem tempo usando sites queas frustam. A culpa é minha e não do site. Site díficil de encontrar, não querocomeçar de novo. Já esperei dez minutos por esse ônibus,posso esperar um pouco mais.
  5. 5.  Tornar as coisas mais claras é como terboa iluminação. Usar um site que nos faça pensar emcoisas sem importância, tende a sugarenergia, esforço e tempo.
  6. 6.  Usuário passam rapidamente pelaspáginas; Buscam o que lhe interessam; Existem grandes áreas que eles nemolham;
  7. 7.  #Fato1› Nós não lemos as páginas, damos umaolhada nelas. #Fato2› Não fazemos escolhas ideias. Fazemos oque é suficiente. #Fato3› Não descobrimos como as coisas. Nósapenas atingimos nosso objetivo.
  8. 8.  Por que apenas damos uma olhada naspáginas:› Geralmente estamos com pressa.› Sabemos que não precisamos ler tudo.› Somos bons nisso.
  9. 9.  Tendemos a focar as palavras eexpressões que se parecem com:› A) A tarefa que estamos executando;› B) Nossos interesses pessoais atuais;› C)As palavras que tem algum efeito sobrenosso sistema nervoso como:“Grátis”,”Vendas”,”Sexo”;
  10. 10.  Não fazemos escolhas ideias. Fazemos oque é suficiente.› Geralmente estamos com pressa. E comoKlein destaca, “Otimizar é difícil e demoramuito. Fazer o que for suficiente é maiseficiente.”› Não há uma punição grande parasuposições erradas. Basta clicar no botãovoltar e tentar de novo.
  11. 11. › Ponderar as opções pode não melhorarnossas chances. Em sites mal projetados nãoadianta se esforçar para fazer uma boaescolha.› Adivinhar é mais divertido. Dá menostrabalho do que ponderar as opções e sevocê adivinhar, é mais rápido.
  12. 12.  Não descobrimos como as coisasfuncionam. Nós apenas atingimos nossoobjetivo.› Não é importante para nós. Para a maiorianão importa se entendemos como as coisasfuncionam, desde que possamos usá-las.› Se encontramos alguma coisa que funcionaficamos com ela. Assim que encontramosuma coisa que funcione mesmo que mal,não tendemos a procurar uma formamelhor.
  13. 13.  Há uma chance muito maior que elesencontrem o que procuram, o que é bompara eles e para você; Há uma chance que eles entedam o que osite tem a oferecer, não apenas partesdele. Você tem a chance de guiá-los até aparte do site que você quer que elesvejam; Eles se sentirão mais espertos e com maiscontrole quando estiverem usando seu site.
  14. 14.  Crie uma hierárquia visual clara emcada página. Tire proveito das convenções Divida as páginas em áreas claramentedefinidas Deixe óbvio o que pode ser clicado Minimize a confusão
  15. 15.  Páginas que tem hierárquia visual clarapossuem 3 características:› Quanto mais importante algo, maisproeminente está.› Coisas que estejamrelacionadas, logicamente também estãorelacionadas visualmente.› Coisas são aninhadas para mostrar quaisfazem parte de qual.
  16. 16.  Tópicos mais importantes são maiores,estão em negrito, com mais espaço,perto do topo.
  17. 17.  Pode-se mostrar que coisa sãosemelhantes agrupadas e exebindo-asde forma visualmente parecidas.
  18. 18.  Um cabeçalho da seção Livros sobrecomputadores, apareceria acima dotitúlo de um determinado livro…
  19. 19.  Elas são muito úteis: As convenções só setornam convenções se funcionarem. Porexemplo ao ver uma lista de links paraseções de um site em um fundocolorido, no canto esquerdo da página.
  20. 20.  Porque não usar? Por que usar? Quando usar?
  21. 21.  Dividir em áreas claras;
  22. 22.  Todos os links eram coloridos assim comoos textos; O usuário não sabia onde clicar;
  23. 23.  Muito o que fazer, tudo na páginachama a atenção, você não sabe praonde seguir, muitas cores brilhantes,muitas informações… Confusão de segundo plano, algumaspáginas são como estar em uma festa,nenhuma fonte de barulho é altasuficiente para distraí-lo, mas há muitasfontes de barulho que nos cansam…
  24. 24.  Projetistas web e profissionais gastammuito tempo debatendo quanto vezesvocê pode esperar que os usuárioscliquem para obter que querem semficar muito frustrados.
  25. 25.  De modo geral, os usuários não seincomodam com muitos cliques, desdeque cada um não de trabalho e queeles não percam a confiança de estarno caminho certo.
  26. 26.  Qualquer coisa que não seja umaplanta ou animal será um “mineral”. Infelizmente as escolhas da web, nãosão tão claras assim.
  27. 27.  “A escrita robusta é concisa. Uma frasenão deve conter palavrasdesnecessárias e um parágrafo nãodeve ter frases desnecessárias pelomesmo motivo pelo qual um desenhonão deve ter linhas desnecessárias euma máquina não deve ter peçasdesnecessárias” (Allyn e Bacon, 1979).
  28. 28.  III Lei de Krug – Livre-se de metade daspalavras de cada página e depois demetade das que restaram.
  29. 29.  Reduz o nível de confusão da página; Destaca mais o conteúdo útil; Deixa as páginas menores, permitindoaos usuários verem mais de cadapágina com um olhar sem precisar rolá-la.
  30. 30.  Papo bobo é o texto introdutório quedeve nos dar boas vindas ao site e noscontar o quão maravilhoso ele é… Teste infalível para descobrir o que épapo bobo:› Enquanto estiver lendo, escutará uma vozna sua cabeça dizendo: Blá, blá, blá, blá…
  31. 31.  “Papo bobo” é como papo furado –sem conteúdo, basicamente apenasuma forma de ser sociável. Porém amaioria dos usuários web não temtempo para papo furado; eles querem irdireto ao que interessa. Elimine tanto “papo bobo”, quantopossível.
  32. 32.  Outra fonte de palavras desnecessáriassão as instruções. Ninguém irá ler as instruções; Instruções confusas;
  33. 33.  Elimine as instruções tornando tudoauto-explicativo, ou tanto quantopossível.
  34. 34.  Imagine o seguinte: É sábado à tarde evocê está indo ao shopping compraruma serra. Enquanto passa pela porta daSears, fica pensando “Hm. Onde elescolocam as serras?” Assim que entracomeça a procurar pelos nomes dosdepartamentos no alto das paredes
  35. 35.  “Hm”, você pensa. “Ferramentas? Ougramado e jardim”? Dado que a Searstambém é bastante orientada aferramentas, você vai na direção dasferramentas.
  36. 36.  Quando chega no departamento deFerramentas, começa a procurar asplacas no final de cada corredor.
  37. 37.  Quando você acha que chegou nocorredor certo, começa a procurar osprodutos individuais.
  38. 38.  Se descobrir que sua suposição estavaincorreta, tenta outro corredor ou podeainda voltar e começar de novo nodepartamento de Gramados e Jardins.Quando tiver terminado, o processo separece com este:
  39. 39.  Você geralmente está tentandoencontrar algo. No mundo “real”,poderia ser a sala de emergência ouuma lata de feijões. Na web, poderia sero dvd, ou o nome de algum atorfamoso.
  40. 40.  Você decide se pergunta ou procuraprimeiro. A diferença é que em um website não há uma pessoa parada à qualvocê possa perguntar onde as coisasestão. O equivalente na Web asolicitação de informações é a busca.
  41. 41.  Usuários dominados pelas pesquisas; Usuários dominados por links;
  42. 42.  Se você decidir navegar, ande pelahierárquia usando os sinais para lheguiar.
  43. 43.  Aí você escolherá um item da lista.
  44. 44.  Com alguma sorte, após mais um cliqueou dois você acabará com uma lista dotipo de coisa que estiver procurando:
  45. 45.  Se você não conseguir encontrar o queestiver procurando, acabará indoembora.

×