RESUMO IHC - PARTE 01

Sistemas computacionais interativos: são compostos por hardware, software e meios de

comunicação que são desenvolvidos para interagirem com pessoas.

Sistemas computacionais interativos estão presentes no nosso cotidiano através de:

 Tecnologias de Informação e Comunicação (TICs)

 Modificam a forma como: nos relacionamos com outras pessoas e instituições; lidamos com o
dinheiro; trabalhamos, prestamos serviços, aprendemos, ensinamos, etc.
 Afetam o comportamento humano em termos de o que se faz, como se faz, quem faz, quando
faz, onde faz e por quê faz

Desenvolvimento:

 Diversos envolvidos (ou stakeholders): fabricantes de hardware, de software, profissionais de

suporte e manutenção, provedores de acesso à Internet, produtores de conteúdo, usuários, etc
 Diferentes pontos de vista:
o Visão do cliente (o que o sistema deve permitir fazer)
o Visão do fabricante (o que o sistema permite fazer)
o Visão do usuário (como o sistema é usado)
Usuário:

 Seres humanos
 Sistema cognitivo
 Motivação
 Preferências
 Comportamento social
 Emoções
 Diferenças individuais
 Variações intra-indivíduo
 Mudanças intra-indivíduo

Tais características ainda podem ser afetadas pelo contexto de uso.

O Usuário e o Contexto de Uso: Diversas questões a serem tratadas

 Como considerar o usuário no processo de desenvolvimento de sistemas computacionais

interativos?
 Como considerar os fenômenos relacionados ao contexto de uso?
 Como avaliar se um projeto de interação é bom ou ruim?

Interação Humano-computador

 Interação Humano-computador (IHC) vem do inglês Human-computer Interaction (HCI);

 É uma disciplina que foca nos sistemas computacionais interativos para uso humano, quem
interage com o sistema é um ser humano;
 IHC tem interesse especial no:
o Projeto
o Implementação
o Avaliação
o Fenômenos relacionados ao uso

Ênfase no desenvolvimento:

De dentro para fora (foco no software): Maior ênfase em minimizar erros, algoritmos e arquitetura.
De fora para dentro (foro no usuário): Maior ênfase em como os usuários são, características de uso
e características humanas.
Design centrado no Ser Humano:

Desenvolvimento centrado no humano consiste em colocar as pessoas em primeiro lugar e em projetar

sistemas interativos que favoreçam as pessoas e dos quais elas possam usufruir

Ser centrado no humano é pensar no que as pessoas querem fazer em vez do que a tecnologia pode
fazer; projetar novas maneiras de conectar pessoas; envolver as pessoas no processo de design;
projetar para a diversidade.

Objetos de Estudo:

 Ênfase na (o):
o Natureza da interação humano-computador
o Uso de sistemas interativos situados em contexto
o Características humanas
o Arquitetura de sistemas computacionais e de interfaces com os usuários
o Processos de desenvolvimento preocupados com o uso

Multidisciplinaridade:

Área multidisciplinar: A definição da interface envolve disciplinas como Design, Ergonomia,

Linguística e Semiótica. A análise de cultura, discurso e comportamento dos usuários envolve
disciplinas como Psicologia, Sociologia e Antropologia.

Equipe multidisciplinar: Pessoas com diferentes visões do mundo, formas de pensar e vocabulários.
Diferentes visões potencializa a criatividade.

Perspectivas de Design em IHC

Racionalismo técnico (Simon)

 Problemas e soluções conhecidos / Métodos de solução bem definidos a priori

 Designer enquadra uma situação num tipo geral de problema cuja forma de solução seja
conhecida

Reflexão em ação (Schon)

 Problemas e soluções únicos / Métodos e ferramentas para auxiliar o aprendizado do designer

sobre o problema e solução únicos
 Designer busca aprender sobre o problema em questão e a solução sendo concebida

Habilidades de um Designer: Capacidade de:

 Estudar e entender as atividades e aspirações das pessoas e os contextos nos quais uma
tecnologia pode ser útil;
 Conhecer as possibilidades oferecidas pelas tecnologias;
 Pesquisar e projetar soluções tecnológicas que combinem com as pessoas, atividades e
contextos;
 Avaliar design alternativos e iterar (fazendo mais pesquisas e mais design) até chegar a uma
solução;

O que se aprende em IHC?

 Compreender os fenômenos de interação entre seres humanos e sistemas computacionais.

 Propósito: Melhorar a concepção, construção e inserção dos sistemas na vida das pessoas.
Fazer isso sempre buscando uma boa experiência de uso.
  Ter em conta características humanas e computacionais para desenvolver sistemas que
o Melhorem a vida das pessoas;
o Gerem bem-estar;
o Aumentem a produtividade;
o Satisfaçam necessidades e desejos;
o Respeitem as limitações e os valores;

Benefícios de IHC:

 Aumentar a qualidade de uso de sistemas interativos

 Isso permite:
o Aumentar a produtividade dos usuários
o Reduzir o número e a gravidade dos erros cometidos pelos usuários
o Reduzir o custo de treinamento dos usuários
o Reduzir o custo de suporte técnico
o Aumentar as vendas e a fidelidade do cliente

RESUMO IHC - PARTE 02

Usuários e Contexto de Uso:

Contexto de Uso: Inclui tempo e ambiente físico, social e cultural

Exemplo: Após retornar da aula, João usa o computador de mesa do quarto dele para pesquisar sobre
IHC na máquina de busca google.com
Os elementos:

 Objetivo: Pesquisar sobre IHC

 Usuário: João
 Contexto: no quarto
 Interface: Teclado
 Sistema: google

O conceito "Interação": Interação usuário-sistema é um processo de manipulação, comunicação,

conversa, troca e influência que ocorre durante o uso.

Perspectivas na interação usuário-sistema:

 Sistema
 Parceiro do discurso
 Ferramenta
 Mídia

Sistema:

Característica: Usuário é visto como um sistema; trata-se da interação entre sistemas.

Objetivo: Aumentar a eficiência, por meio da redução do tempo de interação; aumentar a precisão por
meio da redução do número de erros.

Exemplos:

 Comandos codificados, como teclas de atalho (ex:Ctrl+c e Ctrl+v)

 Linguagens de comando (ex: cd, dir)

É comum na gerência de servidores Linux e era muito comum em sistemas bancários

Efeitos:

 Barreira para o uso do sistema

 Necessidade de treinamento do usuário

Parceiro do Discurso:

Tornar a interação com o sistema mais próxima do que é a interação entre seres humanos;
O sistema assume papel à altura de um ser humano: Raciocinar, fazer inferências, tomar decisões;

Exemplos:

 Sistemas de recomendação
 Sistemas de personalização
 Sistemas de mensagens de ajuda

Área de estudo muito promissora

 Compreensão de linguagem natural

 Inteligência artificial
 Interação homem-computador

Ferramenta:

 O sistema é considerado um instrumento que auxilia o usuário a realizar suas tarefas.

 Encadeamento de ações e reações empregando tal sistema.

Exemplos:

 Editores de texto
 Ambiente de Desenvolvimento Integrado (IDEs)
 Ferramentas de edição de imagens

Mídia:

O sistema é como uma mídia:

 Televisão, rádio, telefone, etc.

 Meio pelo qual as pessoas se comunicam;

Foca na qualidade da comunicação; entendimento mútuo.

Exemplos:

 Sistemas de e-mail
 Redes sociais
 Fóruns
 About de um sítio Web
 Fale conosco
Resumo das perspectivas:

Perspectiva Significado da Interação Fatores de qualidade mais evidentes

Eficiência (tal como indicado pelo tempo de uso e número
Sistema Transmissão de Dados
de erros cometidos)
Parceiro de Discurso Conversa usuário-sistema Adequação da interpretação e geração de textos
Ferramenta Manipulação da ferramenta Funcionalidades relevantes ao usuário, facilidade de uso
Comunicação entre usuários Qualidade da comunicação mediada e entendimento
Mídia
e designer-usuário mútuo

Interface: Único meio de contato entre o usuário e o sistema.

Interface é a porção do sistema com a qual o usuário mantém contato físico ou conceitual.

 Contato físico
o Hardware
o Entrada de dados
o Recebimento de dados
 Contato conceitual
o A interpretação do usuário daquilo que ele percebe através do contato físico

A Interface é Delimitadora:

A interface determina os processos de interação que são possíveis ao usuário, à medida que determina
o que ele pode fazer, deque maneira e em que ordem.

O que pode influenciar a definição da interface?

 O contexto de uso
 As características físicas e cognitivas dos usuários
 A formação, o conhecimento e as experiências do usuário

Affordance: Conjunto de características físicas de um artefato que evidenciam o que é possível fazer
com ele e as maneiras de utilizá-lo.

Affordance na Interface: Conjunto de características do hardware e do software evidenciam

 Um conjunto de operações que podem ser realizadas

 Formas de realizá-las manipulando os elementos da interface

Affordance e Falsa Affordance

Affordance: Guiar o usuário sobre o que o sistema é capaz de fazer e como ele pode manipular a
interface para fazê-lo.

Ex.: Se existe um botão na interface, o usuário entende que ele pode clicar no botão e que o sistema
fará algo

Falsa affordance: Enganar dando a impressão de que a interface funciona de uma forma quando ela
funciona de outra

Ex.: Criar um botão que não executa nenhuma ação quando acionado
Qualidade em IHC

A interação e a interface devem ser adequadas para que os usuários possam aproveitar ao máximo o
apoio computacional oferecido pelo sistema. Quais características a interação e a interface devem ter
para serem consideradas adequadas?

 Usabilidade
 Experiência do usuário
 Acessibilidade
 Comunicabilidade

Usabilidade: "O grau em que um produto é usado por usuários específicos para atingir objetivos
específicos com eficácia, eficiência e satisfação em um contexto de uso específico" ISO 9241-11 (1998).

 Eficiência: Quantidade de recursos necessários para alcançar os objetivos

 Eficácia: Alcançar os objetivos corretamente
 Satisfação: Usuários estarem satisfeitos com a interação

Fatores Tratados em Usabilidade: A usabilidade trata principalmente da capacidade cognitiva,

perceptiva e motora dos usuários

 Fatores considerados
 Facilidade de aprendizado
 Facilidade de recordação
 Eficiência
 Segurança no uso
 Satisfação do usuário

Experiência de Uso: O que o usuário experimenta ao interagir com o sistema. Engloba aspectos como
emoções e/ou sentimentos.

Acessibilidade:

 Usuário acessar o sistema para interagir com ele, sem que a interface imponha obstáculos.
 Permitir que mais pessoas possam perceber, compreender e utilizar o sistema para usufruir do
apoio computacional oferecido por ele.
 Usuários que possuem limitações físicas, mentais ou de aprendizado têm mais chances de
encontrar barreiras que dificultam ou impedem a interação.

Comunicabilidade:

 O processo de interação homem-computador envolve a comunicação dos passos necessários

para que o usuário alcance o objetivo.
 A comunicabilidade diz respeito à capacidade da interface de comunicar ao usuário a lógica que
rege seu funcionamento.

RESUMO IHC – PARTE 03

Abordagens Teóricas em IHC

Muitos dos métodos, modelos e técnicas utilizadas em IHC se baseiam em teorias de base psicológica
(principalmente cognitiva), etnográfica e semiótica.
Conhecer essas teorias é fundamental para:

 Entender os métodos, modelos e técnicas utilizadas IHC

 Saber quando utilizá-los
 Identificar a necessidade de adaptá-los em projetos de design particulares

Abordagens e suas Diferenças

Abordagens baseadas na psicologia experimental

 Surgiram nos anos 50

 Permitem mensurar e modelar o comportamento humano observável e prever o desempenho
 Lei de Hick-Hyman e Lei de Fitts

Abordagens baseadas na psicologia cognitiva aplicada

 Surgiram nos anos 80

 Centradas nos aspectos cognitivos da interação por detrás do comportamento
 Modelo de processador humano de informações e engenharia cognitiva

Cognição

O que é cognição? “É o que acontece na nossa cabeça quando executamos tarefas diárias”

Estado da mente pelo qual nós percebemos e reagimos (cognição experiencial)

- Exemplos: Dirigir um carro, ler um livro, jogar videogame

Cognição envolve pensar, comparar, tomar decisões (cognição reflexiva)

- Ela nos leva a ideias novas e criativas
- Exemplo: projetar, escrever um livro, aprender

Psicologia Cognitiva Aplicada em IHC

Visão da interação humano-computador:

 Usuário e o computador interagem com o objetivo de realizar alguma tarefa

 A estrutura da tarefa oferece grande parte do conteúdo preditivo do desempenho do usuário

Sabendo os objetivos dos usuários e suas limitações de percepção e de processamento pode-se

estimar quanto tempo leva para realizarem as tarefas físicas predefinidas

Abordagens Teóricas: Fundamentos de base psicológica, etnográfica e semiótica:

 Leis de Hick-Hyman e de Fitts

 Processador humano de informação
 Princípios da Gestalt
 Engenharia cognitiva e a Teoria da Ação
 Teoria da atividade
 Cognição distribuída
 Engenharia semiótica

Lei de Hick-Hyman

Relaciona o tempo (T) que uma pessoa leva para tomar uma decisão (tempo de reação) com o número
de possíveis escolhas que ela possui (N):
Uso de Hick's Law:

Em vez de considerar todas as opções uma a uma, a pessoa faz uma pesquisa binária. Subdivide o
conjunto total de opções em categorias, eliminando aproximadamente metade das opções a cada passo

Não se aplica caso não exista um princípio de organização das opções que permita ao usuário a
eliminação de opções e se a busca binária não pode ser realizada.

Exemplo de Hick's Law: Em qual alternativa é mais rápido localizar um estado que você não conhece?
Por quê?

Lei de Fitts (Fitts' law)

Relaciona o tempo (T) que uma pessoa leva para apontar para um objeto-alvo com o tamanho que tem
esse o objeto-alvo (S) e com a distância entre a posição atual e o objeto-alvo (D)

Exemplo de Fitts' Law: Em qual alternativa é mais rápido alcançar o botão salvar? Por quê?
Processador Humano de Informações (Model Human Processor (MHP))

Características:

 Integra modelos de memória, resolução de problemas, percepção e comportamento

 Permite fazer predições aproximadas de parte do comportamento humano
 Possui 3 subsistemas: perceptivo, cognitivo e motor

Subsistema Perceptivo

Sensações do mundo físico são detectadas pelos sistemas sensoriais do corpo

 Visão
 Audição
 Tato
 Olfato
 Paladar

Sensações são transmitidas para representações mentais internas

Subsistema Cognitivo

 Memória de trabalho (limitada) (Short-term memory e Working memory)

 Memória de longo prazo (ilimitada?) (Long-term memory)

O subsistema recebe as informações sensoriais na sua memória de trabalho e utiliza informações

previamente armazenadas na memória de longo prazo para tomar decisões

Subsistema Motor

 Traduz os pensamentos em ação

 Ativação de músculos de forma voluntária
 Série de micro movimentos: Discretos ou Involuntários

Overview do MHP
Considerações Sobre as Memórias

Os elementos ativados da memória de longo prazo consistem em símbolos ou grupos de símbolos

 Chunks, elementos de informação

 Variam com a tarefa, pessoa e conteúdo
 Memória de trabalho é limitada a 7 ± 2 chunks

Parâmetros para análise da memória

 Capacidade de armazenamento em número de itens

 Tempo de decaimento (esquecimento) de um item
 Tipo de código principal: físico, acústico, visual ou semântico

Vieses Cognitivos

- Racionalidade Limitada
- Como tomamos decisões quando:

 Temos muitas informações para considerar

 Há pouca informação ou pouco significado
 Precisamos fazê-lo rápido
 Não temos memória para todas as informações a serem consideradas

Alguns Vieses Cognitivos Relevantes em IHC

 Default effect (do Status quo bias)

 Clustering illusion
 Courtesy bias (ou Social Desirability)
 Focusing effect
 Framing effect

Princípios de Gestalt

 Também chamados Princípios da gestalt, princípios gestálticos, teoria gestáltica, teoria ou lei da
forma
 Conjunto de leis/fatores que nos leva a perceber (ou deixar de perceber) determinada
informação
 Observação de um conjunto de elementos e não de partes isoladas

Princípios

 Proximidade: as entidades visuais que estão próximas umas das outras são percebidas como
um grupo ou unidade
 Boa continuidade: (alinhamento): traços contínuos são percebidos mais prontamente do que
contornos que mudem de direção rapidamente

 Simetria: objetos simétricos são mais prontamente percebidos do que objetos assimétricos

 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
  Região comum: objetos dentro de uma região especial confinada são percebidos como um
grupo

 Conectividade: objetos conectados por traços contínuos são percebidos como relacionamento

Percepção de Cores

Estudos sobre a percepção de cores resultaram em:

- Diretrizes úteis no projeto de interfaces, ex:

 Usar poucas cores

 Usar cores neutras
 Usar cores com mesma luminância (brilho)
 Usar cores brilhantes com cautela

- Diretrizes sobre as sensações que as cores causam

 O verde descansa
 O vermelho atrai a atenção e pode causar irritação
 O azul dá sono
 O amarelo desperta

Semântica das Cores: Além dos mecanismos perceptivos inatos aos seres humanos, existem fatores
culturais que influenciam a percepção de elementos visuais. A semântica da cor varia com a cultura: Ex:
vermelho pode significar perigo (ocidente) ou boa sorte (oriente).

Engenharia Cognitiva

Concebida por Donald Norman em 1986:

 Entender os princípios fundamentais da ação e desempenho humano que são relevantes para o
desenvolvimento de diretrizes de design
 Elaborar sistemas que sejam agradáveis de usar e que engajem os usuários até de forma
prazerosa
Na base da engenharia cognitiva está uma discrepância: objetivos expressos psicologicamente versus
controles e variáveis físicos

Dois Mundos: Mundo psicológico X Mundo físico

Problemas que Podem Surgir

 Problemas de mapeamento: As variáveis psicológicas são mapeadas adequadamente em

variáveis físicas? A interface é clara?
 Dificuldade de controle: Quão fácil é controlar as variáveis físicas?
 Dificuldade de avaliação: Quão fácil é avaliar o resultado de variações nas variáveis físicas ou o
resultado de manipulações na interface?

Exemplo da Torneira

Quais variáveis físicas que podem ser manipuladas? Fluxo de água fria e fluxo de água quente
O que o usuário deseja manipular? A temperatura e o fluxo de água na torneira

 Problema de mapeamento: Qual é o controle de água quente e qual é o de água fria?

 Dificuldade de controle: Para aumentar a temperatura da água mantendo o fluxo constante, é
necessário manipular simultaneamente as duas torneiras
 Dificuldade de avaliação: Quando há dois bicos de torneira, às vezes se torna difícil avaliar se
o resultado desejado foi alcançado

Modelos na Engenharia Cognitiva

Modelo de design: Modelo conceitual do sistema tal como concebido pelo designer
Imagem do sistema: Modelo físico construído com base no modelo conceitual de design
Modelo do usuário: Modelo conceitual construído pelo usuário durante sua interação com o sistema
O Designer e o Usuário

Tudo o que o designer construir na imagem do sistema pode auxiliar ou prejudicar na interpretação do
usuário

 Elementos de interface para entrada e saída de dados

 Documentação
 Instruções
 Ajuda on-line
 Mensagens de erro

O designer deve fazer com que o usuário seja capaz de elaborar um modelo conceitual compatível com
o modelo de design

Teoria da Ação

 Elaborada por Norman (1991) para melhor caracterizar o papel das questões de mapeamento,
controle e avaliação
 Distingue diversos estágios de atividade ocorridos durante a interação entre o usuário e o
sistema

Ênfase da Teoria da Ação

Foca na discrepância entre as variáveis psicológicas e os controles e variáveis físicos: “objetivos das
pessoas” versus “mecanismos de interação e estados do sistema”

A discrepância é representada por dois golfos que precisam ser superados ou “atravessados”: golfo de
execução e golfo de avaliação

Travessia dos Golfos: Processos físicos e cognitivos que ocorrem na travessia de cada golfo
Fluxo de Execução e Avaliação

Nem sempre a travessia dos golfos é iniciada pelo golfo de execução

Exemplo: monitoramento

 O usuário fica observando a saída do sistema até perceber que houve uma mudança
 Quando alguma mudança ocorrer, o usuário deve diagnosticá-la e tomar as providências
necessárias, percorrendo os golfos de avaliação e execução

O Papel do Designer na Travessia

Abreviar a travessia dos golfos a fim de reduzir os problemas que ocorrem durante a interação: Quando
mais longa for a travessia, maior a chance de problemas.

Mapeamento adequado das variáveis de interesse em variáveis físicas do sistema:

 Elementos de interface adequados abreviam o golfo de execução

 Representação dos dados de saída e mensagens de resposta do sistema (feedback) contribuem
para abreviar o golfo de avaliação

Teoria da Atividade

 Rejeita o ser humano isolado como uma unidade de análise adequada

 Insiste na mediação cultural e técnica da atividade humana: O ser humano e o seu contexto
 Entende o comportamento humano como ancorado em práticas coletivas compartilhadas

Características

A atividade humana:

 é dirigida a um objeto material ou ideal

 é mediada por artefatos
 é socialmente constituída dentro de uma cultura

Há uma hierarquia de atividade, ação e operação:

 A atividade é realizada através de ações conscientes direcionadas pelos objetivos do sujeito

 As ações são realizadas através de operações inconscientes, disparadas pela estrutura da
atividade e as condições do ambiente

Atividade, Ações e Operações

- A atividade é orientada a um motivo
- Ações

 São orientadas a metas

 São planejadas
 Podem ser realizadas de forma cooperativa
 Quando são realizadas várias vezes, se tornam automáticas, ou seja se tornam operações

- Operações são automáticas e não planejadas

Cognição Distribuída

- Descreve o contexto da atividade, os objetivos do sistema funcional e seus recursos disponíveis

- Identifica:

 As entradas e saídas do sistema funcional

 As representações e processos disponíveis
 As atividades de transformação que ocorrem durante a resolução de problemas para atingir o
objetivo do sistema funcional

Engenharia Semiótica

- Trata a interação humano-computador como um caso particular de comunicação humana mediada por
sistemas computacionais

- Investiga processos de comunicação em dois níveis distintos:

 A comunicação direta usuário-sistema

 A metacomunicação do designer para o usuário mediada pelo sistema, através da sua interface
 RESUMO IHC – PARTE 04

Paradigmas da Interação Humano-Computador e Recomendações Ergonômicas

Ergonomia:

 Ergonomia é a área do conhecimento que trata das relações entre homem e máquina; Visa
aspectos de segurança e eficiência ideais na interação entre eles.
 Ergonomia está na origem da usabilidade;
 Recomendações ergonômicas: “Regras” ergonômicas aplicáveis à seleção e à configuração de
estilos de componentes da interface; Comportamentos elementares e estruturados.

Comportamentos Elementares

- Os comportamentos de uma interface se subdividem em comportamentos elementares e

comportamentos estruturados
- Comportamentos elementares: a interface deve se antecipar e reagir às reações dos usuários

 Convidá-lo e apoiá-lo durante as ações

 Fornecer a ele respostas adequadas quanto ao andamento e ao resultado dessas ações

Convite à interação: Indicar ao usuário ações que ele pode fazer

Apoio às ações: Diminuição da carga de trabalho

Feedback: Para cada entrada o sistema deve produzir uma saída

Comportamentos Estruturados:

- Diálogos que se estabelecem entre o sistema e seus usuários

- Estruturas ou estilos repetindo dois padrões gerais de comportamento

 Uma sequência rígida de ações

 Uma sequência livre de escolha do usuário
Exemplos:

Diálogos com caminhos concorrentes: Menu, Linguagem de comando, Preenchimento de formulário

(form fill)

Diálogos sequenciais: Passo a passo, Pergunta vs. Resposta, etc.

Paradigmas de Interação

Características e recomendações para:

Linguagem de comandos
Interfaces gráficas:

 WIMP (windows, icons, menus e pointer) Janelas, ícones, menus, apontadores

 Interfaces Web
 Interfaces Ubíquas

Linguagem de Comandos

Sequências de caracteres que representam comandos, parâmetros e opções. Remonta à forma de

interação entre os usuários e os primeiros computadores.

A interação é poderosa, concisa e rápida; agrada usuários frequentes e experientes; dispensa os

movimentos extra de mãos (Dispositivos de apontar); requer treino e capacidade de memorização
(Memória de longo prazo)

Características Principais

- Recordar versus reconhecer:

 Não há o conceito de manipulação direta

 É preciso conhecer e recordar os comandos para poder executá-los

Pontos Positivos

 Comandos podem ser rápidos de se executar

 Usuários frequentes conseguirão recordá-los, se existirem poucos
 Podem ser falados: Carros e sistemas de busca (como Google)

Pontos Negativos

 É preciso recordar a sintaxe do comando

 Conjunto de centenas de possibilidades
 Barreira para novos usuários e para usuários pouco frequentes

Recomendações

- O formato dos comandos deve ser consistente

- Nomes específicos, distintos e com significado

 Um comando para sair: “exit” ou “quit”

 Usar palavras opostas para comandos opostos: “up” e “down”
 Em abreviaturas, conflitos são inevitáveis: “d” = “down” ou “d” = “delete”?

- Gerar uma lista com diversos nomes possíveis e averiguar quais conferem maior significado
- Permitir auto-completar
Interfaces Gráficas (Graphical user interfaces (GUIs))

WIMP (windows, icons, menus e pointer):

 Janelas, ícones, menus e apontadores

 Comum em computadores pessoais e dispositivos móveis

Manipulação direta:

 Objetos gráficos na tela são manipulados com o uso de um dispositivo de apontar

 O usuário pode reconhecer, em vez de recordar

Janelas (Windows)

 Compartilhar recursos gráficos entre diversas aplicações ao mesmo tempo

 Ver resultados de vários processos ao mesmo tempo e “alternar o foco” entre eles como desejar

Ícones (Icon)

 David Canfield Smith (1975), uso em interfaces

 Símbolos usados para representar objetos e funcionalidades
 Ajuda o usuário a reconhecer a funcionalidade

Projeto de Ícones

Faz uso dos três principais tipos de representação

 Metáfora: Transferir conhecimento de um domínio aplicando ele em outro domínio
 Mapeamento direto: Criar uma imagem parecida com o que o ícone pretende representar
 Convenção: Manter-se consistente em diferentes aplicações e sistemas

Dois aspectos importantes no projeto de ícones são

 Legibilidade: Ser possível diferenciar os ícones

 Interpretação: Identificar o que o ícone represeta

William Horton Checklist

 Compreensível: A imagem sugere espontaneamente o conceito pretendido?

 Familiar: Os objetos nos ícones são familiares aos usuários?
 Não-ambíguo: A imagem está associada a apenas um conceito? Existem recursos adicionais
(rótulo, outros ícones, documentação) para resolver uma possível ambiguidade?
 Memorizável: As operações estão bem descritas como objetos?
 Informativo: Por que o conceito é importante?
 Poucos: O número de ícones é inferior a 20?
 Distinto: Todos os ícones são diferentes uns dos outros?
 Atrativo: A imagem usa linhas suaves e evita cantos vivos?
 Legível: Você testou todas as combinações de cor e tamanho em que o ícone será exibido?
 Compacto: É cada objeto, cada linha, cada pixel no ícone necessário?
 Coerente: Está claro onde um ícone termina e outro começa?
 Extensível: Posso desenhar a imagem menor? Será que as pessoas ainda reconhecerão o
ícone?

Menus: Lista de comandos ou opções que podem ser escolhidos pelo usuário

 Comandos são agrupados em tópicos

 Podem ser organizados hierarquicamente (ou em cascata)
 Podem ser presos a uma barra
 Podem surgir como um pop-up menu (ou contextual)
Outros Recursos Gráficos

 Radio Buttons: Usado na escolha entre opções que são mutuamente exclusivas e em que uma
opção precisa ser ativada
 Checkboxes: Usado em opções que não são mutuamente exclusivas e que podem ser ativadas
e desativas
 List boxes:

o List box: Exibe uma lista com diversos itens e o usuário pode selecionar um ou mais
itens
o Drop Down List box: Exibe um item no campo de visão do usuário por default e quando
clica-se no botão na lateral esquerda, todos os itens ficam acessíveis
o Combo box: Combina uma caixa de texto com uma caixa de listagem para criar um Drop
Down List box com apenas os itens correspondentes ao texto digitado

 Scrollbar: Percorrer um conjunto limitado de itens

o Cria a ideia de sequência

o Poucos itens estão no campo de visão
o Indica que há mais itens para serem vistos
o Ideia de continuidade

 Sliders: Escolher um valor em um intervalo em vez de definir um valor exato (Volume,

Luminosidade, Velocidade)
 Toolbars: Botões agrupados de acordo com suas funções

o São representados como ícones

o Podem ser ativados ou desativos dependendo do contexto

o Recomendações:
 Preservar a sequência em que os botões aparecem
 Chunking, reunir itens relacionados
 Princípios de gestalt (proximidade, região comum)

 Form fill: Estilo de interface para reunir informações

o Semelhante ao preenchimento no papel

o Requer facilidade de identificar e corrigir uma informação, e facilidade de reconhecer
informações obrigatórias

o Recomendações:
 Rótulos e dados devem ser diferenciáveis visualmente
 Diferenciação visual entre dados default e dados definidos pelo usuário, e campos
opcionais e campos de preenchimento obrigatório
 Os usuários devem ter algum tipo de feedback sobre quando os dados fornecidos
são salvos (enviados) e se alguma ação é necessária ou não
 Ordenar o Tab

 Wizards: Passo a passo de uma série de interações que vão surgindo uma após a outra até a
tarefa ser concluída
  Alertas: Recurso gráfico para chamar a atenção do usuário para algo

o Importante:
 Não tirar a atenção do usuário da tarefa principal
 Em algumas situações podem ser ignorados e em outras não podem
 Não sobrecarregar o usuário com informações que ele não pode entender ou
responder

o Recomendações
 Cuidar da clareza da mensagem que é apresentada
 Evitar linguagem ameaçadora ou alarmante

 "Erro fatal"
 "Execução abortada"
 "Deseja matar trabalho?"
 "Ocorreu um erro catastrófico"

o Não usar duplas negativas, pois podem ser ambígua: Ex. "Não foi possível não salvar o
arquivo"
o O sistema deve 'assumir a culpa' por erros: "comando ilegal" versus "comando não
reconhecido"
o Não use mensagens escritas em CAIXA ALTA, pois parece que se está gritando com o
usuário
o Use cautelosamente técnicas que chamam a atenção: evitar o excesso de uso de 'pisca',
sons e cores fortes
o Use cores apropriadamente e faça uso das expectativas: perigo = vermelho e ok = verde
o Considere as limitações de tempo: Não apresente uma mensagem rapidamente e/ou
peça uma confirmação se apropriado

Objetos de Interação

 Objetos de manipulação
 Objetos de seleção
 Objetos de apresentação

Objetos de Manipulação:

 Cursores dos dispositivos de entrada

 Recomendações

o Formatos diferenciáveis
o Funções padronizadas
o Quantidade limitada

Objetos de Seleção

 Estruturas de menus

o Compatível com as convenções empregadas para organização da tarefa

o Nome da opção deve estar associado ao nome da tarefa que o usuário conhece
o Agrupar opções em submenus
o Usar aceleradores (teclas de atalho para opções não necessariamente visíveis) e
mnemônicos (teclas de atalho para opções visíveis)
o Use o padrão "O que você vê é o que você recebe", what you see is what you get
(WYSIWYG)
 Barras de ferramentas
 Lista de seleção
 Grupos de seletores exclusivos (radio button)
 Grupos de seletores não exclusivos (check box)
  Grupos de botões de comando

Objetos para Apresentação: Apresentações estruturadas

 Listas
 Tabelas
 Gráficos
 Mensagens (orientar, avisar, ajudar, alertar, sinalizar erro)
 Textos

o Não há hifenização no final das linhas

o No máximo 60 caracteres por linha
o Espaçamento entre parágrafos
o Bordas implícitas ou explícitas
o Evitar textos em letras exclusivamente maiúsculas

Atributos de Objetos

 Atributos de Significado
 Nomes
 Ícones

o Símbolo (ex.: impressora)

o Emblema (ex.: bandeira)
o Atributo (ex.: garfo e faca)
o Arquétipo (ex.: histograma)
o Analogia (ex.: taça de cristal)

 Códigos: cores, formas, palavras, intermitência visual.

Atributos de Forma

 Cores como recurso estético

 Fontes (Com serifa vs. sem serifa)
 Bordas: Importantes na discriminação entre objetos e fundos
 Arranjo (leiaute) devem se preocupar em:

o Definir foco de atenção

o Dar equilíbrio às telas (simetria)
o Manter a consistência entre arranjos

Entrada de Dados Textuais

 Campos de dados textuais

o Usar rótulo adequado e explicitar o formato

o Linhas com espaço para no máximo 50 caracteres

 Fontes dos textos

o Fontes com serifa são usadas em textos longos

o Em títulos e rótulos curtos, deve-se empregar fontes sem serifa
Interfaces Web

 Foco no conteúdo
 Preocupação com a arquitetura da informação: entender a estrutura e a organização do site
 Preocupação com a navegação

o Como as pessoas se movem no site

o Como as pessoas descobrem o que há no site
o Como as pessoas descobrem onde estão

Dispositivos de Apontar

Dispositivos como:

 Mouse
 Caneta
 Joysticks
 Dedo, em sistemas touchscreen

Interfaces Ubíquas

A tecnologia está inserida no ambiente:

 os computadores não estão visíveis

 interagimos com eles sem pensarmos sobre eles
 “wearable technology” ou “tecnologias vestíveis”.

Interfaces Multimodais

 Permitem diversos tipos de interação. Diversas formas de entrada e de saída de dados, como
voz, gestos e apontadores;
 Combinação e coordenação;

Características:

 Aumentam a usabilidade: Eficácia e eficiência, e diversas formas de interação que são

complementares
 Aumenta a acessibilidade: diversas alternativas
 Exploram adequadamente os diversos sentidos dos seres humanos

RESUMO IHC – PARTE 05

As 8 regras de ouro de Shneiderman

Princípios de design: Informações de design derivadas de teorias.

Ex.: "Reconhecer em vez de Relembrar" é um princípio baseado em teorias sobre o funcionamento da
memória

Regras: Guias mais específicos sobre como tratar determinada situação.

Ex.: Regras de ouro de Shneiderman.

Guias de estilo: Coleção de regras e princípios usada para garantir a consistência em um conjunto de
aplicações.
Ex.: Aplicações com interface seguindo o estilo do Windows

Padrões: São acordos internacionais que governam o desenvolvimento do sistema

Ex.: ISO9241 (Ergonomia), ISO 13407 (Design centrado no usuário)
Regras de Ouro: Oito regras propostas por Ben Shneiderman em 1998

1) Perseguir a Consistência: seguir sempre o mesmo padrão.

2) Fornecer Atalhos: Os usuários podem acionar funções usando menus e atalho "teclas rápidas", ou
botões de função
3) Fornecer Feedbacks Informativos: Para cada ação do usuário, o sistema deve prover um feedback
informativo
4) Marcar o Final dos Diálogos: A sequência de ações e o fim devem ser bem definidos
5) Fornecer Prevenção de Erros e Forma Simples de Corrigi-los: A interface deve evitar que
usuários cometam erros. Como alguns erros são inevitáveis, o sistema deve:

 Ser indulgente com os erros

 Apoiar o usuário para retornar ao caminho correto

6) Permitir Reversão de Ações: Fornecer uma opção de "desfazer" sempre que possível
7) Fornecer Controle de Iniciativa do Usuário: Os usuários se sentem mais confortáveis quando
estão no controle da interação, em vez de o dispositivo estar no controle.
8) Reduzir a Carga de Memória de Trabalho:

 Oferecer aos usuários opções, em vez de pedir-lhes para lembrar de informações de uma tela
para outra
 Só apresentar informações necessárias
 Alocar tempo suficiente para o aprendizado de códigos e sequências de ações

RESUMO IHC – PARTE 6

Design em IHC

Por que design? Design visa a criação de artefatos

 Produtos artificiais
 Fruto da inteligência e do trabalho humano
 Construídos com um propósito em mente

Artefatos não surgem espontaneamente na natureza: alguém decide sua função, forma, estrutura e
qualidade, e o constrói com seu trabalho

Design de Sistemas Interativos

 Inserir um artefato numa situação do cotidiano representa uma intervenção sobre ela. Ele
influencia na situação e a situação influencia o seu uso.
 Um sistema interativo deve ter o propósito de apoiar os usuários a alcançarem seus objetivos.
Desde sua concepção e durante todo o seu desenvolvimento.
 A construção de sistemas interativos é um processo iterativo de análise, síntese e avaliação:
artefatos são coletados e produzidos.

Atividades Básicas: Análise  Síntese  Avaliação

 Análise da situação atual: Estudar e interpretar a situação atual

 Síntese de uma intervenção: Planejar e executar uma intervenção na situação atual
 Avaliação da nova situação: Verificar o efeito da intervenção, comparando a situação com a
nova situação
Proposta de Intervenção:

Tipos de Avaliação

Análise (avaliação formativa)

 Acontece antes da intervenção

 Influencia a proposta
 Auxilia o designer a formar e a refinar a intervenção

Avaliação somativa

 Acontece após a intervenção

 Visa testar os resultados da intervenção feita

Racionalismo Técnico

 Sistemas padronizados e configuráveis

 Paradigmas de interação: formas de enquadrá-los e implementá-los
 Inclui:

o Princípios (ex.: Gestalt, recomendações ergonômicas)

o Guias (ex.: componentes wimp)
o Regras (ex.: regras de ouro)
o Etc.

Reflexão em Ação
Conversa com Materiais

 Reflexão em ação é estimulada pela conversa com materiais

 O designer fala com a representação, expressando suas ideias para a solução sendo concebida

o “E se eu definir isso deste jeito”?

o “Posso utilizar essa mesma ideia em outro lugar”?
o "Isso não ficou bom, mas se eu tentar dessa outra forma"?

 Interagir com o modelo, obter resultados, tentar interpretálos, e então inventar novas estratégias

Conceber uma Solução

Geralmente requer uma equipe multidisciplinar de design que tenha as seguintes habilidades:

 Criatividade e capacidade de análise

 Capacidade de crítica e julgamento para decidir
 Capacidade de comunicação e negociação
 Conhecimento sobre as tecnologias disponíveis
 Conhecimento sobre valores e ideias dos envolvidos para projetar qualidades éticas
 Capacidade de apreciar e compor coisas agradáveis aos sentidos

Foco no Problema ou na Solução

Design dirigido pelo problema despende mais tempo analisando o problema, a situação atual e as
necessidades e as oportunidades de melhoria, e menos tempo explorando possíveis intervenções (as
soluções).

Design dirigido pela solução: inverte as prioridades de tempo dedicado pelo design dirigido ao
problema. Permite gerar resultados mais criativos.

Design Centrado no Usuário

Foco no usuário: Quem serão? Quais seus objetivos? Quais suas características físicas, cognitivas e
comportamentais?

Métricas observáveis: Experimentos (estudos empíricos) em que alguns usuários usem simulações ou
protótipos do sistema

Design iterativo: Quando problemas/dificuldades forem encontrados durante os experimentos com

usuários, eles deverão ser corrigidos

Design Participativo

A participação do usuário acontece ao longo do processo de design e desenvolvimento. Não é restrita

aos estágios de testes de protótipos ou avaliação.

Características específicas:

 Orientado ao contexto (trabalho)

 Envolve colaboração
 Abordagem iterativa
Processos de Design: Definição e organização das atividades de forma a gerar o produto desejado. Um
processo define:

 Como executar cada atividade

 A sequência em que elas devem ser executadas
 Quais atividades podem se repetir, e por quais motivos
 Os artefatos consumidos e produzidos em cada uma delas

Processo de Design Iterativo: Em processos de design de IHC, a execução das atividades se dá de

forma iterativa:

 Permitindo refinamentos sucessivos da análise da situação atual e da proposta de intervenção

 O designer pode aprender mais e melhor tanto sobre o problema a ser resolvido quanto sobre a
solução sendo concebida
 Ele amplia, refina ou reformula a sua proposta de intervenção

RESUMO IHC – PARTE 07

Processos de Design de Software para Uso por Humanos

Processos de Design de IHC

 Ciclo de Vida Simples

 Ciclo de Vida em Estrela
 Engenharia de Usabilidade de Nielsen
 Engenharia de Usabilidade de Mayhew
 Design Contextual
 Design Baseado em Cenários
 Design Dirigido por Objetivos
 Design Centrado na Comunicação

Ciclo de Vida Simples

Destaca a importância do design centrado no usuário, de avaliações da proposta de solução usando

versões interativas e da iteração entre as atividades.
Ciclo de Vida em Estrela

Engenharia de Usabilidade de Nielsen (Nielsen, 1998)

Atividades

1) Conheça o usuário
2) Realize uma análise competitiva
3) Defina as metas de usabilidade
4) Faça designs paralelos
5) Adote o design participativo
6) Faça o design coordenado da interface como um todo
7) Aplique diretrizes e análise heurística
8) Faça protótipos
9) Realize testes empíricos
10) Pratique design iterativo
11) Colete feedback do uso

Engenharia de Usabilidade de Mayhew

Três fases gerais:

1) Análise de requisitos: Definição de metas de usabilidade com base em modelos de tarefas, de

usuários e possibilidades/limitações da tecnologia. Geralmente metas representadas como guias de
estilo.
2) Design, Avaliação e Desenvolvimento: Conceber uma solução que atenda à metas; Três níveis
3) Instalação: Coletar opiniões depois de algum tempo de uso.

Design Contextual: Investigação minuciosa do contexto de uso, por meio das seguintes atividades

1) Investigação contextual
2) Modelagem do trabalho de cada usuário
3) Consolidação dos modelos de trabalho
4) Reprojeto do trabalho
5) Projeto do ambiente do usuário
6) Prototipação
7) Teste com usuários

Design baseado em Cenários

Utiliza diferentes tipos de cenários como representação durante das atividades. Um cenário é
“simplesmente uma história sobre pessoas executando uma atividade”
Cenário de:

 Atividade: tarefas típicas e críticas que os usuários vão executar com ajuda do sistema
 Informação: informações fornecidas pelo sistema ao usuário durante a interação
 Interação: ações do usuário e as respectivas respostas do sistema

Design Dirigido por Objetivos

Projetar uma solução criativa de IHC que apoie os usuários em atingirem seus objetivos

 Aplicar tecnologias existentes em contextos novos

 Oferecer maneiras mais criativas, inovadoras e eficientes de alcançarem seus objetivos

Exemplos:

 "Procurar uma cidade em um mapa impresso" vs "Procurar uma cidade no google maps ou
google earth
 "Se comunicar com amigos por meio de cartas" vs "Se comunicar com amigos por meio de uma
rede social"
 "Se informar por meio de um jornal impresso" vs "Se informar por meio de um site de notícias"

Na última etapa é necessário manter a coerência da solução proposta enquanto acomoda as limitações
técnicas previstas
Design Centrado na Comunicação

Tem como base teórica a Engenharia Semiótica: processo de comunicação entre o usuário e o designer
do sistema, através da sua interface;

Parte do pressuposto que se os designers conseguirem registrar a metacomunicação em um conjunto

de artefatos e comunicá-la aos membros da equipe, eles terão melhores condições de comunicá-la aos
usuários através da interface.

Integração de IHC e ES

Integração entre atividades de IHC e Engenharia de Software. As principais abordagens de integração

são:

1) Definição de características de um processo de desenvolvimento que se preocupa com a qualidade

de uso
2) Definição de processos de IHC paralelos que devem ser incorporados aos processos propostos pela
ES
3) Indicação de pontos em processos propostos pela ES em que atividades e métodos de IHC podem
ser inseridos
 JULGAMENTO DE FATOS

Nº FATOS V ou F
Pode-se afirmar que um típico ciclo de vida de artefatos
FATO 1 interativos contém pelo menos três atividades básicas:
análise, síntese e avaliação.

A avaliação formativa acontece após uma intervenção e visa

FATO 2
testar os resultados dela.

O Design Dirigido pelo Problema permite gerar resultados

mais criativos por despender mais tempo explorando
FATO 3
possíveis intervenções do que analisando a questão a ser
tratada.

De forma geral, o design participativo consiste em projetar

FATO 4
com os usuários em vez de projetar para os usuários.

A Engenharia de Usabilidade de MayHew determina a

FATO 5 condução das atividades de design paralelo, design
participativo e análise competitiva.

Na fase de projeto do Design baseado em Cenários, há três

FATO 6 tipos de cenários a serem considerados, que são: cenário de
atividade, cenário de informação e cenário de interação.
O Design Centrado na Comunicação define que pode-se
começar de qualquer atividade, exceto avaliação, mas após
FATO 7
a execução dessas atividades, deve-se realizar a atividade
de avaliação.

O ciclo de vida simples distingue as atividades de avaliação

FATO 8
somativa e avaliação formativa.

O Design dirigido a Objetivos foca em projetar soluções

FATO 9 criativas aplicando tecnologias existentes em novos
contextos.

Aplicar diretrizes e realizar análise heurística são

FATO 10
recomendações da Engenharia de Usabilidade de Nielsen.

O modelo do usuário é a forma como ele percebe o sistema;

FATO 11 o designer do sistema desempenha um papel importante na
geração desse modelo.

A Teoria da Ação considera a atuação humana pelos

FATO 12
elementos: atividade, ação e operação.

Pelas sensações das cores, tem-se que a cor azul descansa

FATO 13
e a cor verde desperta.
 O subsistema cognitivo, do modelo de processador humano,
FATO 14
é responsável por traduzir pensamentos em ações.

Princípios de Gestalt consideram a observação de um

FATO 15
conjunto de elementos e não de partes isoladas.

A memória de trabalho do ser humano é limitada a 5 ± 2

FATO 16
chunks.

O Design Centrado no Ser Humano é caracterizado por

FATO 17 envolver as pessoas no processo de design e projetar para a
diversidade.

O princípio gestáltico “destino comum” diz que traços

FATO 18 contínuos são percebidos mais prontamente do que
contornos que mudem de direção rapidamente.

De acordo com a Engenharia Cognitiva, sempre que há uma

FATO 19 dificuldade de avaliação, também há problemas de
mapeamento e dificuldade de controle.

Social Desirability é um viés cognitivo causado pelo fato de

FATO 20
que a racionalidade humana é limitada.

Toolbars são conjuntos de botões agrupados de acordo com

FATO 21
seus formatos gráficos.

Em ergonomia, comportamentos estruturados definem que a

interface deve se antecipar e reagir às reações dos usuários,
FATO 22 convidando-os, apoiando-os durante as ações e fornecendo-
lhes respostas adequadas quanto ao andamento e ao
resultado dessas ações.
A memória de longo prazo armazena o conhecimento de
FATO 23 longo prazo, por exemplo, aquele que o ser humano acumula
ao longo das interações com o sistema.

Lei de Hick-Hyman e Lei de Fitts são diferentes por que

FATO 24 estimam coisas diferentes: Lei de Hick-Hyman estima uma
distância e Lei de Fitts estima o tempo.

Escrever um livro envolve cognição reflexiva, enquanto ler

FATO 25
um livro envolve cognição experiencial.

A Teoria da Atividade define as noções de golfo de execução

FATO 26
e golfo da avaliação que são fundamentais em IHC.

Radiobuttons permitem que o usuário escolha uma opção em

FATO 27
um conjunto de opções mutuamente exclusivas.
 Fontes com serifa são usadas em textos longos; em rótulos
FATO 28
curtos, deve-se empregar fontes sem serifa.

O racionalismo técnico defende que o designer deve

FATO 29 enquadrar a situação atual num tipo geral de problema cuja
forma de solução seja conhecida.

Na base da Engenharia Cognitiva está uma discrepância

FATO 30 entre os objetivos dos usuários expressos psicologicamente
e os controles físicos que eles podem manipular.

A cognição distribuída trata a interação humano-computador

FATO 31 como um caso particular de comunicação humana mediada
por sistemas computacionais.

Na perspectiva da ergonomia, um feedback é um

FATO 32 comportamento elementar e um wizard é um comportamento
estruturado.

De acordo com a Engenharia Cognitiva, o modelo do usuário

FATO 33 é um modelo físico construído com base no modelo
conceitual de design do designer.

Sistemas de troca de mensagens entre usuários, como o

FATO 34 hangout, se enquadram na perspectiva de interação do tipo
sistema.

Em IHC, comunicabilidade está diretamente ligada à

FATO 35
interface e indiretamente ligada à interação.

Facebook é uma rede social, portanto, se enquadra na

FATO 36
perspectiva de interação usuário-sistema do tipo mídia.

IHC foca exclusivamente em sistemas computacionais

FATO 37
interativos para uso humano.

Sliders e scrollbar permitem que o usuário mantenha apenas

FATO 38
um subconjunto de itens no seu campo de visão.

Linguagem de comandos é um recurso utilizado nos

FATO 39 primeiros computadores e que entrou em desuso com o
desenvolvimento do paradigma WIMP.

O padrão "O que você vê é o que você tem", what you see is
FATO 40 what you get (WYSIWYG) é utilizado para alertar um usuário
de que ele realizou uma ação não suportada pelo sistema.