Slide de Aula - Unidade I UNIP

Prévia do material em texto

Prof. Me. Antônio Palmeira
UNIDADE I
Estudos Disciplinares
Interação Humano-
computador
 O termo IHC foi cunhado por volta da década de 1980 e abrange todos os 
aspectos relacionados com a interação de usuários e computadores, e não 
somente design de interfaces.
 Surge a partir da preocupação com a comunicabilidade e a usabilidade dos 
sistemas computacionais.
Interação humano-computador (IHC)
Fonte: adaptado de: Barreto et al. (2018, p. 17).
Usuário
ação
interpretação
Sistema
AplicaçãoInterface
 A área de IHC é uma área multidisciplinar que envolve as áreas de Ciência da Computação, 
Psicologia, Ergonomia, Fatores Humanos, Linguística, Inteligência Artificial, Engenharia, 
dentre outras.
Multidisciplinaridade da IHC
Fonte: adaptado de: Barbosa (2010, 
p. 10).
Trabalho e
organização
social
Área de
aplicação
processador
humano de
informações
linguagem,
comunicação
e interação
ergonomia
Dispositivos de
entrada e saída
computação
gráfica
controle do
diálogo
Humano Computador
Adaptação
do usuário e
do sistema
Técnicas de
avaliação
Abordagens
de design
Soluções de design
boas e ruins
Ferramentas e
técnicas de
implementação
Processo de Desenvolvimento
Uso e Contexto de Uso
 É o meio pelo qual a comunicação acontece. 
 É responsável por promover estímulos de interação para que o usuário obtenha respostas 
relacionadas às suas atividades. 
 Ela existe no limite entre o computador 
e o ser humano, de forma que atua 
como um suporte computacional pelo 
qual o usuário aciona as funções do 
sistema, e dele recebe as 
informações solicitadas.
Interface
Fonte: adaptado 
de: Barreto et al. 
(2018, p. 67).
Domínio do controle
do homem
Domínio do controle
do computador
Responder
Ação do usuário gerando
input para o computador
Ler-examinar
Reconhecimento e interpretação
dos inputs do usuário
Pensar
Tomada de
decisões (o que
fazer com a
resposta
recebida do
computador)
Pensar
Processamento
do input de
acordo com os
algoritmos
Responder
Resposta do computador
enviada ao usuário
Ler-examinar
Reconhecimento e
interpretação da informação
apresentada pelo computador
A interface é composta por dois elementos: 
 Software – programas que apresentam informação e acionamento da dinâmica de interação.
 Hardware – dispositivos de interação.
 Observação: é por meio desses elementos que os inputs (ou entrada de dados) 
podem ser reconhecidos e processados, desenhados na tela pelo software e 
impressos no display ou tela. 
Elementos de uma interface
 Interface visual.
 Interface sonora.
 Interface tátil.
Tipos de interface
 Aumento da produtividade dos usuários.
 Redução do número e da gravidade dos erros cometidos pelos usuários.
 Redução do custo de treinamento.
 Redução do custo de suporte técnico.
 Aumento das vendas e da fidelidade do cliente.
Benefícios de uma boa interface
 Segundo Souza et al. (1999, p. 4), “interação é um processo que engloba as ações do 
usuário sobre a interface de um sistema, e suas interpretações sobre as respostas reveladas 
por esta interface”.
 Para Leite (1998, p. 30), de forma mais sucinta, interação “é o processo de comunicação que 
ocorre entre um usuário e uma aplicação de software”.
 A interação entre humanos e computador ocorre por meio de uma linguagem artificial.
Interação
Elementos léxicos (símbolos)
 Exemplo: botão play.
Elementos sintáticos (regras de validade)
 Exemplo: regras para assistir ao vídeo.
Elementos semânticos (significado)
 Exemplo: significado do botão play.
Elementos da linguagem na interação humano-computador
 Perspectiva de sistema: usuário se comporta como se fosse uma máquina.
 Perspectiva de parceiro de discurso: computador/sistema se comporta como 
se fosse uma pessoa.
 Perspectiva de ferramenta: computador/sistema apoia o usuário em uma tarefa.
 Perspectiva de mídia: computador/sistema se comporta como um meio de comunicação 
entre seres humanos.
Perspectivas da interação
Fonte: adaptado de: 
Barbosa (2010, p. 21).
Sistema Parceiro de discurso
usuário como 
computador
Mídia Ferramenta
computador
como pessoa
Trabalho
ou produto
 Conjunto de características dos objetos físicos que determina ou sugere ao observador que 
tipo de ação/uso se pode fazer com o objeto.
 Características dos objetos de interface que mostram aos seus usuários como tais objetos 
podem ser manipulados.
 Favorece a navegação intuitiva e sem dúvidas.
Conceito de affordances
 A qualidade de artefatos e ferramentas normalmente depende de quanto elas são 
agradáveis, úteis, fáceis de se utilizar, fáceis de se lembrar o funcionamento, seguras, 
eficazes, eficientes, dentre outras.
 A qualidade de uma interface de usuário reside nos fatores: acessibilidade, aplicabilidade, 
comunicabilidade, usabilidade e experiência de usuário.
Qualidades da interação
Qual das alternativas a seguir não pode ser considerada uma perspectiva de 
interação do usuário?
a) Perspectiva de sistema.
b) Perspectiva de parceiro de discurso.
c) Perspectiva de ferramenta.
d) Perspectiva de affordance.
e) Perspectiva de mídia.
Interatividade
Qual das alternativas a seguir não pode ser considerada uma perspectiva de 
interação do usuário?
a) Perspectiva de sistema.
b) Perspectiva de parceiro de discurso.
c) Perspectiva de ferramenta.
d) Perspectiva de affordance.
e) Perspectiva de mídia.
Resposta
 O critério de acessibilidade está relacionado à remoção das barreiras que impedem mais 
usuários de serem capazes de acessar a interface do sistema e interagirem com ele. 
 Cuidar da acessibilidade significa permitir que mais pessoas possam interagir com o sistema, 
tenham elas alguma deficiência ou não. 
Acessibilidade
 Conceito relacionado à utilidade de um sistema com uma variedade de situações 
e problemas.
 Permite determinar:
 O quanto o sistema é útil para o contexto em que foi projetado.
 Em que outros contextos o sistema pode ser útil.
Aplicabilidade
 Comunicabilidade de uma interface é a sua propriedade de transmitir a visão (as intenções e 
os princípios de interação que guiaram o projeto) do projetista sobre a lógica (o 
funcionamento) da interface ao usuário. 
 Se o usuário conseguir uma boa compreensão da lógica do projetista contida na aplicação, 
aumentarão as possibilidades de se construírem interfaces mais eficientes e eficazes. 
 Uma boa comunicabilidade permite que o usuário tenha um modelo mental compatível 
com o do projetista e significa que o usuário pode tirar melhor proveito do sistema.
Comunicabilidade
 Usabilidade é um conceito que se refere à qualidade da interação usuário-computador 
proporcionada pela interface de um sistema computacional.
 Para a norma NBR ISO/IEC 9126-1, usabilidade é um atributo de qualidade de software e é 
definida como a capacidade do produto de software de ser compreendido, aprendido, 
operado e atraente ao usuário, quando usado sob condições especificadas.
Usabilidade
 Aprendizagem: o sistema deve ser de fácil aprendizado para que o usuário possa começar a 
utilizá-lo rapidamente.
 Eficiência: o sistema deve ser eficiente no sentido de que uma vez que o usuário aprenda a 
utilizá-lo, ele o faça com alta produtividade.
 Memorização: o sistema deve ser de fácil lembrança, ou seja, ao passar um determinado 
período sem utilizar o sistema, o usuário pode utilizá-lo novamente sem ter que 
aprender tudo novamente.
 Erros: a taxa de erros do sistema deve ser baixa e, ao cometer algum erro, o usuário deve 
ter a possibilidade de recuperar o sistema para o estado imediatamente anterior ao erro.
 Satisfação: os usuários devem gostar do sistema. Ele deve ser 
agradável de ser utilizado para que as pessoas se sintam 
satisfeitas com o seu uso.
Aspectos que influenciam a usabilidade
 Quanto ao impacto que produz sobre a produtividade da tarefa.
 Quanto ao tipo de usuário.
 Quanto à tarefa em que semanifesta.
 Quanto ao grau de severidade.
Problemas de usabilidade
O usuário pode:
 diminuir sua produção;
 precisar de mais tempo para a realização de suas tarefas;
 cometer mais erros;
 sentir insatisfação com o sistema;
 precisar de mais tempo para aprender a utilizar o sistema;
 necessitar de diversos treinamentos;
 não se lembrar do funcionamento de recursos pouco utilizados;
 não aprender a usar todas as funcionalidades do sistema.
Interface sem usabilidade adequada gera uma série de problemas 
para o usuário
 A experiência do usuário com a interface é de grande importância.
 A experiência do usuário é muito ligada ao valor oferecido pelo produto.
 Experiência do usuário existe desde que as pessoas começaram a “usar” objetos para 
realizar alguma tarefa.
 Essas experiências são subjetivas, ou seja, cada um tem a sua experiência.
 Ela é influenciada por fatores humanos e por fatores externos.
 A experiência de usuário é um fator que atesta a qualidade de uma interface 
humano-computador.
As interfaces e a experiência do usuário
 Também conhecida como User eXperience (UX).
 É um aspecto da qualidade da interação de pessoas (usuário) com produtos tecnológicos 
consumidos e as consequências emocionais e cognitivas que decorrem dessa interação.
 A experiência de usuário trata da definição do problema que precisa ser resolvido (o porquê), 
definição para quem esse problema precisa ser resolvido (o quem) e definição do caminho 
que deve ser percorrido para resolvê-lo (o como).
 Observação: a experiência é do usuário, já a usabilidade é do sistema.
Conceito de experiência de usuário
 Dimensão pragmática (prática, realista e objetiva) – ligada a metas do fazer.
 Dimensão hedônica (prazerosa) – ligada a metas do ser.
Dimensões da experiência do usuário
 A experiência de usuário é abrangente e toca em todos os aspectos relacionados ao sistema 
(marketing, suporte, interface, financeiro, dentre outros).
 A experiência de usuário é longitudinal e não está limitada ao uso instantâneo, mas pode 
variar de acordo com o ciclo de vida (antes do uso, no momento do uso, no uso 
continuado e após o uso).
Amplitude da experiência de usuário em IHC
Qual é o fator relacionado à qualidade de uma interface de usuário que diz respeito à 
propriedade de transmitir a visão do projetista sobre a lógica da interface ao usuário?
a) Acessibilidade.
b) Aplicabilidade.
c) Comunicabilidade.
d) Usabilidade.
e) Experiência de usuário.
Interatividade
Qual é o fator relacionado à qualidade de uma interface de usuário que diz respeito à 
propriedade de transmitir a visão do projetista sobre a lógica da interface ao usuário?
a) Acessibilidade.
b) Aplicabilidade.
c) Comunicabilidade.
d) Usabilidade.
e) Experiência de usuário.
Resposta
 Usabilidade é um atributo de qualidade de software e é definida como a capacidade do 
produto de software de ser compreendido, aprendido, operado e atraente ao usuário, quando 
usado sob condições especificadas.
 Experiência de usuário é um atributo de qualidade de interação relacionada à perspectiva 
individual e subjetiva do usuário, influenciada pelas expectativas, vivências anteriores, 
condições individuais e interações com outros produtos.
Usabilidade x experiência de usuário
 É o desenho da definição de como as pessoas irão interagir com o produto, quais tarefas 
conseguirão realizar dentro dele, qual a ordem que as telas serão apresentadas, 
dentre outras.
 É uma ação estratégica dentro do processo de criação.
 Situa-se entre o pensamento estratégico (planejar um produto) e o pensamento prático 
(desenhar um produto), ajudando a definir como as ideias, especialmente as digitais, 
irão tomar forma.
Desenho da experiência de usuário
 Arquitetura de informação.
 Usabilidade.
 Design de interação.
 Taxonomia.
 Estratégia de design.
 Pesquisa com usuários.
Subáreas da experiência do usuário
 Não é direção de arte. 
 Não é planejamento.
 Não é gerência de projetos.
 Não é desenvolvimento de software.
 Não é ciência exata.
O que não é desenho de experiência de usuário
 Definição da estratégia – momento inicial que visa embasar decisões mais abstratas sobre a 
“razão de ser” do produto.
 Geração de ideias – etapa criativa, em que ocorre a coleta das ideias de todos os membros 
do time e a garantia de que eles estejam alinhados em relação ao que o produto está 
começando a se tornar.
 Planejamento do produto – aqui ocorrem o planejamento e o desenho do conteúdo.
 Pesquisa e validação – entendimento de como o consumidor pensa, o que espera do produto 
e como interage com ele.
 Desenho de interfaces – documenta como determinada tela deve funcionar.
Ações do desenho da experiência de usuário
 A IHC é multidisciplinar e envolve diversas disciplinas, inclusive aquelas que estudam o ser 
humano e os seus processos internos.
 Para bem projetar as interfaces para o usuário, precisamos conhecer bem o ser humano.
 Conhecer como o ser humano “funciona”.
 Precisamos conhecer a forma como as pessoas pensam e percebem o mundo ao seu redor.
Aspectos humanos da IHC
Fonte: adaptado de: Barreto et al. (2018, p. 94).
Entrada
ou
estímulo
Entrada
ou
resposta
Estágio 1 Estágio 2 Estágio 3 Estágio 4
Codificação Comparação
Seleção da
resposta
Execução da
resposta
Modelo de processador humano de informações
Fonte: adaptado de: Card et al. (1983).
Memória de Longo Prazo
Memória de TrabalhoVisual Auditiva
Processador 
Cognitivo
Processador 
Motor
Processador 
Perceptivo
Receptores
(olhos, ouvidos...)
Atuadores
Entrada SaídaMundo Externo
Processador Humano de Informação
 Memória sensorial – armazenamento de decaimento rápido associado aos sentidos.
 Memória de trabalho (curta duração) – responsável por armazenar as representações 
produzidas pelo processador perceptivo.
 Memória de longo prazo (longa duração) – responsável por armazenar a massa de 
conhecimentos da pessoa humana oriunda do processamento cognitivo.
Memórias do processador humano de informações
 Reconhecimento: é a capacidade do homem de reencontrar no seu campo perceptivo 
elementos anteriormente memorizados (reconhecer o nome de uma opção de menu após 
muito tempo sem vê-la).
 Reconstrução: é a capacidade do homem de recolocar os elementos memorizados na sua 
organização anterior (quais eram os parâmetros iniciais da configuração de um parágrafo de 
texto antes de reconfigurá-lo?).
 Lembrança: é a capacidade do homem de recuperar, de forma integral, uma situação 
anteriormente vivenciada, sem a presença de nenhum dos elementos dessa situação.
Processos da memória humana
 Processador perceptivo – subsistema responsável pela transmissão das sensações do 
mundo físico detectadas pelos sistemas sensoriais do corpo (visão, audição, tato, olfato, 
paladar) para representações mentais internas.
 Processador motor – subsistema responsável pelo tradução do pensamento em ações pela 
ativação de padrões de músculos voluntários, em uma série de micromovimentos discretos 
realizados pelo sistema motor.
 Processador cognitivo – subsistema responsável por receber a 
informação codificada simbolicamente dos armazenamentos 
sensoriais na sua memória de trabalho e utilização das 
informações previamente armazenadas na memória de longo 
prazo para tomar decisões sobre como responder aos 
estímulos recebidos.
Subsistemas de processamento humano
 Receptores – operam por meio dos nossos sentidos (visão, audição, tato, olfato, paladar).
 Atuadores – operam por meio das nossas expressões faciais, da nossa voz e do nosso 
sistema motor.
Subsistemas de entrada e saída
Considerando o processador humano das informações e as interfaces de usuário dos sistemas 
de informação, podemos afirmar que a memória de decaimento mais rápido do ser humano 
quando ele utiliza uma interface computacional é a:
a) Memória sensorial.
b) Memória de trabalho.c) Memória de curta duração.
d) Memória de longo prazo.
e) Memória de longa duração.
Interatividade
Considerando o processador humano das informações e as interfaces de usuário dos sistemas 
de informação, podemos afirmar que a memória de decaimento mais rápido do ser humano 
quando ele utiliza uma interface computacional é a:
a) Memória sensorial.
b) Memória de trabalho.
c) Memória de curta duração.
d) Memória de longo prazo.
e) Memória de longa duração.
Resposta
 Os receptores produzem sensações.
 A sensação é o resultado do estímulo físico sobre os receptores sensoriais nos 
órgãos dos sentidos.
 Os receptores são formados pelos nossos sentidos (visão, audição, tato, olfato, paladar).
Receptores
 Envolve o processamento da sensação e a tradução dela em uma experiência organizada.
 A memória interfere no processo com experiências e expectativas.
 Bons exemplos de percepções são: sabor, equilíbrio, movimento e propriocepção 
(reconhecimento da localização espacial do corpo).
Percepção
 A percepção visual é o processo resultante do uso do sentido da visão e da interpretação do 
estímulo luminoso.
 A compreensão da percepção visual fundamenta processos como: 
 Busca visual – processo de encontrar um item procurado.
 Discriminação – processo de separação entre sinal e ruído.
Percepção visual
 É a capacidade de receber e interpretar informações captadas por meio do sentido 
da audição.
 É a representação mental que fazemos quando estamos submetidos ao estímulo sonoro.
Percepção auditiva
 A percepção somada à reação e ao movimento leva quase um segundo para 
os seres humanos.
 Os processos motores do ser humano acionam as interfaces de entrada de dados.
Os processos motores e a IHC
 As vivências afetivas (principalmente a emoção e o sentimento) são relevantes para a IHC.
 Promover emoções e sentimentos ajuda a reter as informações necessárias 
para a interação.
 Perceber as emoções e os sentimentos ajuda a adaptar o comportamento do sistema.
Vivências afetivas e a IHC
Estilos de fonte e emoções/sentimentos associados
Fonte: adaptado de: Garcia; Neris (2015). 
Estilo Utilização Emoções associadas
Serif
Corpo de texto de 
editoriais, artigos e 
documentos impressos 
(BULAT, 2015; COY, 2014) 
Tradicionais, respeitáveis e confiáveis (COY, 
2014; GENDELMAN, 2015; MICHAEL, 
2015; VISUALLY, 2013)
Sans-serif
Mídias digitais e no corpo 
de textos pequenos 
(BULAT, 2015; COY, 2014; 
GENDELMAN, 2015) 
Limpas, modernas, objetivas, estáveis, 
universais (COY, 2014; MARMOL, 2013; 
MICHAEL, 2015; VISUALLY, 2013) 
Cursive
Títulos e decorações; 
convites, cartões e 
logotipos (BULAT, 2015; 
COY, 2014) 
Elegantes, femininas, amigáveis, 
intrigantes, criativas (BULAT, 2015; COY, 
2014; GENDELMAN, 2015; MICHAEL, 
2015; VISUALLY, 2013)
Fantasy
Títulos; produtos; logotipos 
(BULAT, 2015; MARMOL, 
2013; MICHAEL, 2015) 
Amigáveis, divertidas e casuais 
(GENDELMAN, 2015; MICHAEL, 2015) 
Moderna
Títulos e logotipos (COY, 
2014) 
Exclusivas, modernas, elegantes, 
inteligentes, futuristas (COY, 2014; 
GENDELMAN, 2015; MICHAEL, 2015; 
VISUALLY, 2013) 
 Gestalt – palavra alemã que significa “forma” ou “figura”.
 É uma teoria da psicologia que estuda a percepção visual e a psicologia das formas.
 O princípio básico da Psicologia da Gestalt nos diz que o todo é diferente da 
soma de suas partes. 
 Com base nessa crença, psicólogos da Gestalt desenvolveram um conjunto de princípios 
para explicar a organização perceptiva ou a forma como a mente agrupa pequenos objetos 
para formar outros maiores. 
 Esses princípios são, muitas vezes, referidos como as “leis da organização perceptiva”.
 O estudo de Gestalt está relacionado à percepção que os 
usuários têm do mundo e o que nele contém. 
 Ele explica como o cérebro pode nos influenciar em 
determinadas situações, pela interpretação 
do que vemos.
Teorias de Gestalt
 Proximidade: as entidades visuais que estão próximas umas das outras são percebidas 
como um grupo ou unidade.
 Boa continuidade: traços contínuos são percebidos mais prontamente do que contornos que 
mudam de direção rapidamente.
 Simetria: objetos simétricos são mais prontamente percebidos do que objetos assimétricos.
Princípios de Gestalt
Fonte: adaptado de: Barbosa (2010, p. 51).
proximidade continuidade simetria
 Similaridade: objetos semelhantes são percebidos como um grupo.
 Destino comum: objetos com a mesma direção de movimento são percebidos 
como um grupo.
 Fecho: a mente tende a fechar contornos para completar figuras regulares, “completando as 
falhas” e aumentando a regularidade.
Princípios de Gestalt
Fonte: adaptado de: Barbosa (2010, p. 51).
similaridade destino comum fecho
 Determinar quais elementos de design são mais eficazes em alguma situação. Por exemplo, 
pela utilização de sombreamento de fundo, hierarquia visual, agrupamento de itens 
semelhantes e distinção de itens diferentes.
 Esses princípios psicológicos influenciam nossa percepção visual, permitindo que designers
direcionem a atenção dos usuários para pontos específicos de foco que vão levar a executar 
ações e criar mudanças comportamentais.
 Em um nível mais elevado, os princípios de Gestalt ajudam a 
projetar produtos que resolvem problemas e atendem às 
necessidades do usuário de maneira agradável e objetiva.
Princípios de Gestalt e a IHC
O princípio de Gestalt que menciona “objetos com a mesma direção de movimento são 
percebidos como um grupo” é conhecido como:
a) Proximidade.
b) Boa continuidade.
c) Simetria.
d) Similaridade.
e) Destino comum.
Interatividade
O princípio de Gestalt que menciona “objetos com a mesma direção de movimento são 
percebidos como um grupo” é conhecido como:
a) Proximidade.
b) Boa continuidade.
c) Simetria.
d) Similaridade.
e) Destino comum.
Resposta
 BARBOSA, S. D. J. Interação humano-computador. Rio de Janeiro: Elsevier, 2010.
 BARRETO, J. S. et al. Interface humano-computador. Porto Alegre: SAGAH, 2018.
 CARD, S. et al. The psychology of human-computer interaction. Hillsdale, NJ: Lawrence 
Erlbaum Associates, 1983.
 GARCIA, A. C.; NERIS, V. P. A. Um estudo sobre emoções e interfaces de usuário em 
sistemas web. Tecnologias, infraestrutura e software. v. 4, n. 3, p. 180-190, set-dez. 2015.
 LEITE, J. C. Modelos e formalismos para a engenharia semiótica de interfaces usuário. 1998. 
205 f. Tese (Doutorado em Ciências em Informática) – Pontifícia Universidade Católica do 
Rio de Janeiro – PUCRio, Rio de Janeiro, 1999. Disponível em: ftp://ftp.inf.puc-
rio.br/pub/docs/theses/98_PhD_leite.pdf.
 SOUZA, C. S. et al. Interação humano-computador: 
perspectivas cognitivas e semióticas. In: FUKS, H. (org.). In: 
JORNADAS DE ATUALIZAÇÃO EM INFORMÁTICA, 1999, Rio 
de Janeiro. Anais. Rio de Janeiro: Edições EntreLugar, 1999. p. 
420-70.
Referências
ATÉ A PRÓXIMA!