O documento discute os conceitos de usabilidade, princípios da heurística e design de interação para experiência do usuário. Aborda a definição de usabilidade como facilidade de uso, e seus aspectos na web como tornar as tarefas simples e eficientes. Também explica a avaliação heurística de Nielsen para testar interfaces com base em princípios como feedback e prevenção de erros.

1. Heurística, Princípios e
Técnicas da
Usabilidade da Web
Prof. Daniel dos Santos Brandão

2. IFPB Campus Cabedelo
Sumário
1. Conceito de Usabilidade;
2. Usabilidade na Web;
3. Princípios da Heurística;
4. Conceitos sobre Ergonomia Contemporânea;
5. Design de interação e a Experiência
do Usuário (UX)
6. Considerações Finais.

3. INTRODUÇÃO
1. CONCEITO DE USABILIDADE
IFPB Campus Cabedelo

4. 1. Conceito de Usabilidade
 Usabilidade pode ser definida como: a facilidade com que
as pessoas podem empregar uma ferramenta ou
objeto a fim de realizar uma tarefa específica e
importante.
 Fácil aprendizagem, permitir uma utilização eficiente e
apresentar poucos erros, são os aspectos fundamentais
para a percepção da boa usabilidade por parte do usuário.
1/3
IFPB Campus Cabedelo

5. 1. Conceito de Usabilidade
 A usabilidade está diretamente ligada ao diálogo na
interface e a capacidade do software em permitir que
o usuário alcance suas metas de interação com o
sistema.
2/3
IFPB Campus Cabedelo

6. 1. Conceito de Usabilidade
 O QUE É INTERFACE?
Vários autores definem interface como todo e qualquer
dispositivo que ofereça interação entre dois sistemas diferentes:
 Um painel de um carro, por exemplo, é uma interface.
 O controle remoto é uma interface.
 A tela do seu celular touchscreen é uma interface. E um site
também é uma interface.
3/3
IFPB Campus Cabedelo

7. 2. USABILIDADE NA WEB
IFPB Campus Cabedelo

8. 2. Usabilidade na Web
 Objetivo: tornar a tarefa a ser realizada pelo usuário o mais
simples e eficiente possível.
 O design de interfaces deve equilibrar a funcionalidade e
elementos visuais de modo a facilitar a tarefa do usuário
sem chamar a atenção para si.
IFPB Campus Cabedelo

9. 2. Usabilidade na Web
 Como saber se estamos acertando?
1/2
IFPB Campus Cabedelo

10. 2. Usabilidade na Web
 Como saber se estamos acertando?
A pesquisa é um ótimo meio
de sabermos se estamos aten-dendo
nossos objetivos.
É sempre importante saber sobre a cultura, o nível de
escolaridade, os interesses e as aptidões dos usuários. E o
melhor jeito é realizando testes.
IFPB Campus Cabedelo

11. 2. Usabilidade na Web
 #EXEMPLO 1: A evolução do Sistema Windows
Tomando como exemplo, as telas de inicialização das diversas
versões do Windows, que tiveram várias evoluções na riqueza
das formas, cores e equilíbrio.
IFPB Campus Cabedelo

12. 2. Usabilidade na Web
 #EXEMPLO 1: A evolução do Sistema Windows
IFPB Campus Cabedelo

13. 2. Usabilidade na Web
 #EXEMPLO 1: A evolução do Sistema Windows
IFPB Campus Cabedelo

14. 2. Usabilidade na Web
 #EXEMPLO 1: A evolução do Sistema Windows
IFPB Campus Cabedelo

15. 2. Usabilidade na Web
 RESUMINDO:
O grande foco é pensar sempre que o usuário deve ter uma
interface amigável e para isso é necessário ter objetos que
indiquem seu caminho, como exemplo, uma estrada bem
sinalizada. Outro ponto é manter o usuário sempre
informado do status da página, onde ele está e o que está
acontecendo...
IFPB Campus Cabedelo

16. 2. Usabilidade na Web
 #EXEMPLO 2: site de pesquisas do Google
1/2
IFPB Campus Cabedelo

17. 2. Usabilidade na Web
 #EXEMPLO 2: site de pesquisas do Google
 Visual Limpo
 Navegação intuitiva
 Liberdade ao usuário
IFPB Campus Cabedelo

18. 3. PRINCÍPIOS DA HEURÍSTICA
IFPB Campus Cabedelo

19. 3. Princípios da Heurística
 Heurística: Segundo Jacob Nilsen¹
“é um método de verificação científico, geralmente
documentado, sobre as qualidades ergonômicas das
interfaces e são realizadas por especialistas em
ergonomia, que diagnosticam problemas que o usuário
poderá ter em uma interação.”
 ¹ Jacob Nilsen é um dinamarquês cientista da computação, com
Ph.D. em interação homem-máquina.
IFPB Campus Cabedelo

20. 3. Princípios da Heurística
 O termo avaliação heurística foi
introduzido no início da década de
90 por Jakob Nielsen e Rolf Molich,
que desenvolveram métodos e
padrões previamente testados que
fornecem recursos para deixar as
interfaces mais fáceis de serem
utilizadas por seus usuários.
IFPB Campus Cabedelo

21. 3. Princípios da Heurística
 Heurística na prática:
Para realizar os teste são selecionados de 3 a 5 avaliadores
que submetem as partes do projeto, sejam sites
institucionais, portal de conteúdo, e-commerces, sites para
dispositivos móveis, protótipos, entre outros.
 Aos princípios heurísticos, é possível realizar comparativos
entre o que foi projetado na interface e o que realmente é
necessário para um modelo sólido e consistente.
IFPB Campus Cabedelo

22. 3. Princípios da Heurística
 Avaliação Heurística de Nielsen
Para realizar os teste são selecionados de 3 a 5 avaliadores
que submetem as partes do projeto, sejam sites
institucionais, portal de conteúdo, e-commerces, sites para
dispositivos móveis, protótipos, entre outros.
Vejamos os princípios da heurística de Nilsen
IFPB Campus Cabedelo

23. 3. Princípios da Heurística
 Diálogo simples e natural: Os diálogos não devem conter
informações que sejam irrelevantes ou que sejam
raramente necessárias. Cada unidade extra da informação
em um diálogo compete com as unidades relevantes da
informação e diminui sua visibilidade relativa.
 Linguagem do usuário: O dialogo deve ser expressado
claramente em palavras, frases e conceitos familiares ao
usuário ao invés dos termos originados do sistema.
IFPB Campus Cabedelo

24. 3. Princípios da Heurística
 Mais reconhecimento que recordação: Minimizar a carga
da memória do usuário permitindo a visualização de
objetos, ações, e opções. O usuário não deve ter que
lembrar informações de uma parte do diálogo para outra.
 Coerência e padrões: Os usuários não devem ter que saber
se palavras, situações, ou ações diferentes significam a
mesma coisa. O sistema deve seguir as convenções da
plataforma.
IFPB Campus Cabedelo

25. 3. Princípios da Heurística
 Feedback: O sistema deve sempre manter os usuários
informados sobre o que está ocorrendo, com respostas
apropriadas e dentro do tempo razoável.
 Saídas claramente marcadas: Usuários normalmente
escolhem algumas funções no sistema por engano e
precisarão de saída emergências bem demarcadas para sair
do estado indesejado sem passar por um longo caminho.
IFPB Campus Cabedelo

26. 3. Princípios da Heurística
 Atalhos: Os atalhos, não vistos pelos usuários novatos,
podem normalmente acelerar a navegação para usuários
experientes, de tal modo que o sistema deve conciliar
usuários experientes e inexperientes.
 Boa mensagem de erro: As mensagens de erro devem ser
expressas de forma clara (sem códigos), indicar
precisamente o problema, e sugerir construtivamente uma
solução.
IFPB Campus Cabedelo

27. 3. Princípios da Heurística
 Prevenção de erro: Por melhor que seja a mensagem de erro,
um cuidadoso projeto de interface é o que impede a ocorrência
dos problemas em primeiro lugar. Eliminar circunstâncias que
sejam propícias aos erros, ou verificá-las e apresentar ao usuário
uma opção de confirmação antes que incidam no erro.
 Ajuda e documentação: Pode ser necessário que o sistema
forneça ajuda e documentação, apesar de ser melhor quando o
sistema é usado sem documentação. A informação deve ser fácil
de ser encontrada, focada nas tarefas do usuário. Devem ser
listados passos concretos a serem seguidos, e não ser muito
extenso.
IFPB Campus Cabedelo

28. 4. CONCEITOS SOBRE ERGONOMIA
CONTEMPORÂNEA
IFPB Campus Cabedelo

29. 4. Conceitos sobre a Ergonomia
contemporânea
 Ergonomia:
É a ciência que estuda a atividade de um trabalhador e/ou
usuário de produtos, no sentido de definir as condições de
realização dessa atividade e garantir a sua segurança,
saúde, conforto e, se necessário, a produtividade em
termos qualitativos e/ou quantitativos.
É possível chegar a bons resultados através de pesquisas e
questionários. Vejamos algumas questões:
IFPB Campus Cabedelo

30. 4. Conceitos sobre a Ergonomia
contemporânea
 Presteza: verifique se o sistema informa e conduz o
usuário durante a interação;
 Agrupamento por localização: verifique se a distribuição
espacial dos itens traduz as relações entre as informações;
 Agrupamento por formato: verifique os formatos dos itens
como meio de transmitir associações e diferenças;
IFPB Campus Cabedelo

31. 4. Conceitos sobre a Ergonomia
contemporânea
 Flexibilidade: verifique se o sistema permite personalizar
as apresentações e os diálogos;
 Legibilidade: verifique a legibilidade das informações
apresentadas nas telas do sistema;
 Compatibilidade: verifique a compatibilidade do sistema
com as expectativas e necessidades do usuário em sua
tarefa.
IFPB Campus Cabedelo

32. 5. DESIGN DE INTERAÇÃO E A
EXPERIÊNCIA DO USUÁRIO (UX)
IFPB Campus Cabedelo

33. 5. Design de interação e a Experiência do
Usuário (UX)
 Design de interação:
Em tempos de modismo tecnológico, é importante saber:
tecnologia não é fim, é meio.
 Identificando as necessidades e as rotinas das pessoas
alcançamos maiores chances de êxito, já que elas tornam-se
co-autoras de um produto e não apenas usuários.
IFPB Campus Cabedelo

34. 5. Design de interação e a Experiência do
Usuário (UX)
 Ciclo da criação de um Design Interativo:
estudos e
pesquisas
ideação
prototipação
IFPB Campus Cabedelo
avaliação

35. 5. Design de interação e a Experiência do
Usuário (UX)
 Design de interação “tem a ver com conectar as
pessoas por meio dos produtos e serviços que elas
usam” (Bill Moggridge).
IFPB Campus Cabedelo

36. 5. Design de interação e a Experiência do
Usuário (UX)
 Design de interação “tem a ver com conectar as
pessoas por meio dos produtos e serviços que elas
usam” (Bill Moggridge).
 Envolve criar experiências que melhorem e ampliem o
modo como as pessoas trabalham, se comunicam e
interagem.
IFPB Campus Cabedelo

37. 5. Design de interação e a Experiência do
Usuário (UX)
 Experiência do Usuário ou UX (sigla em inglês):
Diz respeito à forma como
as pessoas se sentem ao
utilizar um serviço ou um
produto, ao interagir com
um sistema web.
IFPB Campus Cabedelo

38. Revisão
CONSIDERAÇÕES FINAIS
IFPB Campus Cabedelo

39. Considerações finais
 Foi visto que USABILIDADE é:
A forma facilitada como as pessoas podem interagir um
uma ferramenta ou sistema
 A INTERFACE pode ser:
Desde o painel de um carro, um site ou um controle
remoto
 A USABILIDADE na web:
Tem por objetivo facilitar a vida do usuário em utilizar e
acessar o conteúdo que lhe interesse.
IFPB Campus Cabedelo

40. Considerações finais
 A HEURÍSTICA é:
Um método científico de pesquisar e testar um sistema
para melhorar a vida do usuário do produto final.
 Ainda sobre a HEURÍSTICA:
Nilsen, um dos co-criadores do termo, utiliza um check-list
para avaliação da usabilidade
 A ERGONOMIA é:
A ciência que estuda a atividade de um trabalhador e/ou
usuário de produtos, no sentido de definir as condições de
realização dessa atividade
IFPB Campus Cabedelo

41. Considerações finais
 Design de INTERAÇÃO é:
Conectar as pessoas por meio dos produtos e serviços que
elas usam.
 A Experiência do Usuário ou UX:
É forma como as pessoas se sentem ao utilizar um serviço
ou um produto, ao interagir com um sistema web, por
exemplo.
IFPB Campus Cabedelo

42. Muito obrigado pela atenção!
 Responda aos exercícios entregues no começo
da aula para fixação do conteúdo.
IFPB Campus Cabedelo