Newton Paiva - DI - Aula 06

794 visualizações

Publicada em

Apresentação realizada por Marcello de Campos Cardoso em Novembro de 2011 para a disciplina Design, usabilidade e arquitetura de informação, ministrada no curso de especialização em Pós Graduação em Marketing Digital no Centro Universitário Newton Paiva.

0 comentários
0 gostaram
Estatísticas
Notas
  • Seja o primeiro a comentar

  • Seja a primeira pessoa a gostar disto

Sem downloads
Visualizações
Visualizações totais
794
No SlideShare
0
A partir de incorporações
0
Número de incorporações
2
Ações
Compartilhamentos
0
Downloads
41
Comentários
0
Gostaram
0
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

Newton Paiva - DI - Aula 06

  1. 1. Design, usabilidade e arquitetura de informação / Marcello Cardoso aula 06/06! Percurso Cognitivo Avaliando tarefas Pós Graduação em Marketing Digital Design, usabilidade e arquitetura de informação Marcello de Campos Cardoso | www.mcardoso.com.br | mcardoso@gmail.comFriday, October 28, 2011
  2. 2. Design, usabilidade e arquitetura de informação / Marcello Cardoso Plano de curso 1ª Introdução a Usabilidade: conceitos, origem (DCU, IHC), aplicação (IxD), tipos de design, metas de usabilidade, princípios de design. 2ª Conversando com usuários: Questionários e entrevistas 20pts 3ª Técnica de Modelagem: Personas ágeis (workshop) 20pts 4ª Projetando a interface: Task Flow + Prototipação rápida (workshop) 20pts 5ª Perguntando a especialistas: As 10 heurísticas de Nielsen (workshop) 20pts 6ª Percurso cognitivo: Avaliando tarefas 20ptsFriday, October 28, 2011
  3. 3. Design, usabilidade e arquitetura de informação / Marcello Cardoso Questionários Percurso e rking entrevistas Cognitivo chma Card Sorting Ben to jam isa to en o ne qu çã en lvim lida pla pes vo sen va de rototipação p urística Análise He personasFriday, October 28, 2011
  4. 4. Design, usabilidade e arquitetura de informação / Marcello Cardoso Percurso Cognitivo Avaliando tarefas do sistemaFriday, October 28, 2011
  5. 5. Design, usabilidade e arquitetura de informação / Marcello Cardoso Percurso Cognitivo a incrível jornada do usuário!Friday, October 28, 2011
  6. 6. Design, usabilidade e arquitetura de informação / Marcello Cardoso Como pensam os usuários? (pacman) Que caminho percorrem? (maze) Quais os desafios? (ghosts)Friday, October 28, 2011
  7. 7. Design, usabilidade e arquitetura de informação / Marcello Cardoso Definição É um método de inspeção de usabilidade usado para identificar problemas em um sistema digital, focando em quão fácil é para novos usuários realizarem tarefas neste sistema. É um método embasado na engenharia cognitiva. Percursos – Introdução - Livro texto - pág. 442 Guia prático em inglês, original: http://ics.colorado.edu/techpubs/pdf/93-07.pdfFriday, October 28, 2011
  8. 8. Design, usabilidade e arquitetura de informação / Marcello Cardoso Engenharia cognitiva Formalizada por Donald Norman em 1986, é uma abordagem que reúne conhecimentos mistos de ciência cognitiva, psicologia cognitiva e fatores humanos ao design de interfaces.Friday, October 28, 2011
  9. 9. Design, usabilidade e arquitetura de informação / Marcello Cardoso Engenharia cognitiva - conceitos básicos O designer cria um modelo de design, um modelo mental de como o sistema deve e comportar, baseado nos seu modelo de usuário e tarefa. Modelo de design implementado = Imagem do sistema O usuário real interage com a imagem do sistema e cria seu modelo mental da aplicação.Friday, October 28, 2011
  10. 10. Design, usabilidade e arquitetura de informação / Marcello CardosoFriday, October 28, 2011
  11. 11. Design, usabilidade e arquitetura de informação / Marcello Cardoso Engenharia cognitiva - conceitos básicos A tarefa do designer é desenvolver o modelo de design de um sistema que se aproxime do modelo mental da aplicação do usuário real. A solução é que o designer entenda o usuário. Para isso Norman propõe a teoria da ação.Friday, October 28, 2011
  12. 12. Design, usabilidade e arquitetura de informação / Marcello CardosoFriday, October 28, 2011
  13. 13. Design, usabilidade e arquitetura de informação / Marcello Cardoso O designer deve realizar as melhores escolhas para isso. deve escolher os padrões de interação, elementos e feedbacks mais adequados. Para verificar se uma interface cumpre melhor este papel, pode usar algumas técnicas de inspeção de usabilidade.Friday, October 28, 2011
  14. 14. Design, usabilidade e arquitetura de informação / Marcello Cardoso Inspeção de usabilidade Um conjunto de métodos e técnicas para avaliação especialista de interfaces de sistemas. Contrasta com testes de usabilidade, onde há a participação ativa de usuários no processo.Friday, October 28, 2011
  15. 15. Design, usabilidade e arquitetura de informação / Marcello Cardoso Diferenças entre AH e PC Análise Heurística oferece uma abordagem holística para identificar problemas de usabilidade Percurso Cognitivo foca na execução da tarefa para encontrar estes problemasFriday, October 28, 2011
  16. 16. Design, usabilidade e arquitetura de informação / Marcello Cardoso Percurso Cognitivo: De onde veio Foi proposto em 1994 por Wharton, Rieman, Lewis e Polson, contemporâneo do método de Avaliação Heurística (1993). Ao contrário do AH, o PC é baseado conhecimento teórico: Uma teoria do aprendizado por exploração (proposto por Polson e Lewis em 1990): Ao se depararem com algo novo, as pessoas naturalmente tentam entender do que se trata explorando a novidade em um contexto concreto de atividade.Friday, October 28, 2011
  17. 17. Design, usabilidade e arquitetura de informação / Marcello Cardoso Trocando em miúdos... No contexto de IHC o que isto significa é que diante de um sistema novo, os usuários começam a usá-lo (exploratoriamente) para aprendê-lo. Não vão ler manuais ou assistir a tutoriais primeiro. A ideia é usar a teoria cognitiva para prever quanto tempo (ou esforço cognitivo) será necessário para os usuários aprenderem uma interface através de um processo de exploração.Friday, October 28, 2011
  18. 18. Design, usabilidade e arquitetura de informação / Marcello Cardoso Percurso Cognitivo: Pra que serve Foco no aprendizado: Ajuda na verificação do quão intuitível uma interface é, ou o quanto oferece de potencial de aprendizado sobre seu funcionamento durante sua exploração. Keywords: Intuitível, aprendizado, memorização, exploraçãoFriday, October 28, 2011
  19. 19. Design, usabilidade e arquitetura de informação / Marcello Cardoso Percurso Cognitivo: Quem aplica Deve ser aplicada por designers ou desenvolvedores munidos de informações sobre o sistema e os usuários. É menos efetiva se o avaliador é o projetista da interface.Friday, October 28, 2011
  20. 20. Design, usabilidade e arquitetura de informação / Marcello Cardoso Percurso Cognitivo: Como aplicar Preparação O avaliador precisa levantar: ‣ O perfis de usuários visados ‣ A lista de tarefas do sistemaFriday, October 28, 2011
  21. 21. Design, usabilidade e arquitetura de informação / Marcello Cardoso autor: Marcos Machado / fonte: http://www.designdeinteracao.com.br/2008/10/27/quando-a-ideologia-se-reflete-na-usabilidade/Friday, October 28, 2011
  22. 22. Design, usabilidade e arquitetura de informação / Marcello Cardoso Urna eletrônica brasileira Usuário – Eleitor insatisfeito com os candidatos à eleição. Tarefas chave – Votar Nulo, votar branco, votar em um candidato. autor: Marcos Machado / fonte: http://www.designdeinteracao.com.br/2008/10/27/quando-a-ideologia-se-reflete-na-usabilidade/Friday, October 28, 2011
  23. 23. Design, usabilidade e arquitetura de informação / Marcello Cardoso 1º passo | Análise da tarefa Eles elaboram CENÁRIOS TÍPICOS para as tarefas que o sistema se destina a apoiar, identificando: ‣ O passo-a-passo para as tarefas selecionadas ‣ O que os usuários supostamente JÁ SABEM ao se deparar como sistema pela primeira vez (ex, seu CPF, etc)Friday, October 28, 2011
  24. 24. Design, usabilidade e arquitetura de informação / Marcello Cardoso autor: Marcos Machado / fonte: http://www.designdeinteracao.com.br/2008/10/27/quando-a-ideologia-se-reflete-na-usabilidade/Friday, October 28, 2011
  25. 25. Design, usabilidade e arquitetura de informação / Marcello Cardoso Tarefa escolhida - Votar Nulo CENÁRIO - O eleitor vai votar pela primeira vez, mas como não gostou de nenhuma das propostas dos candidatos, está decidido a anular o seu voto. SEQÜÊNCIA DE AÇÕES Passo 1 – Digitar um número inexistente. Passo 2 – Apertar o botão “Confirmar”. autor: Marcos Machado / fonte: http://www.designdeinteracao.com.br/2008/10/27/quando-a-ideologia-se-reflete-na-usabilidade/Friday, October 28, 2011
  26. 26. Design, usabilidade e arquitetura de informação / Marcello Cardoso 2º passo | O percurso cognitivo Os inspetores então percorrem os passos (solo ou grupo), perguntando e discutindo 4 perguntas básicas em cada passo. As questões importantes são levantadas e anotadas. Os problemas procurados são relacionados com a compreensão da interface: taxonomia, posição de atalhos e botões, breadcrumbs, loading, hovers, mensagens de erro...Friday, October 28, 2011
  27. 27. Design, usabilidade e arquitetura de informação / Marcello Cardoso autor: Marcos Machado / fonte: http://www.designdeinteracao.com.br/2008/10/27/quando-a-ideologia-se-reflete-na-usabilidade/Friday, October 28, 2011
  28. 28. Design, usabilidade e arquitetura de informação / Marcello Cardoso “Hum vejamos, onde é que anulo meu voto? O botão para votar em branco está ali, mas não quero votar em branco, quero anular meu voto. Talvez se eu tentar digitar o número de algum candidato” autor: Marcos Machado / fonte: http://www.designdeinteracao.com.br/2008/10/27/quando-a-ideologia-se-reflete-na-usabilidade/Friday, October 28, 2011
  29. 29. Design, usabilidade e arquitetura de informação / Marcello Cardoso autor: Marcos Machado / fonte: http://www.designdeinteracao.com.br/2008/10/27/quando-a-ideologia-se-reflete-na-usabilidade/Friday, October 28, 2011
  30. 30. Design, usabilidade e arquitetura de informação / Marcello Cardoso “Ok, não tem nada para anular aqui também, não quero votar nesse cara, vou corrigir.” autor: Marcos Machado / fonte: http://www.designdeinteracao.com.br/2008/10/27/quando-a-ideologia-se-reflete-na-usabilidade/Friday, October 28, 2011
  31. 31. Design, usabilidade e arquitetura de informação / Marcello Cardoso autor: Marcos Machado / fonte: http://www.designdeinteracao.com.br/2008/10/27/quando-a-ideologia-se-reflete-na-usabilidade/Friday, October 28, 2011
  32. 32. Design, usabilidade e arquitetura de informação / Marcello Cardoso “É mesmo, talvez eu precise votar em um número qualquer sem ser os dos candidatos.” autor: Marcos Machado / fonte: http://www.designdeinteracao.com.br/2008/10/27/quando-a-ideologia-se-reflete-na-usabilidade/Friday, October 28, 2011
  33. 33. Design, usabilidade e arquitetura de informação / Marcello Cardoso autor: Marcos Machado / fonte: http://www.designdeinteracao.com.br/2008/10/27/quando-a-ideologia-se-reflete-na-usabilidade/Friday, October 28, 2011
  34. 34. Design, usabilidade e arquitetura de informação / Marcello Cardoso “Número errado? Eu sei que é errado, mas quero votar nulo. A sim, está aqui bem pequeno, se eu confirmar eu voto nulo.” autor: Marcos Machado / fonte: http://www.designdeinteracao.com.br/2008/10/27/quando-a-ideologia-se-reflete-na-usabilidade/Friday, October 28, 2011
  35. 35. Design, usabilidade e arquitetura de informação / Marcello Cardoso autor: Marcos Machado / fonte: http://www.designdeinteracao.com.br/2008/10/27/quando-a-ideologia-se-reflete-na-usabilidade/Friday, October 28, 2011
  36. 36. Design, usabilidade e arquitetura de informação / Marcello Cardoso “É isso, mas seria mais simples se houvesse um botão para anular igual tem para votar em branco.” autor: Marcos Machado / fonte: http://www.designdeinteracao.com.br/2008/10/27/quando-a-ideologia-se-reflete-na-usabilidade/Friday, October 28, 2011
  37. 37. Design, usabilidade e arquitetura de informação / Marcello Cardoso 2º passo | O percurso cognitivo 1) A ação que o usuário pretende realizar está presente na interface? O atalho para a ação existe na interface? (visibilidade) 2) A ação correta é evidente para o usuário? Ele sabe o que fazer pra chegar no seu objetivo? (compreensão) 3) O usuário irá associar as ações corretas ao que pretende fazer? Saberá como realizar a tarefa? (eficácia) 4) O usuário perceberá que progrediu em direção à solução da tarefa? Existe feedback claro em tempo hábil? (feedback)Friday, October 28, 2011
  38. 38. Design, usabilidade e arquitetura de informação / Marcello Cardoso Questões / Passos Digitar um número inexistente Apertar o botão “Confirmar” A ação que o usuário pretende realizar Não Sim está presente na interface Não. É necessário que o usuário tenha um Sim. Mas a interface apresenta a conhecimento prévio de que é preciso A ação correta é evidente para o usuário? mensagem de erro “Número errado”, que digitar um número inexistente para anular pode causar confusão no usuário. o voto. O usuário irá associar as ações corretas Não Sim ao que pretende fazer? Sim, porém o texto que informa a possível Irá o usuário interpretar de forma correta Não, pois a interface julga a digitação de anulação do voto tem pouco destaque em a resposta do sistema a ação escolhida? um número inexistente como um erro. relação aos outros elementos da interface. autor: Marcos Machado / fonte: http://www.designdeinteracao.com.br/2008/10/27/quando-a-ideologia-se-reflete-na-usabilidade/Friday, October 28, 2011
  39. 39. Design, usabilidade e arquitetura de informação / Marcello Cardoso 3º passo | Relatório Um relatório é gerado apontando os problemas de usabilidade e as recomendações para melhoria do sistema. O relatório deve conter indicações visuais de onde os problemas são encontrados.Friday, October 28, 2011
  40. 40. Design, usabilidade e arquitetura de informação / Marcello Cardoso RESULTADO Não há uma ação explícita para a tarefa na interface. A tarefa não é vista como uma opção válida para o sistema e a interface que apresenta as informações sobre um possível erro na digitação do número do candidato, também serve para que a ação de anular o voto seja completada. Dessa forma, a tarefa de votar nulo é associada a um erro, o que além de dificultar a realização da tarefa, prejudica a sua credibilidade para os usuários. autor: Marcos Machado / fonte: http://www.designdeinteracao.com.br/2008/10/27/quando-a-ideologia-se-reflete-na-usabilidade/Friday, October 28, 2011
  41. 41. Design, usabilidade e arquitetura de informação / Marcello Cardoso Percurso Pluralístico (Pluralistic Walkthrought) Semelhante ao percurso cognitivo, com a diferença de que um grupo misto de profissionais/usuários de diferentes áreas avalia em conjunto e negocia as respostas. As equipes devem ser compostas por designers, desenvolvedores e usuários representativos. Percursos – Introdução - Livro texto - pág. 444-445Friday, October 28, 2011
  42. 42. Design, usabilidade e arquitetura de informação / Marcello Cardoso igad o! o br Este arquivo contém a apresentação realizada por Marcello de Campos Cardoso, em Setembro de 2011, para a disciplina Design, usabilidade e arquitetura de informação, ministrada no curso de Pós Graduação em Marketing Digital no Centro Universitário Newton Paiva.Friday, October 28, 2011

×