Interface Humano Computador - Aula03 - design de experiência de usuário e análise heuristica

Interface Homem-ComputadorAula 03 – Design de experiência e análise heurística

P R O F. M A I G O N N A C I B P O N T U S C H K Am a i g o n p @ g m a i l . c o m1 ° S e m e s t r e 20 1 6

P a r c i a l m e n t e a d a p t a d o d e m a t e r i a l d o P r o f. C a r l o s Ro s e m b e r g – U n i v e r s i d a d e F e d e r a l d o C e a r á

O design de experiência procura entender como os elementos de uma interface agem ou podem agir durante a experiência.

Depois, tenta controlá-los ou influenciá-los através da manipulação de seus atributos.

Artefatos e interaçõessão os elementos mais prováveis de se controlar, pois tratam-se das coisas que nós desenvolvemos.

Interações

Como o usuário interage com os artefatos em sua volta?

Quais estímulos ocorrem? Que sentidos são envolvidos?

Trabalhando com os 5 sentidos

Entenda quais e como os sentidos do indivíduo são afetados visão, audição, olfato, paladar e tato

Entenda como os artefatos interagem entre si, inclusive quando afetam a performance do seu produto.Sujeira, barulho, distrações, etc

Quais os objetos que compõem a experiência?Quais suas as características?

Artefatos

ProdutosSoftwares, roupas, equipamentos eletrônicos, etc

Conceitos e idéiasMarcas (Nokia, Apple, Fiat, etc), ideologias, etc

Demais objetos presentes na experiênciaNão são o principal artefato, mas interferem no que está acontecendo. Ex: teclado de um computador com teclas defeituosas durante a redação de uma monografia.

Artefatos são...

1

Funcionalidades

2

Estética

3

Usabilidade

4

Significado

As 4 dimensões de um artefato

Status social,valor sentimental,

metáforas, etc

Utilidade

Apelo aos sentidos

Facilidade de uso

1

Funcionalidades

2

Estética

3

Usabilidade

4

Significado


metáforas, etc

Utilidade

Apelo aos sentidos

Facilidade de uso


1

Funcionalidades

2

Estética

3

Usabilidade

4

Significado


metáforas, etc

Utilidade

Apelo aos sentidos

Facilidade de uso

Posicione seu

produto aqui!


1: Funcionalidades


1

Funcionalidades

Ofereça o que o usuário realmente precisa ou deseja.Nada mais, nada menos.

2: Estética


2

Estética

Um passeio pelos

Princípios básicos do design

ContrasteRepetiçãoAlinhamento Proximidade

Contraste

Repetição

Alinhamento

Proximidade

3: Usabilidade


3

Usabilidade

Usabilidade“A facilidade com que as pessoas podem empregar uma ferramenta ou objeto a fim de realizar uma tarefa”

Wikipedia

Metas da Experiência do Usuário X

Metas da Usabilidade

Experiência do usuário

Satisfatório

Agradável

Divertido

Interessante

Útil

Motivador

Esteticamente apreciável

Incentivador de criatividade

Compensador

Emocionalmente adequado

Usabilidade

Eficaz

Eficiente

Seguro

Útil

Fácil de aprender

Fácil de se lembrar como se usa

Heurísticas de usabilidade (Nielsen)

Os príncípios do design, quando usados na prática, normalmente são chamados de heurística.

São princípios semelhantes aos princípios do design, mas são mais prescritivos.

São a estrutura para a avaliação heurística quando usadoscomo parte de uma avaliação de um artefato ou interface.


1. Visibilidade do status do sistema

2. Metáforas com o mundo real

3. Controle do usuário e liberdade

4. Consistência e padrões

5. Prevenção de erros

6. Reconhecer ao invés de lembrar

7. Flexibilidade e eficiência de uso

8. Design e estética minimalista

9. Ajudar aos usuários a reconhecer, diagnosticar e sair de erros

10. Ajuda e documentação

Heurísticas de Usabilidade (Nielsen)


• O sistema precisa manter os usuários informados sobre o que está acontecendo, fornecendo um feedback adequado dentrode um tempo razoável

2. Compatibilidade do sistema com o mundo real

• O sistema fala a linguagem do usuário com palavras, frases e conceitos familiares ao usuário, ao invés de termos orientadosao sistema. Seguir convenções do mundo real, fazendo com que a informação apareça numa ordem natural e lógica



• Fornecer maneiras de permitir que os usuários saiam doslugares inesperados em que se encontram, utilizando “saídasde emergência” claramente identificadas. Prover funçõesundo e redo


• Evita fazer com que os usuários tenham que pensar sepalavras, situações ou ações diferentes significam a mesmacoisa. Seguir convenções de plataforma computacional


5. Ajudar os usuários a reconhecer, diagnosticar erecurperar-se de erros

• Utiliza linguagem simples para descrever a natureza doproblema e sugere uma maneira de resolvê-lo


• Onde possível, impede a ocorrência de erros


7. Reconhecimento ao invés de memorização

• tornar objetos, ações e opções visíveis. O usuário não deve ter quelembrar informação de uma para outra parte do diálogo.Instruções para uso do sistema devem estar visíveis e facilmenterecuperáveis quando necessário


• usuários novatos se tornam peritos com o uso. Prover aceleradores de forma a aumentar a velocidade da interação. Permitir a usuários experientes "cortar caminho" em açõesfreqüentes


9. Estética e design minimalista

• diálogos não devem conter informação irrelevante ou raramentenecessária. Qualquer unidade de informação extra no diálogo irácompetir com unidades relevantes de informação e diminuir suavisibilidade relativa

10.Ajuda e documentação

• embora seja melhor um sistema que possa ser usado semdocumentação, é necessário prover ajuda e documentação. Essasinformações devem ser fáceis de encontrar, e a ajuda deve ser feitamediante uma série de passos concretos que podem ser facilmenteseguidos.

4: Significado


4

Significado

Inspeção de UsabilidadeAVALIAÇÃO HEUR ÍSTICA

A esta altura, já temos o mínimo de informação sobre a experiênca do usuário para começar a

meter a mão na massa.

Como conduzir

• Parte do processo de design interativo

• Pequeno conjunto de avaliadores (3 a 5) examinando a interface e analisando o atendimento as heurísticas de usabilidade

Por que estudar IHC ? Heloísa Vieira da Rocha - IHC'2002



2. Metáforas com o mundo real




6. Reconhecer ao invés de lembrar


8. Design e estética minimalista

9. Ajudar aos usuários a reconhecer, diagnosticar e sair de erros

10. Ajuda e documentação

Como conduzir

• Usar um observador

• Duração de uma sessão de avaliação - ~2horas

• Durante a sessão de avaliação o avaliador percorre a interface diversas vezes inspecionando as diferentes componentes do diálogo e comparando-as com a lista de princípios de usabilidade

• o avaliador decide como conduzir a avaliação

• percorrer a interface pelo menos duas vezes

Resultado da Avaliação

Lista de problemas de usabilidade da interface com referência aos princípios de usabilidade que foram violados

Avaliação heurística não objetiva prover meios de corrigir os problemas em um redesign e não levanta os aspectos positivos do design

debriefing session

Custo-benefício: custo de $10.500 -- benefício de $500.000

Graus de Severidade

• Combinação de 3 fatores

• Frequência

• Comum ou raro ?

• Impacto

• Fácil ou difícil para o usuário superá-lo ?

• Persistência

• Problema de uma única vez que o usuário pode superar desde que saiba que ele existe ou os usuários serão repetidamente incomodados por ele ?

• Impacto de mercado

Graus de Severidade

1. Eu não concordo que isso é um problema de usabilidade

2. É um problema cosmético somente

• Precisa ser corrigido somente se sobrar algum tempo no projeto

3. Problema de usabilidade menor

• Corrigí-lo deve ter prioridade baixa

4. Problema de usabilidade grave

• Importante corrigí-lo, deve ser dada alta prioridade

5. Catástrofe de usabilidade

• A sua correção é imperativa antes do produto ser liberado

Problemas de Usabilidade

Visibilidade estatus do sistema

ajudar os usuários a reconhecer,diagnosticar e corrigir erros


Compatibilidade do sistema com o mundo real

Consistência e padrão; prevenção de erros


Ajudar os usuários a reconhecer, diagnosticar e corrigir erros


Estética e design minimalista


Flexibilidade e eficiência de uso


Ajuda e documentação

Consistência e padrão;

prevenção de erros

Estética e design minimalista

Problemas de usabilidade

Visibilidade e status do sistema

Compatibilidade com o mundo real


Saídas claramente marcadas

Avaliação Heurística


1. O nome do sistema está muito proeminente. Tornando-o menor, poderia ser aproveitado o espaço para outros componentes alternativos do diálogo, ou a tela poderia ficar menos carregada (Estética e design minimalista)

2. O mapa poderia apresentar os nomes de pelo menos algumas cidades grandes ou outras informações que pudessem auxiliar o usuário a se localizar. Cuidado deve ser tomado para não sobrecarregar demais o mapa. (compatibilidade do sistema com o mundo real, visibilidade do status do sistema)

3. Mesmo que tempo não respeite limites políticos, é muito difícil ler um mapa que não apresenta limites de estados ou países. (compatibilidade do sistema com o mundo real, visibilidade do status do sistema)


4. O formato da data ( dia/mês/ano) pode ser mal interpretado por usuários estrangeiros. Um meio de evitar isso é representar o mês por seu nome ao invés de seu número. ( prevenção de erros)

5. Os zeros na data estão cortados, o que é um modo computacional de escrever zeros. Usar um tipo regular de zeros. (compatibilidade do sistema com o mundo real)


6. O termo “Precipitação” pode ser de difícil entendimento para usuários estrangeiros (que são usuários alvo do sistema). Poderia ser considerada a possibilidade de usar palavras simples como Chuva/Neve. Usabilidade internacional poderia ser aumentada adicionando ícones como um termômetro para temperatura e gotas de chuva para precipitações. ( compatibilidade do sistema com o mundo real)


7. O display das temperaturas em Farenheit e Celsius são mutuamente exclusivos, com um dos dois ativos em um dado momento. Portanto, a escolha da escala da temperatura deveria ser feita via radio buttons e não com check boxes (que geralmente são utilizados para opções não mutuamente exclusivas) (Consistência e padrões)

8. A seleção da escala da temperatura não é uma informação adicional do mesmo tipo que Temperature/Precipitation/Visibility/Wind. A escolha da escala da temperatura deveria ser agrupada com a seleção da temperatura e deveria ser desativada (gray out) quando temperatura não é escolhida. (estética e design minimalista; compatibilidade do sistema com o mundo real)


9. Não está aparente na tela o modo de sair do sistema. Adicionar uma caixa close ou um botão quit. (controle do usuário e liberdade)

10. O sistema não tem nenhuma característica de ajuda. Espera-se que a interface seja redesenhada e que os usuários não necessitem de ajuda, mas o sistema certamente continuará complexo o suficiente para prover uma tela de help. Por exemplo, a tela de help poderia explicar como o dado de visibilidade deve ser interpretado. (Ajuda e documentação)

Conclusões

• Avaliadores devem percorrer a interface pelo menos duas vezes

• Na primeira focalizar no fluxo e na segunda nas componentes individuais do diálogo

• Inspecionar a interface com base na lista de princípios de usabilidade - justificar e detalhar ao máximo todos os problemas detectados

• Combinar os problemas encontrados por 3 a 5 avaliadores e fazer com que trabalhem individualmente ( sem que um influencie o outro)

• debriefing session

• coletar graus de severidade

Bibliografia da aula

• PREECE, J.; ROGERS, Y.; SHARP, H. Design de Interação: além da interação homem-computador, Porto Alegre: Bookman, 2005.

• NIELSEN, J. Ten usability Heuristics. 2001 www.useit.com/papers/heuristic

• NIELSEN, J. Projetando Web Sites. Rio de Janeiro: Campus, 2000.

• NIELSEN, J.; TAHIR, M. Homepage usabilidade: 50 websites desconstruídos. Rio de Janeiro: Campus, 2002.

Internet

Interface Humano Computador - Aula03 - design de experiência de usuário e análise heuristica