Keynote Usabilidade
-
Upload
ana-brambilla -
Category
Technology
-
view
815 -
download
2
description
Transcript of Keynote Usabilidade
![Page 1: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/1.jpg)
USABILIDADEUSABILIDADE
![Page 2: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/2.jpg)
“Não me faça pensar”
Steve Krug““
![Page 3: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/3.jpg)
Usabilidade é...
... facilidade no uso
... intuição
... mais visitantes
... investimento
![Page 4: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/4.jpg)
?
Ao entrar em um site, o usuário NÃO deve se perguntar:
Que site é esse?
O que faço aqui?
Onde está tal informação?
O que esse símbolo quer dizer?
![Page 5: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/5.jpg)
MISSÃO DE UM SITE
Pergunte-se ANTES
Por que esse site deve existir?
Qual a natureza desse site?- informativo- serviço- entretenimento- institucional...
??
![Page 6: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/6.jpg)
Pergunte-se ANTES
Por que alguém o visitaria??
Que imagem o site quer passar?- inovador- ágil- divertido- útil...
?Quem o visitaria??
![Page 7: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/7.jpg)
PÚBLICO
Pergunte-se ANTES
Como ele prefere acessar o conteúdo online? Vídeo? Fotos? Texto? Infográfico? Animação? Tabela?
?
Ele quer se comunicar com outros usuários?
?
![Page 8: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/8.jpg)
Pergunte-se ANTES
Ele quer se comunicar com você?
?Ele quer produzir conteúdo? Que tipo?
?O que o público procura em sites concorrentes que o seu ainda não oferece?
?
![Page 9: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/9.jpg)
Pergunte-se ANTES
QUAIS OS HÁBITOS DE NAVEGAÇÃO DO SEU USUÁRIO?
?
Quer modismos ou formas básicas?
?
![Page 10: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/10.jpg)
QUANTIDADE DE
INFORMAÇÃO> ANSIEDADEE
RAPIDEZ
Não há muita reflexão de leitura na web.
Internautas procuram informação até o TERCEIRO clique.
![Page 11: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/11.jpg)
Jacob Nielsen - o papa da usabilidade,
desconstruiu vários sites e fez um estudo
que mostrou...
![Page 12: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/12.jpg)
Padrão de leitura em F
Estudo de Jackob Nielsen com 232 internautas visitando centenas de sites
![Page 13: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/13.jpg)
Implicações da leitura em F
![Page 14: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/14.jpg)
Implicações da leitura em FInternautas não lêem palavra por palavra(SCANNABLE READER)
Intertítulos, parágrafos e “bullet points” devem começar com palavras-chave para que os usuários sejam capazes de perceber rapidamente quando fazem a trilha “vertical” do padrão em F.
Coloque as informações/ações mais importantes no primeiro scroll
FF
F
![Page 15: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/15.jpg)
![Page 16: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/16.jpg)
![Page 17: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/17.jpg)
![Page 18: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/18.jpg)
![Page 19: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/19.jpg)
![Page 20: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/20.jpg)
![Page 21: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/21.jpg)
![Page 22: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/22.jpg)
![Page 23: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/23.jpg)
![Page 24: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/24.jpg)
![Page 25: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/25.jpg)
• Usabilidade é facilidade de uso• Facilidade de uso é:
– Ter uma navegação óbvia/ auto-explicativa
– Buscar “afirmações”...•Essa é a navegação!•Aqui está a busca!
– ...e não “interrogações”•Posso clicar aqui?•Onde está o menu?•Como faço para...?
![Page 26: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/26.jpg)
• Algumas interrogações a evitar:– Onde estou?– Por onde devo começar?– Onde eles colocaram tal coisa?– O que quer dizer este símbolo/sigla?– Por que chamam isto assim?– O que este site faz?
![Page 27: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/27.jpg)
Sequência lógica
Identidade visuale
Navegação
![Page 28: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/28.jpg)
CERTO
![Page 29: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/29.jpg)
ERRADO
![Page 30: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/30.jpg)
ERRADO
![Page 31: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/31.jpg)
Caminho de navegação - na web não há senso de direção ;-)
![Page 32: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/32.jpg)
ERRADO
![Page 33: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/33.jpg)
NUNCA façam isso...
![Page 34: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/34.jpg)
... muito menos ISSO!!
![Page 35: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/35.jpg)
Recapitulando...
USABILIDADE É FACILIDADE NO USO!
![Page 36: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/36.jpg)
... quanto menos cliques, melhor... seja claro nos menus... sinalize bem os links... mantenha a identidade do site em TODAS as páginas... evite ao máximo o botão BACK... diga logo a que veio... prefira a simplicidade gráfica
![Page 37: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/37.jpg)
Se a usabilidade é boa, o público......encontra o que procura...fica satisfeito por conseguir o que deseja (assistir, ler, comentar, comprar, jogar etc.)...volta (e fica fiel ao seu produto)
Se a usabilidade é ruim, o público......não encontra o que procura...fica frustrado por não conseguir o que deseja (assistir, ler, comentar, comprar, jogar etc.)...não volta (e vai atrás do concorrente)
![Page 38: Keynote Usabilidade](https://reader033.fdocuments.net/reader033/viewer/2022052303/55714f6fd8b42a352f8b4f18/html5/thumbnails/38.jpg)
Para não esquecer...
Não vale ser bonito se for difícil de usar. Não vale ter o melhor conteúdo se a navegação é um enigma. Informações e recursos dispostos de forma simples, clara, fácil e eficiente resultam em boa usabilidade.