Fundamentos de Fatores Humanos
em IHC:
Introdução e Percepção Visual
Prof. André Constantino da Silva
IHC
Baseado nos slides da
Prof. Dr. Heloísa Vieira da Rocha
Overture...
 Pet Shop Boys - Invisible
 https://www.youtube.com/watch?v=n609XaagVJo
…
I'm here but you can't see me
I'm invisible
It's queer how gradually
I've become invisible
Look at me the absentee
Disappearing finally
Goodbye
Is it magic or the truth?
Strange psychology?
…
• estudaremos as capacidades físicas e
cognitivas do Humano, como fatores que
influenciam o design de interfaces de
sistemas computacionais.
Objetivo das Aulas
• A interação com a tecnologia é cognitiva
– Necessitamos levar em consideração os processos
cognitivos envolvidos e as limitações cognitivas dos
usuários
• Podemos prover conhecimento sobre o que
pode, ou não, ser esperado dos usuários
• Identificar e explicar a natureza e causas dos
problemas encontrados pelos usuários
• Suprir com teorias, ferramentas de modelagem,
guias e métodos que possam conduzir a projetos
de melhores produtos interativos
Por que precisamos compreender os
usuários?
• Aspectos Cognitivos Centrais
• Modelo de Processador Humano
• Engenharia Cognitiva
– Golfo de Avaliação e Golfo de Avaliação
– O modelo GOMS
– Modelos Mentais
– Metáforas em interfaces
Conteúdo
• Percepcão e reconhecimento
• Atenção
• Memória
Usados para:
• Ler, falar e ouvir
• Resolver problemas, planejar, raciocinar e tomar
decisões, aprender
Aspectos Cognitivos Centrais
• “Refere-se a como a informação é assimilada do
ambiente pelos diferentes órgãos sensitivos –
olhos, ouvidos, dedos – e transformada em
experiências com objetos, eventos, sons e
gestos” (Roth, 1986)
• Processo complexo que envolve outros processos
cognitivos, como a memória, a atenção e a
linguagem
Percepção
Descreva o que você vê na figura?
É real?
Dê um rótulo para a figura?
Descreva o que você vê na figura?
É real?
Dê um rótulo para a figura?
Sua descrição desta figura usa um ...... e ou usa um ..... ou
ou seja, você consegue ver duas coisas ao mesmo tempo?
Marque o tempo em
que você diz a
palavras e compare
com o tempo com
que você diz as cores
• Como percebemos o mundo em nossa
volta?
Os Sentidos
• É a operação que leva ao cérebro
informações de fenômenos do meio
externo e do estado do organismo
• É por meio dela que os indivíduos se
relacionam com o ambiente
– Órgão de sentido
Sensação
• Exteroceptiva: permite o contato entre o
indivíduo e o meio externo por meio dos órgãos
dos sentidos
• Interoceptiva: permite ao cérebro tomar
conhecimento do que acontece nos órgãos
internos
– Exemplo: fome, calor, frio, desconforto
• Proprioceptiva: permite ao cérebro tomar
conhecimento do movimento corpóreo no
espaço e da sua posição em relação aos outros
– Exemplo: equilíbrio
Tipos de Sensação
• Estímulos muito tênues ou muito intensos
não são detectados
– Limiar da sensação
• Sensação é relativa: varia de acordo com o
ambiente, estado emocional, uso de
medicamentos, etc
Estímulos
• http://youtu.be/ywaovES97vI?list=PL4EDA0
1368AB3E59E
Vídeos Extras
• O usuário deve “perceber” a informação
apresentada na interface, através dos sinais
que a constituem.
• Como os sinais externos que chegam aos
órgãos sensoriais são convertidos em
experiências perceptuais significativas?
Mecanismos da Percepção Humana
Entendendo os mecanismos da
percepção
• Casamento de padrões?
– Esse processo simples não funciona se a letra
é apresentada com outra orientação ou com
tamanho variável.
– Um sistema mais poderoso e flexível é
necessário para dar conta da capacidade
humana de reconhecimento de padrões.
• Como a informação que chega a nossos
órgãos dos sentidos é interpretada?
Mecanismos da Percepção Humana
Degradando a imagem...
Foto de R.C.James
Colocando organizações competitivas...
M C Escher, Cavaleiros
Salvador Dalí, The Slave Market with
Disappearing Bust of Voltaire
Colocando uma organização sem sentido...
Processos
perceptuais
impõem
uma
organização
à imagem....
B. Riley, Tremor
Nosso aparato visual evolui em mundo 3D...
Atribuindo
profundidade
(e contexto)
à imagem
R. Magritte, Les Promenades d´Éuclide
Descreva a imagem
Compare a descrição com a
de um colega
Olhando para “figuras impossíveis”
Outra maneira
de mostrar a
operação que
fazemos ao
colocar
objetos em 3D
durante sua
interpretação
M C Escher, Moebius Strip
• http://youtu.be/sk0rPAGoJcs?t=32m9s
Assistir do 32:11 até 36:50
Tudo junto e misturado
Anomalias da Percepção
Células neurais
interagem umas
com as outras.
No único ponto
do olho onde os
receptores não
interagem muito
com os outros, o
escurecimento
da interseção
não acontece
• Construtivistas
– A informação que captamos é “construída”
envolve processos cognitivos
• Ecologistas
– A informação é “detectada” em um processo
direto
noção de affordance
Teorias da Percepção Humana
• percepção é um processo direto no qual a
informação é simplesmente detetada ao
invés de ser construída
• conceito central - affordance
– o que se vê como comportamento de um
sistema, objeto ou evento é o que é permitido
pelo sistema, objeto ou evento
Abordagem Ecológica
• Os objetos carregam certas características
que dirigem nossa percepção sobre eles...
Quais são os botões da figura?
• percepção envolve a intervenção de representações e
memórias
– o que se vê não é uma réplica do mundo como uma
fotografia
– o sistema visual constrói um modelo do mundo através de
transformações, acréscimos, distorções e descartando
informação
• a habilidade de perceber objetos em uma tela - textos,
gráficos, representações bi ou tri-dimensionais - é
resultado de nosso conhecimento anterior e
expectativas do que deveria aparecer
Abordagem Construtivista
• A implicação óbvia é projetar
representações que sejam facilmente
perceptíveis, exemplo:
– O texto deve ser legível
– Os ícones devem ser fáceis de se distiguir e ler
Percepção e Reconhecimento no
Design de Interfaces
Qual a frase mais fácil de ler? Por quê?
Perceber é muito mais que ver...
• A demanda por memorização e a carga cognitiva exigida pelas
interfaces de comandos, nas interfaces gráficas é deslocada
para o processamento perceptual e viso-motor
(Shame, 1999)
• Percepção é um processo ativo
• Existem duas teorias principais sobre percepção:
construtivista e ecológica
– A abordagem construtivista tem sido usada para
auxiliar no design de display de informações de
forma a torná-la rapidamente perceptível
– A abordagem ecológica tem sido usada para auxiliar
no design de objetos da interface – affordance
Percepção - Resumo
• https://www.youtube.com/watch?v=0_WL
OzUg8eA
• https://www.youtube.com/watch?v=l9x0irs
INXg
• https://www.youtube.com/watch?v=axEy4h
DmKOo
Vídeos - Extras
Percepção - Resumo
• Percepção é um processo ativo
• Existem duas teorias principais sobre percepção:
construtivista e ecológica
• A abordagem construtivista tem sido usada para
auxiliar no design de display de informações de
forma a torná-la rapidamente perceptível
• A abordagem ecológica tem sido usada para
auxiliar no design de objetos da interface –
affordance
• Em grupo, apresentar o problema e a explicação
– Cadeira de Beuchet
– Quarto de Ames
– Imagem biestável
– Arte anamórfica
– Paralaxe do movimento
– Autoestereograma
– Anáglifo
Trabalhos
• https://www.youtube.com/watch?v=FzeXeXR9cCs
Atenção
• Seleção de coisas para se concentrar dentre
várias ao nosso redor, em um dado momento
• Mecanismo que permite a fixação de alguns
estímulos e a organização das informações para o
processo de tomada de decisão
– Seletiva: foca em alguns e descarta os demais
– É influenciada pelas necessidades, motivações,
interesses, personalidade, cultura, objetivo, prazer,
medo…
Atenção
• atenção focada
– habilidade de concentrar em um determinado
evento quando existe uma série de eventos
competindo
• o que é relevante as atividades e intenções que se tem no
momento
• atenção dividida
– quando se tenta atender a mais de uma
demanda ao mesmo tempo
• ex.: dirigir e conversar com um passageiro ao lado
Atenção dividida e focada
• A atenção focalizada e dividida nos permite ser
seletivos apesar da grande quantidade de
estímulos competindo, no entanto limita nossa
capacidade de perceber todos os outros eventos
Atenção Focada e Dividida
• As informações de uma interface devem ser
estruturadas para capturar a atenção do usuário,
por exemplo usando fronteiras perceptíveis
(windows), cor, vídeo reverso, som e luzes
piscantes
Focando atenção em uma Interface
Um exemplo de uso excessivo de
gráficos
• Como dirigir a atenção do usuário para a
informação relevante no display?
– Estruturando a interface
• torná-la fácil de ser navegada
• apresentar informação na medida certa: nem muita e nem
pouca
• agrupar e ordenar a informação em partes significativas
– Outras técnicas
• cores
• técnicas de alerta: vídeo reverso, som etc
• janelas
Focando atenção em uma Interface
• executar uma série de tarefas alternadamente
durante um mesmo período de tempo
• tarefas primárias e secundárias
• como saber de onde recomeçar
– ajudas cognitivas
• sistemas devem ser projetados para
sitematicamente prover informação sobre o
status de uma determinada atividade
– p. ex: ainda não salvou arquivo …..
Multi-tarefas e Interrupções
• Salientar a informação, quando esta necessitar de
atenção
• Utilizar técnicas que façam com que coisas se
destaquem, como: cor, disposição, espaçamento,
sublinhado, ordenação e animação.
• Evitar sobrecarregar a interface
– Exemplo: Google, possui um design simples e rápido
• Evitar usar muitos recursos só porque o software
permite implementá-los
Implicações da atenção no projeto de
interfaces
• Envolve codificar e recordar o conhecimento e agir
apropriadamente
• Nós não lembramos de tudo
– filtragem e processamento
• O contexto é importante para nossa memória
• Nossa capacidade de identificar coisas é muito maior do
que a de lembrar coisas
– O aumento do uso de interfaces GUI baseadas em comando
(Graphical User Interface)
• É mais fácil lembrar de imagens do que de palavras
– O uso de ícones ao invés de nomes
Memória
• Memória de
Informação
Sensorial
• Memória de Curta
Duração
• Memória de Longa
Duração
As Bases Neurais da Memória Humana
• Memória de Informação Sensorial
– “fotografia do mundo”, como ele é recebido pelos
nossos órgãos dos sentidos
• Memória de Curta Duração
– A informação retida não é mais a imagem
completa de eventos, mas a interpretação
imediata deles
• Memória de Longa Duração
– 10 bilhões de neurônios capazes de armazenar
informações...
Qual foi o cardápio do seu jantar de sábado?
Atividades correntes de pensamento, processos de
consciência e memórias imediatas são mediados por
atividades elétricas
Mudanças estruturais e químicas devem ocorrer como resultado da
aquisição de novo conhecimento
• Memória de Curta Duração  ativação elétrica de um
loop neural específico
• Memória de Longa Duração  estrutura permanente de
circuitos neurais, que acontece através do processo de
consolidação:
– Codificação química na estrutura de moléculas de proteína em
cada sinapse
– Crescimento de novas junções sinápticas
Memória e Soluções de Interfaces
Memória e Soluções de Interfaces
Memória e Soluções de Interfaces
• Memória está envolvida em todas as nossas
atividades (da mesma forma que percepção e
atenção)
– sem memória não conseguiríamos escovar os dentes
• sistema humano de memória é muito versátil
– ele pode armazenar procedimentos, dados
sensoriais, relações, sentimentos, experiências etc
– não é infalível
Restrições de Memória
• a extensão de quanto é relembrado depende do
quanto é significativo
– teoria do nível de processamento
– é a profundidade que uma informação é processada
que determina a facilidade com que é relembrada (
o som de uma palavra ----> o significado de uma
palavra)
– familiaridade e associação de imagens ( ex.: o
quanto uma palavra é familiar e o quanto ela tem
uma imagem associada)
Restrições de Memória
• Conhecimento no mundo X conhecimento na
cabeça
• Reconhecer é muito mais efetivo que lembrar
– reduzir na interface o número de componentes
que tem que ser lembrados
• Um expert é perito em lembrar onde encontrar
informação no mundo externo
– colocar informação do mundo na interface
Reconhecimento X Lembrança
O chunk
• Função do usuário e da tarefa...
=ativação de sua MLD
HSICAUIMPW
IHCUSAWIMP
Se você tivesse que repetir as letras das duas “palavras” acima qual seria mais fácil?
Por que?
Recuperação da Informação na memória humana...
• umcd = 7 [5~9] chunks
• Lembrando palavras de uma lista...
Ganzer e Cunitz (1966)
• A Teoria de George Miller de quanta
informação as pessoas podem lembrar
• A memória imediata das pessoas é muito
limitada
• Muitos projetistas foram conduzidos a
acreditar que esta é uma descoberta útil ao
design da interação
O problema clássico do ‘72’
• Apresentar apenas 7 opções em um menu
• Exibir apenas 7 ícones em uma barra de ferramenta
• Ter no máximo 7 bullets em uma lista
• Colocar apenas 7 itens em um menu pull down
• Colocar apenas 7 tabs no topo de uma página web
Mas isto é errado? Por quê?
O quê alguns projetistas acreditam …
• Aplicação imprópria da teoria
• Pessoas podem varrer listas de bullets, tabs, itens de
menu até que vejam o que querem
• Eles não têm que lembrar no momento em que os ouve
ou vê
• Às vezes, um pequeno número de itens é um bom
design
• Mas depende da tarefa e da disponibilidade da tela
Por quê?
• Cognição é o ato ou processo da aquisição
do conhecimento que se dá através da
percepção, da atenção, memória,
raciocínio, juízo, imaginação, pensamento e
linguagem
• é também um mecanismo de conversão do
que é captado para o nosso modo de ser
interno
Cognição
• https://www.youtube.com/watch?v=XZEW
0Qw_XTQ
Vídeos Complementares
• Com que facilidade palavras da linguagem
de interface podem ser lembradas?
• Como o tipo de fonte altera a legibilidade?
• Qual a velocidade de leitura na tela?
• Card, Moran e Newell (1983)
– Como características do ser humano afetam a maneira como
ele interage com computadores
– Bases para as abordagens cognitivas ao design e avaliação de
sistemas computacionais
Um Modelo do Usuário de Computadores
• Memórias e Processadores
• Princípios de Operação
O Modelo do Processador de
Informação Humano
PP
PC
PM
MLD
MCD/MT
MIAMIV
• Sistema Perceptual
– Guarda saída dos sistemas sensoriais
• Sensores e buffers associados: MIV, MIA
• Sistema Cognitivo
– Usa informação da MCD e da MLD para tomada de decisão
• Sistema Motor
– Viabiliza resposta do Sistema Cognitivo
Princípio básico: ciclo Reconhece-Age do Processador
Cognitivo
O MPIH
PP
PC
PM
MLD
MCD/MT
MIAMIV
O Sistema Perceptual
• Transporta sensações do mundo físico
detectadas por sistemas sensoriais do
corpo e as transforma em
representações internas
– Ex. Sistema Visual
O Sistema Motor
• Após processamento perceptual e cognitivo,
pensamento é traduzido em ação pela ativação de
padrões de músculos arranjados em sequência
– Ex. sistema braço- mão- dedo
• O movimento não é contínuo, mas uma série de
micromovimentos discretos, cada um requerendo
tm = 70 [30~100] ms
• Nas tarefas mais simples, o SC serve para conectar
entradas do SP para saídas corretas do SM
• Maioria das tarefas envolve de forma complexa:
– Aprendizado, recuperação de fatos, resolução de problemas
• Memórias Associadas:
– Memória de Curta Duração (ou Memória de Trabalho)
– Memória de Longa Duração
O Sistema Cognitivo
Modelos Mentais
Modelos Mentais
• Craik (1943) descreveu modelos mentais como
construções internas de algum aspecto do
mundo externo que permitem predizer o que
fazer
• Envolvem processos inconscientes e
conscientes, onde imagens e analogias são
ativadas
Aprofundamento versus modelos superficiais (ex.
como dirigir um carro e como ele funciona)
• Interagindo com o ambiente, com outros, com artefatos
tecnológicos, as pessoas constroem MMs das coisas com as quais
interagem
• Concepções espontâneas de fenômenos físicos são MMs que as
pessoas criam para explicar fenômenos da natureza...
• Os MMs são incompletos, imprecisos, inconsistentes,
idiossincráticos...
• Nossa habilidade para executar MMs é limitada pelos
mecanismos perceptuais e cognitivos
Modelos Mentais
Modelos Mentais
• Os usuários desenvolvem uma compreensão de um
sistema através do seu estudo e de seu uso
• O conhecimento é frequentemente descrito como um
modelo
– Como usar o sistema (o que fazer depois)
– O que fazer diante de sistemas não familiares ou em
situações inesperadas (como os sistemas funcionam)
• As pessoas fazem inferências utilizando modelos
mentais de como realizar tarefas
Raciocínio diário & modelos mentais
Você chega em casa em uma noite fria de inverno e sua casa não está
aquecida. Como aquecê-la o mais rápido possível?
Ligando o termostato no máximo ou na temperatura desejável?
Você chega em casa morrendo de fome. Olha no refrigerador e tudo que
encontra é uma pizza não cozida. Você tem um forno elétrico.
Você primeiro o esquenta até 375 graus antes de colocar a pizza (como
especificado nas instruções) ou gira o fogão acima do máximo
especificado para tentar que ele aqueça o mais rapidamente possível?
Aquecimento de uma sala ou fogão controlados
por um termostato
• Muitas pessoas possuem modelos mentais não
corretos (Kempton, 1996)
• Por quê?
– Na teoria geral de válvulas, o princípio “more is
more” é generalizado para diferentes ambientes
• ex.: fogão a gás, torneira, volume do rádio
– Mas...
Os termostatos funcionam baseados no modelo de
interruptor on-off
Aquecimento de uma sala ou fogão controlados
por um termostato
• O mesmo é frequentemente verdade para
entender como os dispositivos interativos e
os computadores funcionam:
– Pobremente, frequentemente incompletos,
facilmente confusos, baseados em analogias
inapropriadase superstições (Norman,1983)
• ex.: cursor/tela congelada - a maioria das pessoas irão
pressionar todas as teclas possíveis
• Como designers devemos desenvolver interfaces que ajudem o
usuário a construir MMs adequados à sua interação com o
sistema
=> poder de predição e explicação necessários para condução da
interação
Porque Modelos Mentais?
Modelo
do
Designer
Modelo
do
Usuário
• Noções de modelos mentais têm sido usadas como base para
modelos conceituais (conceptual models)
• A hipótese é que se você pode entender como as pessoas
desenvolvem os modelos mentais então pode ajudá-las a
desenvolver mais apropriadamente os modelos mentais da
funcionalidade do sistema
• Por exemplo, um princípio de projeto é tentar fazer sistemas
transparentes para que as pessoas possam entendê-los mais,
sabendo o que fazer
Modelos mentais & projeto de sistemas
O princípio da transparência
• Feedback útil
• Fácil de entender
• Uso intuitivo
• Claro & fácil de seguir as instruções
• Ajuda online apropriada
• Guia sensitivo ao contexto de
como proceder quando errar
NÃO entender de forma literal!
Pontos Chaves
• Cognição envolve muitos processos incluindo atenção,
memória, percepção e aprendizado
• Como a interface foi projetada pode afetar enormemente
quão bem os usuários podem entender, aprender e lembrar
como realizar suas tarefas
• A estrutura conceitual dos “modelos mentais” e “cognição
externa” proveêm maneiras de entender como e porque
pessoas interagem com produtos, o que pode nos levar a
refletir sobre como é possível melhorar os projetos

Aula 3 - Fatores Humanos

  • 1.
    Fundamentos de FatoresHumanos em IHC: Introdução e Percepção Visual Prof. André Constantino da Silva IHC Baseado nos slides da Prof. Dr. Heloísa Vieira da Rocha
  • 2.
    Overture...  Pet ShopBoys - Invisible  https://www.youtube.com/watch?v=n609XaagVJo … I'm here but you can't see me I'm invisible It's queer how gradually I've become invisible Look at me the absentee Disappearing finally Goodbye Is it magic or the truth? Strange psychology? …
  • 3.
    • estudaremos ascapacidades físicas e cognitivas do Humano, como fatores que influenciam o design de interfaces de sistemas computacionais. Objetivo das Aulas
  • 4.
    • A interaçãocom a tecnologia é cognitiva – Necessitamos levar em consideração os processos cognitivos envolvidos e as limitações cognitivas dos usuários • Podemos prover conhecimento sobre o que pode, ou não, ser esperado dos usuários • Identificar e explicar a natureza e causas dos problemas encontrados pelos usuários • Suprir com teorias, ferramentas de modelagem, guias e métodos que possam conduzir a projetos de melhores produtos interativos Por que precisamos compreender os usuários?
  • 5.
    • Aspectos CognitivosCentrais • Modelo de Processador Humano • Engenharia Cognitiva – Golfo de Avaliação e Golfo de Avaliação – O modelo GOMS – Modelos Mentais – Metáforas em interfaces Conteúdo
  • 6.
    • Percepcão ereconhecimento • Atenção • Memória Usados para: • Ler, falar e ouvir • Resolver problemas, planejar, raciocinar e tomar decisões, aprender Aspectos Cognitivos Centrais
  • 7.
    • “Refere-se acomo a informação é assimilada do ambiente pelos diferentes órgãos sensitivos – olhos, ouvidos, dedos – e transformada em experiências com objetos, eventos, sons e gestos” (Roth, 1986) • Processo complexo que envolve outros processos cognitivos, como a memória, a atenção e a linguagem Percepção
  • 8.
    Descreva o quevocê vê na figura? É real? Dê um rótulo para a figura?
  • 9.
    Descreva o quevocê vê na figura? É real? Dê um rótulo para a figura?
  • 10.
    Sua descrição destafigura usa um ...... e ou usa um ..... ou ou seja, você consegue ver duas coisas ao mesmo tempo?
  • 11.
    Marque o tempoem que você diz a palavras e compare com o tempo com que você diz as cores
  • 12.
    • Como percebemoso mundo em nossa volta? Os Sentidos
  • 16.
    • É aoperação que leva ao cérebro informações de fenômenos do meio externo e do estado do organismo • É por meio dela que os indivíduos se relacionam com o ambiente – Órgão de sentido Sensação
  • 17.
    • Exteroceptiva: permiteo contato entre o indivíduo e o meio externo por meio dos órgãos dos sentidos • Interoceptiva: permite ao cérebro tomar conhecimento do que acontece nos órgãos internos – Exemplo: fome, calor, frio, desconforto • Proprioceptiva: permite ao cérebro tomar conhecimento do movimento corpóreo no espaço e da sua posição em relação aos outros – Exemplo: equilíbrio Tipos de Sensação
  • 18.
    • Estímulos muitotênues ou muito intensos não são detectados – Limiar da sensação • Sensação é relativa: varia de acordo com o ambiente, estado emocional, uso de medicamentos, etc Estímulos
  • 19.
  • 21.
    • O usuáriodeve “perceber” a informação apresentada na interface, através dos sinais que a constituem. • Como os sinais externos que chegam aos órgãos sensoriais são convertidos em experiências perceptuais significativas? Mecanismos da Percepção Humana
  • 22.
  • 23.
    • Casamento depadrões? – Esse processo simples não funciona se a letra é apresentada com outra orientação ou com tamanho variável. – Um sistema mais poderoso e flexível é necessário para dar conta da capacidade humana de reconhecimento de padrões. • Como a informação que chega a nossos órgãos dos sentidos é interpretada? Mecanismos da Percepção Humana
  • 24.
  • 25.
  • 26.
    Salvador Dalí, TheSlave Market with Disappearing Bust of Voltaire
  • 28.
    Colocando uma organizaçãosem sentido... Processos perceptuais impõem uma organização à imagem.... B. Riley, Tremor
  • 29.
    Nosso aparato visualevolui em mundo 3D... Atribuindo profundidade (e contexto) à imagem R. Magritte, Les Promenades d´Éuclide Descreva a imagem Compare a descrição com a de um colega
  • 30.
    Olhando para “figurasimpossíveis” Outra maneira de mostrar a operação que fazemos ao colocar objetos em 3D durante sua interpretação M C Escher, Moebius Strip
  • 32.
    • http://youtu.be/sk0rPAGoJcs?t=32m9s Assistir do32:11 até 36:50 Tudo junto e misturado
  • 33.
    Anomalias da Percepção Célulasneurais interagem umas com as outras. No único ponto do olho onde os receptores não interagem muito com os outros, o escurecimento da interseção não acontece
  • 34.
    • Construtivistas – Ainformação que captamos é “construída” envolve processos cognitivos • Ecologistas – A informação é “detectada” em um processo direto noção de affordance Teorias da Percepção Humana
  • 35.
    • percepção éum processo direto no qual a informação é simplesmente detetada ao invés de ser construída • conceito central - affordance – o que se vê como comportamento de um sistema, objeto ou evento é o que é permitido pelo sistema, objeto ou evento Abordagem Ecológica
  • 36.
    • Os objetoscarregam certas características que dirigem nossa percepção sobre eles... Quais são os botões da figura?
  • 37.
    • percepção envolvea intervenção de representações e memórias – o que se vê não é uma réplica do mundo como uma fotografia – o sistema visual constrói um modelo do mundo através de transformações, acréscimos, distorções e descartando informação • a habilidade de perceber objetos em uma tela - textos, gráficos, representações bi ou tri-dimensionais - é resultado de nosso conhecimento anterior e expectativas do que deveria aparecer Abordagem Construtivista
  • 38.
    • A implicaçãoóbvia é projetar representações que sejam facilmente perceptíveis, exemplo: – O texto deve ser legível – Os ícones devem ser fáceis de se distiguir e ler Percepção e Reconhecimento no Design de Interfaces
  • 39.
    Qual a frasemais fácil de ler? Por quê?
  • 40.
    Perceber é muitomais que ver... • A demanda por memorização e a carga cognitiva exigida pelas interfaces de comandos, nas interfaces gráficas é deslocada para o processamento perceptual e viso-motor (Shame, 1999)
  • 41.
    • Percepção éum processo ativo • Existem duas teorias principais sobre percepção: construtivista e ecológica – A abordagem construtivista tem sido usada para auxiliar no design de display de informações de forma a torná-la rapidamente perceptível – A abordagem ecológica tem sido usada para auxiliar no design de objetos da interface – affordance Percepção - Resumo
  • 42.
  • 43.
    Percepção - Resumo •Percepção é um processo ativo • Existem duas teorias principais sobre percepção: construtivista e ecológica • A abordagem construtivista tem sido usada para auxiliar no design de display de informações de forma a torná-la rapidamente perceptível • A abordagem ecológica tem sido usada para auxiliar no design de objetos da interface – affordance
  • 44.
    • Em grupo,apresentar o problema e a explicação – Cadeira de Beuchet – Quarto de Ames – Imagem biestável – Arte anamórfica – Paralaxe do movimento – Autoestereograma – Anáglifo Trabalhos
  • 45.
  • 46.
    • Seleção decoisas para se concentrar dentre várias ao nosso redor, em um dado momento • Mecanismo que permite a fixação de alguns estímulos e a organização das informações para o processo de tomada de decisão – Seletiva: foca em alguns e descarta os demais – É influenciada pelas necessidades, motivações, interesses, personalidade, cultura, objetivo, prazer, medo… Atenção
  • 47.
    • atenção focada –habilidade de concentrar em um determinado evento quando existe uma série de eventos competindo • o que é relevante as atividades e intenções que se tem no momento • atenção dividida – quando se tenta atender a mais de uma demanda ao mesmo tempo • ex.: dirigir e conversar com um passageiro ao lado Atenção dividida e focada
  • 48.
    • A atençãofocalizada e dividida nos permite ser seletivos apesar da grande quantidade de estímulos competindo, no entanto limita nossa capacidade de perceber todos os outros eventos Atenção Focada e Dividida
  • 49.
    • As informaçõesde uma interface devem ser estruturadas para capturar a atenção do usuário, por exemplo usando fronteiras perceptíveis (windows), cor, vídeo reverso, som e luzes piscantes Focando atenção em uma Interface
  • 50.
    Um exemplo deuso excessivo de gráficos
  • 51.
    • Como dirigira atenção do usuário para a informação relevante no display? – Estruturando a interface • torná-la fácil de ser navegada • apresentar informação na medida certa: nem muita e nem pouca • agrupar e ordenar a informação em partes significativas – Outras técnicas • cores • técnicas de alerta: vídeo reverso, som etc • janelas Focando atenção em uma Interface
  • 52.
    • executar umasérie de tarefas alternadamente durante um mesmo período de tempo • tarefas primárias e secundárias • como saber de onde recomeçar – ajudas cognitivas • sistemas devem ser projetados para sitematicamente prover informação sobre o status de uma determinada atividade – p. ex: ainda não salvou arquivo ….. Multi-tarefas e Interrupções
  • 53.
    • Salientar ainformação, quando esta necessitar de atenção • Utilizar técnicas que façam com que coisas se destaquem, como: cor, disposição, espaçamento, sublinhado, ordenação e animação. • Evitar sobrecarregar a interface – Exemplo: Google, possui um design simples e rápido • Evitar usar muitos recursos só porque o software permite implementá-los Implicações da atenção no projeto de interfaces
  • 54.
    • Envolve codificare recordar o conhecimento e agir apropriadamente • Nós não lembramos de tudo – filtragem e processamento • O contexto é importante para nossa memória • Nossa capacidade de identificar coisas é muito maior do que a de lembrar coisas – O aumento do uso de interfaces GUI baseadas em comando (Graphical User Interface) • É mais fácil lembrar de imagens do que de palavras – O uso de ícones ao invés de nomes Memória
  • 55.
    • Memória de Informação Sensorial •Memória de Curta Duração • Memória de Longa Duração As Bases Neurais da Memória Humana
  • 56.
    • Memória deInformação Sensorial – “fotografia do mundo”, como ele é recebido pelos nossos órgãos dos sentidos • Memória de Curta Duração – A informação retida não é mais a imagem completa de eventos, mas a interpretação imediata deles • Memória de Longa Duração – 10 bilhões de neurônios capazes de armazenar informações... Qual foi o cardápio do seu jantar de sábado?
  • 57.
    Atividades correntes depensamento, processos de consciência e memórias imediatas são mediados por atividades elétricas
  • 58.
    Mudanças estruturais equímicas devem ocorrer como resultado da aquisição de novo conhecimento • Memória de Curta Duração  ativação elétrica de um loop neural específico • Memória de Longa Duração  estrutura permanente de circuitos neurais, que acontece através do processo de consolidação: – Codificação química na estrutura de moléculas de proteína em cada sinapse – Crescimento de novas junções sinápticas
  • 59.
    Memória e Soluçõesde Interfaces
  • 60.
    Memória e Soluçõesde Interfaces
  • 61.
    Memória e Soluçõesde Interfaces
  • 62.
    • Memória estáenvolvida em todas as nossas atividades (da mesma forma que percepção e atenção) – sem memória não conseguiríamos escovar os dentes • sistema humano de memória é muito versátil – ele pode armazenar procedimentos, dados sensoriais, relações, sentimentos, experiências etc – não é infalível Restrições de Memória
  • 63.
    • a extensãode quanto é relembrado depende do quanto é significativo – teoria do nível de processamento – é a profundidade que uma informação é processada que determina a facilidade com que é relembrada ( o som de uma palavra ----> o significado de uma palavra) – familiaridade e associação de imagens ( ex.: o quanto uma palavra é familiar e o quanto ela tem uma imagem associada) Restrições de Memória
  • 64.
    • Conhecimento nomundo X conhecimento na cabeça • Reconhecer é muito mais efetivo que lembrar – reduzir na interface o número de componentes que tem que ser lembrados • Um expert é perito em lembrar onde encontrar informação no mundo externo – colocar informação do mundo na interface Reconhecimento X Lembrança
  • 65.
    O chunk • Funçãodo usuário e da tarefa... =ativação de sua MLD HSICAUIMPW IHCUSAWIMP Se você tivesse que repetir as letras das duas “palavras” acima qual seria mais fácil? Por que?
  • 66.
    Recuperação da Informaçãona memória humana... • umcd = 7 [5~9] chunks • Lembrando palavras de uma lista... Ganzer e Cunitz (1966)
  • 67.
    • A Teoriade George Miller de quanta informação as pessoas podem lembrar • A memória imediata das pessoas é muito limitada • Muitos projetistas foram conduzidos a acreditar que esta é uma descoberta útil ao design da interação O problema clássico do ‘72’
  • 68.
    • Apresentar apenas7 opções em um menu • Exibir apenas 7 ícones em uma barra de ferramenta • Ter no máximo 7 bullets em uma lista • Colocar apenas 7 itens em um menu pull down • Colocar apenas 7 tabs no topo de uma página web Mas isto é errado? Por quê? O quê alguns projetistas acreditam …
  • 69.
    • Aplicação imprópriada teoria • Pessoas podem varrer listas de bullets, tabs, itens de menu até que vejam o que querem • Eles não têm que lembrar no momento em que os ouve ou vê • Às vezes, um pequeno número de itens é um bom design • Mas depende da tarefa e da disponibilidade da tela Por quê?
  • 70.
    • Cognição éo ato ou processo da aquisição do conhecimento que se dá através da percepção, da atenção, memória, raciocínio, juízo, imaginação, pensamento e linguagem • é também um mecanismo de conversão do que é captado para o nosso modo de ser interno Cognição
  • 71.
  • 72.
    • Com quefacilidade palavras da linguagem de interface podem ser lembradas? • Como o tipo de fonte altera a legibilidade? • Qual a velocidade de leitura na tela? • Card, Moran e Newell (1983) – Como características do ser humano afetam a maneira como ele interage com computadores – Bases para as abordagens cognitivas ao design e avaliação de sistemas computacionais Um Modelo do Usuário de Computadores
  • 73.
    • Memórias eProcessadores • Princípios de Operação O Modelo do Processador de Informação Humano PP PC PM MLD MCD/MT MIAMIV
  • 74.
    • Sistema Perceptual –Guarda saída dos sistemas sensoriais • Sensores e buffers associados: MIV, MIA • Sistema Cognitivo – Usa informação da MCD e da MLD para tomada de decisão • Sistema Motor – Viabiliza resposta do Sistema Cognitivo Princípio básico: ciclo Reconhece-Age do Processador Cognitivo O MPIH PP PC PM MLD MCD/MT MIAMIV
  • 75.
    O Sistema Perceptual •Transporta sensações do mundo físico detectadas por sistemas sensoriais do corpo e as transforma em representações internas – Ex. Sistema Visual
  • 76.
    O Sistema Motor •Após processamento perceptual e cognitivo, pensamento é traduzido em ação pela ativação de padrões de músculos arranjados em sequência – Ex. sistema braço- mão- dedo • O movimento não é contínuo, mas uma série de micromovimentos discretos, cada um requerendo tm = 70 [30~100] ms
  • 77.
    • Nas tarefasmais simples, o SC serve para conectar entradas do SP para saídas corretas do SM • Maioria das tarefas envolve de forma complexa: – Aprendizado, recuperação de fatos, resolução de problemas • Memórias Associadas: – Memória de Curta Duração (ou Memória de Trabalho) – Memória de Longa Duração O Sistema Cognitivo
  • 78.
  • 79.
    Modelos Mentais • Craik(1943) descreveu modelos mentais como construções internas de algum aspecto do mundo externo que permitem predizer o que fazer • Envolvem processos inconscientes e conscientes, onde imagens e analogias são ativadas Aprofundamento versus modelos superficiais (ex. como dirigir um carro e como ele funciona)
  • 80.
    • Interagindo como ambiente, com outros, com artefatos tecnológicos, as pessoas constroem MMs das coisas com as quais interagem • Concepções espontâneas de fenômenos físicos são MMs que as pessoas criam para explicar fenômenos da natureza... • Os MMs são incompletos, imprecisos, inconsistentes, idiossincráticos... • Nossa habilidade para executar MMs é limitada pelos mecanismos perceptuais e cognitivos Modelos Mentais
  • 81.
    Modelos Mentais • Osusuários desenvolvem uma compreensão de um sistema através do seu estudo e de seu uso • O conhecimento é frequentemente descrito como um modelo – Como usar o sistema (o que fazer depois) – O que fazer diante de sistemas não familiares ou em situações inesperadas (como os sistemas funcionam) • As pessoas fazem inferências utilizando modelos mentais de como realizar tarefas
  • 82.
    Raciocínio diário &modelos mentais Você chega em casa em uma noite fria de inverno e sua casa não está aquecida. Como aquecê-la o mais rápido possível? Ligando o termostato no máximo ou na temperatura desejável? Você chega em casa morrendo de fome. Olha no refrigerador e tudo que encontra é uma pizza não cozida. Você tem um forno elétrico. Você primeiro o esquenta até 375 graus antes de colocar a pizza (como especificado nas instruções) ou gira o fogão acima do máximo especificado para tentar que ele aqueça o mais rapidamente possível?
  • 83.
    Aquecimento de umasala ou fogão controlados por um termostato • Muitas pessoas possuem modelos mentais não corretos (Kempton, 1996) • Por quê? – Na teoria geral de válvulas, o princípio “more is more” é generalizado para diferentes ambientes • ex.: fogão a gás, torneira, volume do rádio – Mas... Os termostatos funcionam baseados no modelo de interruptor on-off
  • 84.
    Aquecimento de umasala ou fogão controlados por um termostato • O mesmo é frequentemente verdade para entender como os dispositivos interativos e os computadores funcionam: – Pobremente, frequentemente incompletos, facilmente confusos, baseados em analogias inapropriadase superstições (Norman,1983) • ex.: cursor/tela congelada - a maioria das pessoas irão pressionar todas as teclas possíveis
  • 85.
    • Como designersdevemos desenvolver interfaces que ajudem o usuário a construir MMs adequados à sua interação com o sistema => poder de predição e explicação necessários para condução da interação Porque Modelos Mentais? Modelo do Designer Modelo do Usuário
  • 86.
    • Noções demodelos mentais têm sido usadas como base para modelos conceituais (conceptual models) • A hipótese é que se você pode entender como as pessoas desenvolvem os modelos mentais então pode ajudá-las a desenvolver mais apropriadamente os modelos mentais da funcionalidade do sistema • Por exemplo, um princípio de projeto é tentar fazer sistemas transparentes para que as pessoas possam entendê-los mais, sabendo o que fazer Modelos mentais & projeto de sistemas
  • 87.
    O princípio datransparência • Feedback útil • Fácil de entender • Uso intuitivo • Claro & fácil de seguir as instruções • Ajuda online apropriada • Guia sensitivo ao contexto de como proceder quando errar NÃO entender de forma literal!
  • 88.
    Pontos Chaves • Cogniçãoenvolve muitos processos incluindo atenção, memória, percepção e aprendizado • Como a interface foi projetada pode afetar enormemente quão bem os usuários podem entender, aprender e lembrar como realizar suas tarefas • A estrutura conceitual dos “modelos mentais” e “cognição externa” proveêm maneiras de entender como e porque pessoas interagem com produtos, o que pode nos levar a refletir sobre como é possível melhorar os projetos