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

655 visualizações

Publicada em

1 sem 2016 - CEULJI ULBRA - Curso de Sistemas de Informação
Prof. Maigon Pontuschka

Publicada em: Internet
0 comentários
1 gostou
Estatísticas
Notas
  • Seja o primeiro a comentar

Sem downloads
Visualizações
Visualizações totais
655
No SlideShare
0
A partir de incorporações
0
Número de incorporações
199
Ações
Compartilhamentos
0
Downloads
40
Comentários
0
Gostaram
1
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

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

  1. 1. Interface Homem-Computador Aula 03 – Design de experiência e análise heurística PROF. MAIGON NACIB PONTUSCHKA maigonp@gmail.com 1° Semestre 2016 Parcialmente adaptado de material do Prof. Carlos Rosemberg – Universidade Federal do Ceará
  2. 2. 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.
  3. 3. Artefatos e interações são os elementos mais prováveis de se controlar, pois tratam-se das coisas que nós desenvolvemos.
  4. 4. Interações Como o usuário interage com os artefatos em sua volta? Quais estímulos ocorrem? Que sentidos são envolvidos?
  5. 5. 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
  6. 6. Quais os objetos que compõem a experiência? Quais suas as características? Artefatos
  7. 7. Produtos Softwares, roupas, equipamentos eletrônicos, etc Conceitos e idéias Marcas (Nokia, Apple, Fiat, etc), ideologias, etc Demais objetos presentes na experiência Nã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...
  8. 8. 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
  9. 9. 1 Funcionalidades 2 Estética 3 Usabilidade 4 Significado Status social, valor sentimental, metáforas, etc Utilidade Apelo aos sentidos Facilidade de uso As 4 dimensões de um artefato
  10. 10. 1 Funcionalidades 2 Estética 3 Usabilidade 4 Significado Status social, valor sentimental, metáforas, etc Utilidade Apelo aos sentidos Facilidade de uso Posicione seu produto aqui! As 4 dimensões de um artefato
  11. 11. 1: Funcionalidades As 4 dimensões de um artefato 1 Funcionalidades
  12. 12. Ofereça o que o usuário realmente precisa ou deseja. Nada mais, nada menos.
  13. 13. 2:Estética As 4 dimensões de um artefato 2 Estética
  14. 14. Um passeio pelos Princípios básicos do design Contraste Repetição Alinhamento Proximidade
  15. 15. Contraste
  16. 16. Repetição
  17. 17. Alinhamento
  18. 18. Proximidade
  19. 19. 3:Usabilidade As 4 dimensões de um artefato 3 Usabilidade
  20. 20. Usabilidade “A facilidade com que as pessoas podem empregar uma ferramenta ou objeto a fim de realizar uma tarefa” Wikipedia
  21. 21. 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
  22. 22. 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 usados como parte de uma avaliação de um artefato ou interface.
  23. 23. Heurísticas de usabilidade (Nielsen) 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
  24. 24. Heurísticas de Usabilidade (Nielsen) 1. Visibilidade do status do sistema • O sistema precisa manter os usuários informados sobre o que está acontecendo, fornecendo um feedback adequado dentro de 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 orientados ao sistema. Seguir convenções do mundo real, fazendo com que a informação apareça numa ordem natural e lógica
  25. 25. Heurísticas de Usabilidade (Nielsen) 3. Controle do usuário e liberdade • Fornecer maneiras de permitir que os usuários saiam dos lugares inesperados em que se encontram, utilizando “saídas de emergência” claramente identificadas. Prover funções undo e redo 4. Consistência e padrões • Evita fazer com que os usuários tenham que pensar se palavras, situações ou ações diferentes significam a mesma coisa. Seguir convenções de plataforma computacional
  26. 26. Heurísticas de Usabilidade (Nielsen) 5. Ajudar os usuários a reconhecer, diagnosticar e recurperar-se de erros • Utiliza linguagem simples para descrever a natureza do problema e sugere uma maneira de resolvê-lo 6. Prevenção de erros • Onde possível, impede a ocorrência de erros
  27. 27. Heurísticas de Usabilidade (Nielsen) 7. Reconhecimento ao invés de memorização • tornar objetos, ações e opções visíveis. O usuário não deve ter que lembrar informação de uma para outra parte do diálogo. Instruções para uso do sistema devem estar visíveis e facilmente recuperáveis quando necessário 8. Flexibilidade e eficiência de uso • 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ções freqüentes
  28. 28. Heurísticas de Usabilidade (Nielsen) 9. Estética e design minimalista • diálogos não devem conter informação irrelevante ou raramente necessária. Qualquer unidade de informação extra no diálogo irá competir com unidades relevantes de informação e diminuir sua visibilidade relativa 10.Ajuda e documentação • embora seja melhor um sistema que possa ser usado sem documentação, é necessário prover ajuda e documentação. Essas informações devem ser fáceis de encontrar, e a ajuda deve ser feita mediante uma série de passos concretos que podem ser facilmente seguidos.
  29. 29. 4:Significado As 4 dimensões de um artefato 4 Significado
  30. 30. Inspeção de Usabilidade AVALIAÇÃO HEURÍSTICA
  31. 31. 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.
  32. 32. 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
  33. 33. Heurísticas de usabilidade (Nielsen) 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
  34. 34. 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
  35. 35. 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
  36. 36. 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
  37. 37. 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
  38. 38. Problemas de Usabilidade Visibilidade e status do sistema ajudar os usuários a reconhecer, diagnosticar e corrigir erros
  39. 39. Problemas de Usabilidade Compatibilidade do sistema com o mundo real
  40. 40. Consistência e padrão; prevenção de erros
  41. 41. Problemas de Usabilidade Ajudar os usuários a reconhecer, diagnosticar e corrigir erros
  42. 42. Problemas de Usabilidade Estética e design minimalista
  43. 43. Problemas de Usabilidade Flexibilidade e eficiência de uso
  44. 44. Problemas de Usabilidade Ajuda e documentação Consistência e padrão; prevenção de erros Estética e design minimalista
  45. 45. Problemas de usabilidade Visibilidade e status do sistema Compatibilidade com o mundo real
  46. 46. Problemas de Usabilidade
  47. 47. Saídas claramente marcadas
  48. 48. Avaliação Heurística
  49. 49. 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)
  50. 50. Avaliação Heurística 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)
  51. 51. Avaliação Heurística 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)
  52. 52. Avaliação Heurística 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)
  53. 53. Avaliação Heurística 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)
  54. 54. 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
  55. 55. Bibliografia da aula • PREECE, J.; ROGERS,Y.; SHARP, H. Design de Interação: além da interação homem-computador, PortoAlegre: Bookman, 2005. • NIELSEN, J.Ten usability Heuristics. 2001 www.useit.com/papers/heuristic • NIELSEN, J. ProjetandoWeb Sites. Rio de Janeiro: Campus, 2000. • NIELSEN, J.;TAHIR, M. Homepage usabilidade: 50 websites desconstruídos. Rio de Janeiro: Campus, 2002.

×