Avaliação de interfaces com o usuário atraves de prototipação

Avaliação de interfaces com o
usuário através de prototipação
Livia Gabos – MStech - @liviagabos
Talita Pagani – UFSCar - @talitapagani

Setembro/2011 1
de 49

Agenda
• Apresentação
• Parte I – Prototipação
• Parte II – Avaliação de Usabilidade
• Parte III – Atividade Prática
• Referências

2
de 49

Apresentação
• Livia Gabos
• Bacharel em Sistemas de Informação pela Unesp/Bauru
• Analista de teste na Mstech – sede Bauru
• Trabalha com acessibilidade, usabilidade e experiência do usuário
• Artigos aceitos no ICEIS e SBQS

3
de 49

Apresentação
• Talita Pagani
• Bacharel em Ciência da Computação pela USC-Bauru
• Mestranda em Ciência da Computação na UFSCar
• Designer de Interface desde 2005
• Trabalha com usabilidade, qualidade em uso, CSS e HTML
• Editora regular do site Tableless – Padrões Web

4
de 49

Parte I

PROTOTIPAÇÃO 5
de 49

Conceito
• O que é “Prototipação”?
• Projeto rápido da interface e das funcionalidades
• Representação dos requisitos
• Concepção de fragmentos do sistema
• Artefato construído iterativamente
• Foco: avaliar resultados obtidos com o protótipo

6
de 49

Por que prototipar interfaces?
A principal motivação para a construção de protótipos é
avaliar interfaces com o usuário de forma a diminuir a
carga de trabalho cognitivo, aumentar a facilidade de uso
e auxiliar o usuário a realizar tarefas que resultam na
realização de seus objetivos.

7
de 49

Classificação
• Quanto ao detalhamento
• Baixa Fidelidade
• Média Fidelidade
• Alta Fidelidade

8
de 49

9
Protótipo de Baixa Fidelidade de 49

Fonte: http://www.uxbooth.com/blog/tools-for-sketching-user-experiences/

10
Protótipo de Média Fidelidade de 49

Fonte: http://usabilidoido.com.br/quanto_mais_simples_o_wireframe_melhor.html

11
Protótipo de Alta Fidelidade de 49

Fonte: http://www.benjaminkoh.com/gigabit.html

Classificação
• Quanto ao reuso
• Evolucionário
• Throw-away

12
de 49

Classificação
• Quanto à função
• Apresentação
• Autêntico
• Funcional
• Sistema Piloto

13
de 49

Como é realizada
Análise dos
resultados ou Coleta de
refinamento requisitos
do protótipo

Avaliação Planejamento
(Cliente e/ou e Projeto do
usuário) Protótipo

Construção 14
do Protótipo de 49

Vantagens e Desvantagens

Elucida requisitos
Melhora a qualidade da
especificação

Imprecisão sobre o tempo do
projeto
Omissão de comentários
15
de 49

A prototipação em papel
• Uma das formas mais utilizadas de prototipação rápida
• Baixa fidelidade
• Simples confecção
• Fácil execução
• Economia de tempo e dinheiro
• Rápida incorporação de feedback no momento de
produção

16
de 49

A prototipação em papel
• 6 Mitos (Spinelli; Rei, 2011)
1. “Protótipo deve ser bonito”;
2. "Só sei desenhar direto no layout";
3. "Não parece profissional";
4. "Meu chefe não irá entender";
5. "Prototipar depende da plataforma";
6. "Impossível simular interatividade com papel"

17
de 49

18
Desenhando o protótipo de 49

Fonte: http://www.flickr.com/photos/21218849@N03/with/3902255728/

19
Desenhando o protótipo de 49


20
Simulando as interações da interface de 49


Parte II

AVALIAÇÃO DE USABILIDADE 21
de 49

O que é um teste de usabilidade?
• Também chamado de avaliação empírica.

• Método para detectar problemas na interação do usuário
com um produto.

• Metodologia de avaliação de usabilidade (mas apenas
uma de muitas!)

22
de 49

Apenas para isso?
• Nãaaaaooo!

• Testes de usabilidade também servem para:
• Aprender sobre o comportamento do usuário
• Entender como ele se relaciona com o seu produto
• Te deixa com um “olhar afiado” para problemas de
usabilidade em geral.

23
de 49

O que observamos?
• Caminho utilizado pelo usuário
• Reclamações espontâneas
• Expressão facial e gestos
• Tempo de execução da tarefa
• Avaliação do site ao final

24
de 49

Tipos de testes
• Formativo / Validativo
• Exclusivo / Comparativo
• Qualitativo / Quantitativo
• Cooperativo / Individual
• Livre / Estruturado
• Em campo / Em laboratório

25
de 49

O que é feito antes do teste?
• Definição da metodologia (teste de usabilidade)
• Definição dos objetivos e da amostra
• Prototipação
• Análise heurística (vou falar daqui a pouco)
• Criação do roteiro de tarefas
• Recrutamento de participantes

26
de 49

Análise heurística
• Heurísticas são criadas de pesquisas
• Define-se procedimento heurístico como um método de
aproximação das soluções ideais aos problemas
• As heurísticas mais famosas foram criadas por Jakob Nielsen
• Fez uma pesquisa com 240 pessoas
• 10 heurísticas de Nielsen

Oi, tudo bem?

27
de 49

Análise heurística
1. Visibilidade do estado atual do sistema
2. Correlação entre o sistema e o mundo real
3. Controle versus liberdade do usuário
4. Consistência e Padrões
5. Prevenção de Erros
6. Reconhecimento ao invés de memorização
7. Flexibilidade e eficiência de uso
8. Projeto estético e minimalista
9. Suporte aos usuários no reconhecimento, diagnostico e
recuperação de erros
10. Informações de ajuda e documentação

Fonte: http://www.useit.com/papers/heuristic/heuristic_list.html 28
de 49
Vídeo legal! http://www.youtube.com/watch?v=hWc0Fd2AS3s&feature=player_embedded

O que é feito antes do teste?
• Definição da metodologia (teste de usabilidade)
• Definição dos objetivos e da amostra
• Prototipação
• Análise heurística
• Criação do roteiro de tarefas
• Recrutamento de participantes

29
de 49

Papéis em um teste
• Participante/testador
• Pessoa que está dentro da amostra definida para o estudo.
• Geralmente procuramos pessoas que não trabalham com
internet, design ou áreas relacionadas.

• Moderador
• Fica dentro da sala com o participante, passando as tarefas e
fazendo perguntas.

• Observador
• Fica fora da sala, acompanha e dá suporte ao moderador.
30
de 49

Papel do moderador
• Explica como vai funcionar a pesquisa
• Lê o enunciado da tarefa, no roteiro
• Anota problemas, observações
• Faz perguntas ao final

Poker Face

31
de 49

Papéis em um teste

32
de 49

Aquecimento para o teste
• Boas vindas

• Introdução
• Como funciona a pesquisa
• Falar sobre o ambiente
• “Você não está sendo testado.” “Não tem certo e errado.”
• Falar sobre o seu papel como moderador

33
de 49

Questionário inicial
• Serve para:
• Confirmar o perfil do testador
• Obter informações úteis
• Aquecer para as tarefas – não é para ser amiguinho!

34
de 49

Tarefas
• Moderador lê em voz alta o enunciado da tarefa
• Entrega os materiais que o participante vai precisar para fazer
as tarefas
• Lembre o participante que ele define quanto termina a tarefa
• Peça para ele pensar alto. Caso não aconteça naturalmente,
estimule ele a falar, fazendo perguntas.
• CUIDADO para não ser chato demais!

35
de 49

Aquecimento...

Voluntário? =D

36
de 49

Situações
Agora eu não sei o que fazer. É
pra clicar aqui?

• Você não pode responder as perguntas nem dar dicas!
• Cada vez que você explicar alguma coisa para o testador
estará perdendo uma oportunidade de descobrir um
problema ou uma falha no site.
• Também não vale deixar o testador falando sozinho. É
importante mostrar que você está interessado em tudo o que
ele diz.

37
de 49

Situações
Agora eu não sei o que fazer. É
pra clicar aqui?

> “Você faria isso em uma situação real, usando o site na sua
casa?”
> “Faça como você faria em uma situação real.”
> “Você acha que é?”

Evite:
“Aham” - pode parecer que você concorda
... <- ele pode se sentir desprezado ou continuar olhando para a
sua cara, esperando uma resposta.
38
de 49

Situações
• Testador fica em loop, clicando em algo repetidamente,
sem prosseguir.
Poker Face
RESISTA! AGUENTE!

• Faça perguntas, até que ele entenda o que está
acontecendo e consiga se virar sozinho

39
de 49

Situações n...
• Não dê dicas para o participante.
• Cuidado com os termos que utiliza.
• Tente que ele faça as tarefas sozinho
• Se ele desistir da tarefa, anote e se você não for usar a
informação para outras tarefas, diga a ele o que ele tinha que
fazer.
• Faça uma pergunta de cada vez.
• A tarefa só termina quando o participante falar que acabou.
• Não coloque palavras na boca do participante: “Você achou
que foi difícil, né?”
40
de 49

Outras questões
• O participante deve assinar um termo para a gravação de
áudio e vídeo.

• Ele deve saber que esse áudio e vídeo serão usados apenas
para a pesquisa.

41
de 49

Teste de usabilidade com
protótipos em papel

http://www.youtube.com/watch?v=5Ch3VsautWQ

http://www.youtube.com/watch?v=8PhT0U5uhSI

42
de 49

Parte III

ATIVIDADE PRÁTICA 43
de 49

Desafio
• Aplicativo de busca e reserva de passagens aéreas para
dispositivos móveis
• Prototipar 2 funcionalidades
• Busca de passagem
• Compra de passagem
• Base: www.decolar.com
• Formação de grupos
• Depois do protótipo, aplicar teste com moderação.

44
de 49

Referências
Aguiar, Y.; Lula, B.; Lima, C.; Lima, G.; Gouveia, R. “Uso de Protótipos
no Processo de Concepção de Interfaces do Usuário”. II Congresso de
Pesquisa e Inovação da Rede Norte Nordeste de Educação Tecnológica,
João Pessoa, 2007.

Brown, J. “Methodologies for the Creation of Interactive Software”.
Relatório Técnico. Mai. 1996.

CEFET-RN/DATINF. “Design, Prototipação e Construção”. 2008.

Dutra, L. R. “Paradigmas de Engenharia de Software”. Disponível em:
http://www.redes.unb.br/material/Metodologia%20de%20Desenvolvi
mento%20de%20Software/aula3.pdf

Oliveira Netto, A. A. “IHC: Modelagem e Gerência de Interfaces com o 45
Usuário”. Florianópolis: Visual Books, 2004. de 49

Referências
Preece, J.; Rogers, Y.; Sharp, H. “Interaction Design: Beyond
Human-Computer Interaction”. New York: John Wiley & Sons,
Inc., 2002.

PUC-Rio. “Desenvolvimento de Protótipo”. 2005. Disponível em:
http://www2.dbd.puc-
rio.br/pergamum/tesesabertas/0313143_06_cap_10.pdf.
Acesso em: 12 mai. 2011.

Sommerville, I. ”Engenharia de Software”. 6ª ed. São Paulo:
Pearson, 2005

Spinelli, T.; Rei, R. “Design de Interação – além do lápis e papel”. 46
de 49
Campus Party (Palestra), 2011

Referências
• Sobre avaliação de usabilidade em geral
• Observing the User Experience: A Practitioner's Guide to User
Research, Mike Kuniavsky
• Handbook of Usability Testing: Howto Plan, Design, and
Conduct Effective Tests, Jeffrey Rubin and Dana Chisnell
• Rocket Surgery Made Easy: The Do-It-Yourself Guide to Finding
and Fixing Usability Problems, Steve Krug

• Moderação em pesquisa de mercado
• Pesquisa Qualitativa com Texto, Imagem e Som: um Manual
Prático, Martin W. Bauer
47
de 49

Obrigada!
liviagabos@gmail.com / http://twitter.com/liviagabos
talita.cpb@gmail.com / http://twitter.com/talitapagani

49
de 49

Avaliação de interfaces com o usuário atraves de prototipação

Mais conteúdo relacionado

Mais procurados (20)

Semelhante a Avaliação de interfaces com o usuário atraves de prototipação (20)

Último (19)

Avaliação de interfaces com o usuário atraves de prototipação