Aula_04_IHC_Principios cognitivos

Prévia do material em texto

INTERFACE HOMEM-MÁQUINA APLICADA A EDUCAÇÃOINTERFACE HOMEM-MÁQUINA APLICADA A EDUCAÇÃO
Prof. Josilene A Brito material adaptado do prof Lucas Lattari e Alberto Raposo
IHC – Princípios CognitivosIHC – Princípios Cognitivos
 
Conhecimento da psicologia cognitiva para IHCConhecimento da psicologia cognitiva para IHC
• Cognição: o que se passa na mente do usuário enquanto 
realiza suas atividades diárias. 
 
Experiencial Experiencial 
– envolve pensar, agir 
e reagir de forma 
eficiente e sem esforço
 quando fazemos algo 
certo e bem sem nos darmos 
conta de que o fazemos
 ações rápidas e intuitivas
 requer experiência e 
engajamento.
Ex.: dirigir um automóvel, 
ler um livro, conversar etc.
Cognição Experiencial e Reflexiva (Norman, 1993)Cognição Experiencial e Reflexiva (Norman, 1993)
ReflexivaReflexiva
– envolve pensar, 
comparar, tomar decisões
 quando fazemos algo certo e 
bem por causa de termos 
raciocinado e decidido (ou 
descoberto) como agir
 Promove novas ideias e 
criatividade
 
 
Experiencial ou Reflexiva?Experiencial ou Reflexiva?
– Esses dois tipos de cognição são essenciais para a 
vida quotidiana
 – cada um requer tipos diferentes de apoio tecnológico.
• Não é verdade que as interfaces de usuário devam 
sempre ser projetadas para maximizar um ou outro 
tipo de cognição. Sempre depende.
 
A Cognição também diz respeito a tipos específicosA Cognição também diz respeito a tipos específicos
de processos (Norman, 1993)de processos (Norman, 1993)
– atenção
– percepção e reconhecimento
– memória
– aprendizado
– leitura, fala e audição
– resolução de problemas. Planejamento, 
raciocínio e tomada de decisões
 
A Cognição também diz respeito a tipos específicosA Cognição também diz respeito a tipos específicos
de processos (Norman, 1993)de processos (Norman, 1993)
– atenção
– Consiste no processo de selecionar coisas em que se 
concentrar, num certo momento, dentre a variedade 
de possibilidade disponível;
– Envolve nossos sentidos auditivos e / ou visuais;
– Permite focar em uma informação que é relevante 
para o que estamos fazendo. 
 
Exemplo - AtençãoExemplo - Atenção
– Para onde vai o foco da atenção do usuário?
 
Atenção – o que focar?Atenção – o que focar?
– Nos permite focar uma informação que é 
relevante para o que estamos fazendo.
– Depende:
(i) termos objetivos claros e (ii) de a 
informação que precisamos esta saliente no 
ambiente.
 Em que medida esse processo pode ser fácil ou difícil?Em que medida esse processo pode ser fácil ou difícil?
 
Atenção – Como facilitar?Atenção – Como facilitar?
– Pelo Objetivo: Atenção focada e dividida 
– se sabemos o que queremos encontrar, 
tentamos combinar com a informação disponível ;
– nos permite ser seletivos em termos dos 
estímulos concorrentes;
– Quando não estamos certos do que estamos 
procurando, podemos olhar aleatoriamente a 
informação, deixando que ela guie nossa atenção 
para os itens salientes.
 
Atenção – Como facilitar?Atenção – Como facilitar?
– Pela apresentação da informação: 
– a maneira como a informação é apresentada 
pode influenciar muito a facilidade ou dificuldade 
de se achar às informações desejadas.
– Quando não estamos certos do que estamos 
procurando, podemos olhar aleatoriamente a 
informação, deixando que ela guie nossa atenção 
para os itens salientes.
 
Atenção – AtividadeAtenção – Atividade
– Observe a figura abaixo e encontre o preço do 
quarto duplo (double) no hotel Holiday Inn em 
Bradley. 
 
Atenção – AtividadeAtenção – Atividade
– Encontre o preço do quarto duplo (double) no 
hotel Quality Inn em Columbia. 
 
Atenção – AtividadeAtenção – Atividade
– Qual das duas atividades exigiu menos esforço 
cognitivo?
– Por que?
 
 
Implicações para o design - AtençãoImplicações para o design - Atenção
– Faça com que a informação fique saliente quando necessária 
em um dado momento da realização de uma tarefa;
 
–Utilize técnicas de gráficos animados, cores, sublinhados, 
ordenação de itens,sequenciamento de informações diferentes e 
espaçamento de itens;
– Evite entulhar a interface com muitas informações, o que deve 
ser aplicado especialmente ao uso de cores, sons e gráficos;
– As interfaces mais simples, são muito mais fáceis de usar, como 
da ferramenta de busca google.
 
Implicações para o design - AtençãoImplicações para o design - Atenção
– Interface da ferramenta de pesquisa google
 
Percepção – AtividadePercepção – Atividade
– Qual elemento é mais fácil de perceber /ler?
 
Percepção Percepção 
– Como a informação é adquirida do mundo e 
transformada em experiências 
– através dos sentidos (e.g.: visão, audição, tato)
– Pessoas que enxergam: visão é o sentido 
Pessoas que enxergam: visão é o sentido 
dominante, seguido de audição e tato.
 
Percepção - atividade Percepção - atividade 
– Qual formulário é mais legível? Por quê?
 
Percepção - atividade Percepção - atividade 
– Em qual representação é mais fácil se concentrar no 
que interessa?
 
Implicações de design - Percepção Implicações de design - Percepção 
– Projete representações de informação diretamente perceptíveis 
 e reconhecíveis em mídias diferentes:
– texto deve ser legível e distinto do fundo
 • uso de alinhamento, contraste, proporções
– ícones e imagens devem ser fáceis de enxergar e de diferenciar 
uns dos outros;
– sons devem ser claros e compreensíveis, para que os usuários 
entendam o que representam;
– saída de voz deve permitir que os usuários diferenciem o 
conjunto de palavras faladas;
– feedback tátil deve permitir reconhecer o significado de diversas 
 sensações que estão sendo emitidas.
 
Memória Memória 
– Que estratégias você utiliza para lembrar de algo?
EscritaEscrita
Estratégias mentais Estratégias mentais 
- mnemônica- mnemônica
 
Memória Memória 
– E para os usuários de computação?
– Quantidade de documentos criados?
– Imagens, vídeos, e-mails, URLs crescem a cada dia.
– O meio mais comum de codificá-los e pelo nome. Mais 
como lembrar de tantas informações especialmente se 
houver dezenas de milhares de arquivos.
– Como pode esse processo ser facilitado, levando em 
consideração as capacidades de memória das pessoas?
 
Memória Memória 
– Cenário
– Leia as sequencias a seguir e em seguida, sem olhar, 
tente lembrar do maior número possível de itens você 
consegue lembrar.
– 3, 12, 6, 20, 9, 4, 0, 1, 19, 8, 97, 13, 84
– gato, casa, papel, sorriso, pessoa, vermelho, sim, 
número, sombra, vassoura, chuva, rádio, um, moeda, 
jato
– t, k, s, y, r, q, x, p, a, z, l, b, m, e
– De quanto você lembrou corretamente em cada lista? Entre 5 e 9 
itens.
 
Memória Memória 
Envolve codificar e recuperar vários tipos de conhecimento que nos 
permitam agir de forma adequada
• Não nos lembramos de tudo –envolve filtragem e processamento 
– quanto mais prestamos atenção em algo, e o quanto mais aquilo é 
processado (pensado, comparado), mais chances de nos lembrarmos 
posteriormente.
• Contexto influencia nossa memória de forma importante; 
• Reconhecemos melhor do que lembramos
– vantagens de GUIs (graphical user interfaces) sobre interfaces 
baseadas em comandos
• Somos melhores em nos lembrar de dicas visuais (cores, 
imagens) do que de informações simbólicas (números, palavras)
 
Memória – O problema de 7Memória – O problema de 7±±22
A capacidade de memória de curto prazo é muito limitada 
• Teoria de George Miller (1956)
 – as pessoas podem se lembrar de 7±2 “pedaços de informação”
• unidades daquilo para o que a nossa atenção e cognição se dirige
 
Essateoria causou grande impacto em IHCEssa teoria causou grande impacto em IHC
 
• Muitos projetistas foram levados a acreditar nas seguintes 
recomendações, considerando util para o design da interação. 
 
O que fazem alguns projetistas...O que fazem alguns projetistas...
Apresentam interfaces com no máximo... .
– Somente 7 opções de um menu
– Apenas 7 ícones numa barra de ferramentas
– Nunca faça uma lista com mais de 7 marcadores
– Coloque somente 7 botões no topo de uma págima web
– Coloque somente 7 itens nas opções de um menu
• Mas isto é errado? Por quê
 
Por quê?Por quê?
Aplicação inadequada da teoria;Aplicação inadequada da teoria;
Itens projetados podem ser vistos e revistos e não precisam ser recuperados 
pela memória de curto prazo;
Não aparecem na tela e depois desaparecem, exigindo que o usuário lembre 
dele antes de decidir qual selecionar;
O que se exige do usuários não é lembrar o máximo possível de itens, 
apenas ouvindo ou vendo uma sequencia, mais olharolhar para um conjunto 
deles e reconhecerreconhecer o que se quer.
Algumas vezes um número pequeno de itens é um exemplo de um 
bom design – depende da tarefa e da disponibilidade de espaço da 
tela
 
Memória – Implicações para o DsignMemória – Implicações para o Dsign
Não sobrecarregue a memória dos usuários
– evite procedimentos complicados para realizar tarefas
• Promova o reconhecimento em vez de lembrança 
– utilize menus, ícones, e objetos (posicionados de forma 
Consistente)
– ofereça aos usuários diversas formas de codificar e 
armazenar informação eletrônica
• e.g. arquivos, mensagens e imagens, identificados por cores, 
marcadores, carimbos de tempo, ícones etc
 
Memória – Implicações para o DsignMemória – Implicações para o Dsign
Não sobrecarregue a memória dos usuários
– evite procedimentos complicados para realizar tarefas
• Promova o reconhecimento em vez de lembrança 
– utilize menus, ícones, e objetos (posicionados de forma 
Consistente)
– ofereça aos usuários diversas formas de codificar e 
armazenar informação eletrônica
• e.g. arquivos, mensagens e imagens, identificados por cores, 
marcadores, carimbos de tempo, ícones etc
 
AprendizadoAprendizado
muitas pessoas têm dificuldade de aprender um conjunto de 
instruções num manual -preferem “aprender fazendo” 
– GUIs e interfaces de manipulação direta apoiam exploração, 
permitem desfazer (“undo”) ações;
– restringir funções possíveis que podem ser realizadas pelo 
aprendiz, ao nível mais básico e estender esse conjunto na medida 
em que o novato se torna experiente;
– ajuda contextualizada ( entendimento dos tópicos)
– uso de multimídia interativa para usuários explorarem ideias 
e conceitos de diferentes formas Aprendizado
 
Aprendizado – implicações do designAprendizado – implicações do design
• Projete interfaces que motivem a exploração
– ações facilmente reversíveis (undo)
• Projete interfaces que restrinjam e guiem os usuários a 
selecionarem ações mais adequadas 
– assistentes (wizards)
• Ofereça instruções contextualizadas e em diferentes mídias
 
Ler, falar e ouvirLer, falar e ouvir
• formas diferentes de processar a linguagem
• semelhanças: o significado das sentenças
Ex.:”Computadores são uma invenção maravilhosa”. 
• diferenças: facilidade de processamento e preferências 
– A linguagem escrita é permanente e a falada é transitória;
– Algumas pessoas preferem ler a ouvir, outras não 
– Algumas pessoas preferem falar a escrever, outras não
– Pessoas com dificuldades de audição ou visão têm restrições 
sobre como processam a linguagem.
 
Ler, falar e ouvir – implicações de designLer, falar e ouvir – implicações de design
• Mantenha o comprimento de menus de voz reduzido 
– Pessoas têm dificuldade de acompanhar menus de voz com 
mais de 3 ou 4 opções, e não se lembram de instruções que 
tenham muitas partes;
• Acentue a entonação de vozes geradas artificialmente, pois são 
mais difíceis de entender que vozes humanas 
• Ofereça oportunidades de tornar o texto maior numa tela, sem 
afetar a formatação, para as pessoas que não conseguem ler 
textos em letras pequenas.
 
Raciocinar, planejar e tomar decisãoRaciocinar, planejar e tomar decisão
• resolver problemas, planejar, raciocinar e decidir são processos 
que envolvem a cognição reflexiva 
– pensar sobre o que fazer e quais são as opções, comparar as 
opções, pensar nas conseqüências de realizar uma ação, decidir
• envolvem processos conscientes, discussão com os outros, e o 
uso de diversos artefatos (e.g. mapas, livros, papel e lápis)
– explorar diferentes cenários e decidir qual é a melhor opção ou 
solução para um problema
– comparar diferentes fontes de informação (para adquirir 
conhecimento sobre prós e contras) 
 
Raciocinar, planejar e decidir implicação do designRaciocinar, planejar e decidir implicação do design
• novatos vs. especialistas (experientes) novatos vs. especialistas (experientes) 
– novatos tendem a agir na “tentativa-e-erro”, explorando e 
experimentando, agindo "irracionalmente"
– especialistas são capazes de selecionar estratégias otimizadas para 
realizar suas tarefas; podem planejar com antecedência, considerar as 
conseqüências antes de optar por uma solução Particular.
• Como ajudar a um novato se tornar especialista? Como ajudar a um novato se tornar especialista? 
– Forneça informações e opções adicionais (inicialmente 
ocultas, mas que sejam fáceis de acessar) para os usuários que 
quiserem saber mais sobre como realizar uma atividade de 
forma mais eficiente (e.g. busca na web)
 
Pontos importantesPontos importantes
• Cognição envolve muitos processos, atenção, memória, 
percepção e aprendizado. 
• A forma como uma interface é projetada pode afetar muito o 
quanto os usuários conseguem perceber, focar, aprender e se 
lembrar sobre como realizar suas tarefas.
 
Referências
PREECE, J.; Rogers, Y. E Sharp, H. (2005). Design de Interação. 
Além da Interação Homem Computador. Porto Alegre: Bokkman, 
2005. 
NIELSEN, Jacob. Usabilidade na Web - Projetando Websites com 
Qualidade. Campus 
Material adaptado dos professores 
Clarisse:
http://www.inf.puc-rio.br/~inf1403/index.php?option=com_content&view=article&id=50%3Aprograma-2013-1-clarisse&catid=2%3Amaterial-clarisse&Itemid=58#Ma
Lucas Lattari
	Slide 1
	Slide 2
	Slide 3
	Slide 4
	Slide 5
	Slide 6
	Slide 7
	Slide 8
	Slide 9
	Slide 10
	Slide 11
	Slide 12
	Slide 13
	Slide 14
	Slide 15
	Slide 16
	Slide 17
	Slide 18
	Slide 19
	Slide 20
	Slide 21
	Slide 22
	Slide 23
	Slide 24
	Slide 25
	Slide 26
	Slide 27
	Slide 28
	Slide 29
	Slide 30
	Slide 31
	Slide 32
	Slide 33
	Slide 34
	Slide 35
	Slide 36
	Slide 37