Oficina "Projetando Interações com Base Heurística" por Renato Rosa

Quem sou eu

Gerente de internet da BOX1824 – Consultoria em pesquisa de tendência de comportamento do consumidor jovem;

Consultor em usabilidade, AI e design de interação;

10 anos de experiência em mídias digitais interativas;

Membro do Information Architecture Institute;

3 vezes Presidente do Júri do Prêmio Internet Corporativa;

Jurado Webdesign International Festival – Webjam WIF 2006;

Jurado de Internet do 11° Salão da Propaganda ARP;

Palestrante 12º EWD – 2007;

Apoiador WUD 2007 e palestrante âncora do WUD 2006;

Como vamos fazer a oficina

Entendendo um modelo mental

O que é heurística?

Conhecendo os 10 princípios heurísticos

Como identificar problemas de usabilidade

Composição da interface

Como o usuário enxerga a interface

1. Conceituação de modelo mental Vamos começar com um elemento que todos conhecemos.

1. Conceituação de modelo mental Provavelmente a marioria das funções ou utilidades secundárias de uma escova envolvem o ato de escovar . Isso ocorre porque o modelo mental que temos de uma escova de dentes é escovar . Estamos presos nessa função.

1. Conceituação de modelo mental Isso é um modelo mental .

1. Conceituação de modelo mental Como seria um modelo mental de um carro?

1. Conceituação de modelo mental Como seria um modelo mental de um site? Marca Buscar Navegação global Rodapé Navegação local Conteúdo

“ Modelo mental é o nosso modelo conceitual particular da maneira como um objeto funciona, eventos acontecem ou pessoas se comportam, que resulta da nossa tendência de dar explicações para as coisas. ” Donald Norman - 1990 1. Conceituação de modelo mental

2. O que é heurística? Isso está correto? Quem disse? Marca Buscar Navegação global Rodapé Navegação local Conteúdo

2. O que é heurística?

2. O que é heurística? Acaba virando regra! As técnicas heurísticas não asseguram as melhores soluções, mas somente soluções válidas, aproximadas; e freqüentemente não é possível justificar em termos estritamente lógico a validade do resultado.

2. O que é heurística? Por isso, temos 3 estratégias para a definição de problemas: 1. busca às cegas 2. busca heurística (baseada na experiência) 3. buscas racionais (usando um sistema forma de raciocínio).

2. O que é heurística?

3. Conhecendo os 10 princípios heurísticos Em 1990, Jakob Nielsen criou 10 regras de design de interação, chamadas de “Heurísticas”. Hoje elas são usadas como guias no desenvolvimento de produtos interativos. 1. Visibilidade do estado do sistema 2. Compatibilidade do sistema com o mundo real 3. Controle e liberdade do usuário 4. Consistência e padrões 5. Prevenção de erros 6. Reconhecimento ao invés de lembrança 7. Flexibilidade e eficiência de uso 8. Estética e design minimalista 9. Ajudar os usuários a reconhecer, diagnosticar e corrigir erros 10. Ajudas (Help) e documentação.

3. Conhecendo os 10 princípios heurísticos 1. Visibilidade do estado do sistema O sistema deve sempre manter os usuários informados sobre o que está acontecendo, através de comentários, dentro de um prazo razoável de tempo.

3. Conhecendo os 10 princípios heurísticos

3. Conhecendo os 10 princípios heurísticos 2. Compatibilidade do sistema com o mundo real O sistema deve falar a língua do usuário, com palavras, frases e conceitos familiares. Siga as convenções do mundo real para que a informação pareça lógica e muito natural.

3. Conhecendo os 10 princípios heurísticos 3. Controle e liberdade do usuário O usuário deve ter o controle de sua navegação. Ele escolhe o que vai acessar, quando e como. Todo o sistema deve ser sua saída, segunda escolha ou simplesmente a possibilidade de desfazer uma ação.

3. Conhecendo os 10 princípios heurísticos 4. Consistência e padrões Em um mesmo site, tudo deve ser consistente. Tanto em design (branding) quanto em funcionalidade. O usuário não deve ter questionamentos sobre ações já executadas e repetidas.

3. Conhecendo os 10 princípios heurísticos 5. Prevenção de erros Prever todas as maneiras e formatos de navegação ou manipulação de dados, com o objetivo de mapear eventuais erros.

3. Conhecendo os 10 princípios heurísticos 6. Reconhecimento ao invés de lembrança Minimize a carga de memória do usuário, fazendo objetos, ações e opções visíveis. O usuário não deve ter que lembrar de todas as funcionalidades ou interações antes de cada clique.

3. Conhecendo os 10 princípios heurísticos 7. Flexibilidade e eficiência de uso O sistema deve se adequar à usuários experientes ou inexperientes, deve permitir manipulações e formas diferentes e alternativas de se navegar.

3. Conhecendo os 10 princípios heurísticos 8. Estética e design minimalista As interfaces não devem conter informações que são irrelevantes ou raramente necessárias. Tudo, além do necessário, é ruído.

3. Conhecendo os 10 princípios heurísticos 9. Ajudar os usuários a reconhecer, diagnosticar e corrigir erros Melhor do que não ter erros, é informar o usuário onde ocorreu o erro, como ele ocorreu e como ele poderá corrigir ou contonar o erro.

3. Conhecendo os 10 princípios heurísticos 10. Ajudas (Help) e documentação. Fornecer um método de ajudar o usuário a navegar, através de recursos de ajuda e orientação.

4. Como identificar problemas de usabilidade

Onde eu estou: em que página eu me localizo, qual é o conteúdo disponível;

De onde eu vim: qual foi o meu caminho percorrido até aqui;

Onde eu posso ir: quais são as minhas opções de navegação e os recursos disponíveis a partir daqui.

Devemos responder:

Ideal: especialista duplo. Possui experiência nos processos e princípios de usabilidade, assim como métodos de avaliação;

Desejável: especialista em IHC;

Menos desejável: especialista no domínio de testes. Estuda princípios de interface e o processo de avaliação de sites;

Menos desejável ainda: membro da equipe de desenvolvimento. Tem dificuldade de deixar de lado seu papel de desenvolvedor.

Quem deve avaliar uma interface?

Fase de preparação: devemos definir onde será feita a avaliação: proposta de design (papel, protótipo ou ambiente definitivo), hipótese sobre os usuários ou cenário de tarefas;

Seções curtas (1 ou 2 horas) onde cada especialista:

Julga a conformidade de um determinado princípio de heurísticas (aspectos ou subaspectos);

Anota os problemas encontrados;

Julga a gravidade desses problemas;

Gera um relatório individual com comentários adicionais;

Avaliação heurística

Cosmético: poderia melhorar a satisfação subjetiva dos usuários;

“ Adorei essa página, mas se ela fosse rosinha seria muito mais bacana” – Panzinha, 16 anos, navegando no 8P.

2. Baixa criticidade: correção desejável do problema, pois limita as opções de navegação do usuário;

“ Acho que tenho que ir por aqui agora, né?” – André, 31 anos, depois que encontrou a matéria que procurava no G1.

3. Catastrófico: impede a utilização do ambiente;

“ Acho que agora deu” – Ricardo, no GloboEsporte, após 10 minutos de procura de uma determinada informação.

Como se categorizam os problemas?

Onde?

Um único local na interface;

Em dois locais na interface, casualmente;

Na estrutura geral da interface, de forma sistemática;

Algo que não está lá, que precisa ser incluído na interface.

Heurística violada

Explicação

Gravidade

Problema encontrado

5. Composição da interface Composição da interface

Conteúdo;

Conteúdo relacionado;

Navegação estrutural (zonas de salto);

Navegação relacionada;

Componentes de ação (botões, formulários, combos);

Componentes de orientação navegacional;

Cosmético: poderia melhorar a satisfação subjetiva dos usuários;

Como se categorizam os problemas?

Consigo obter as 3 respostas para essa interface?

6. Como o usuário enxerga a interface Como o usuário enxerga a interface?

6. Como o usuário enxerga a interface Como o usuário enxerga a interface? Eye-tranking

6. Como o usuário enxerga a interface Como o usuário enxerga a interface?

6. Como o usuário enxerga a interface Conclusões

Os usuários simplesmente filtram a publicidade descontextual;

Fotos vendem melhor o conteúdo;

A área conceitual, embora seja nobre, não é vista.

6. Como o usuário enxerga a interface

Os usuários possuem pouca paciência para a leitura;

6. Como o usuário enxerga a interface Existem diferenças entre usuários

6. Como o usuário enxerga a interface Mulher Homem

6. Como o usuário enxerga a interface Cuidados que devemos ter no desenho de interfaces

Os usuários usam a rolagem. Menos os perdidos;

Estudo de limitações dos usuários: 3Ps

Peso (lógico)

Performance (renderização)

Proximidade (linguagem, simbologia, metáforas)

Tudo deve ter rótulo;

Prever todas as possíveis interações;

Prever erros do sistema;

O usuário é a sua mãe, seu pai ou o tio que não entende nada;

7. Estudo de caso – atividade prática Obrigado :-) Renato Rosa [email_address] [email_address] +55 51 9335.3208

Oficina "Projetando Interações com Base Heurística" por Renato Rosa

0 comments

Notes on slide 1

10 Favorites