Você está na página 1de 46

IHC

Interação Humano-Computador
aula 01
aula 01
IHC Objetivos do Curso

 Apresentar aos participantes os conceitos teóricos envolvendo a


disciplina de Interação Humano-Computador

 Capacitar os participantes no projeto e avaliação de interfaces


segundo critérios preconizados pela disciplina de Interação Humano-
Computador

Ciência da Computação 2 Interação Humano-Computador


IHC Estrutura do Curso

 Introdução
 Definição e histórico. Classificação de IHC.
 Dispositivos gráficos de entrada e saída.
 Conceitos Básicos de IHC:
 Percepção humana, gestalt, formas. Ilusões.
 Teoria das cores. Textos e mensagens. Composição.
 Elementos de IHC
 Modelo gráfico de interfaces
 Teorias de Interação
 GIMP
 Projeto de Interfaces
 Casos de uso
 Critérios de Usabilidade e Qualidade de Interfaces
 Avaliação de Interfaces

Ciência da Computação 3 Interação Humano-Computador


IHC Introdução

 Antes de mais nada...

IHC não se restringe ao projeto de interfaces !

Ciência da Computação 4 Interação Humano-Computador


IHC Introdução

 “IHC se preocupa com o design, implementação e avaliação de


sistemas computacionais interativos e com o estudo dos fenômenos
que os envolvem”
(ACM SIGCHI, 1992)

 “Desenvolver ou melhorar a segurança, utilidade, efetividade,


eficiência e usabilidade de sistemas que incluem o computador”
(Interacting with Computers, 1989)

Ciência da Computação 5 Interação Humano-Computador


IHC Introdução

 IHC lida com

Design

Implementação

Avaliação

de sistemas interativos para utilização por humanos

Ciência da Computação 6 Interação Humano-Computador


IHC Elementos de IHC

 Em IHC:

Sistema = Computador (software e hardware) + humanos +


contexto de uso

Ciência da Computação 7 Interação Humano-Computador


IHC Elementos de IHC

 Humanos
 São os usuários que demandam alguma tarefa

 Computador
 Dispositivo com capacidade de processamento de dados

 Interação
 O usuário diz ao computador o que fazer e o computador
comunica o resultado

Ciência da Computação 8 Interação Humano-Computador


IHC Por que se preocupar com IHC ?

 Capacidade computacional

Ciência da Computação 9 Interação Humano-Computador


IHC Por que se preocupar com IHC ?

 Capacidade humana

Ciência da Computação 10 Interação Humano-Computador


IHC Por que se preocupar com IHC ?

 A capacidade computacional, de certa forma, “amplia” a capacidade


humana:
 Execução de tarefas complexas em curto espaço de tempo
 Amplia a capacidade de comunicação
 Apoio à tomada de decisão
 ...

 Entretanto, se essa interação não é projetada de forma adequada:


 Os objetivos do sistema podem não ser atendidos plenamente
 Em alguns casos o uso do sistema pode até ser contraproducente

 Exemplo no sistema bancário:


 Caixas humanos
 Caixas eletrônicos
 Internet banking

Ciência da Computação 11 Interação Humano-Computador


IHC Por que se preocupar com IHC ?

 Assim, interfaces de baixa qualidade:


 Requerem treinamento excessivo, aumentando o custo
 Desmotivam a exploração
 Confundem os usuários
 Induzem os usuários ao erro
 Geram insatisfação
 Diminuem a produtividade
 Não trazem o retorno de investimento previsto

Ciência da Computação 12 Interação Humano-Computador


IHC Interface com o Usuário

 Interface com o usuário:

 Parte do software que permite ao usuário interagir com o


computador e executar sua tarefa.

 Tradicionalmente, considera-se que uma interface homem-


máquina é a parte de um artefato que permite a um usuário
controlar e avaliar o funcionamento deste artefato através de
dispositivos sensíveis às suas ações (dispositivos de entrada) e
capazes de estimular sua percepção (dispositivos de saída).

 No processo de interação usuário-sistema a interface é a


combinação de software e hardware necessária para viabilizar e
facilitar os processos de comunicação entre o usuário e a
aplicação.

Ciência da Computação 13 Interação Humano-Computador


IHC Interface com o Usuário

 Como as interfaces humano-computador são os elementos que


viabilizam a interação, é preciso entender as interações para projetar
essas interfaces.

Ciência da Computação 14 Interação Humano-Computador


IHC Interface com o Usuário

 Fatores que influenciam o projeto da interface:

 Tecnológicos:
 Uso de mouse, comandos de voz, touch screen, etc.

 Culturais:
 Convenções, sinais, cores, etc.

 Impacto nos usuários:


 Facilitar o aprendizado
 Evitar erros
 Quantidade de treinamento necessário
 ...

Ciência da Computação 15 Interação Humano-Computador


IHC Interface com o Usuário

 Fatores que influenciam o projeto da interface:

 Contexto de uso do sistema:

 Exemplo 1: sistemas críticos como controle de tráfico aéreo,


reatores nucleares, operações militares, etc. (alto custo)
 Confiabilidade e efetividade;
 Eficiência de uso;
 Grande quantidade de treinamento é aceitável em prol da
ausência de erros de operação;
 Satisfação subjetiva menos valorizada;
 Memorização é obtida a partir do uso freqüente;

Ciência da Computação 16 Interação Humano-Computador


IHC Interface com o Usuário

 Fatores que influenciam o projeto da interface:

 Contexto de uso do sistema:

 Exemplo 2: sistemas comerciais ou industriais como sistemas de


bancos, seguradoras, reserva aérea, aluguel de carros,
gerenciamento de cartão de crédito, etc. (custo é fundamental)
 Treinamento é caro;
 Facilidade de aprendizagem é fundamental;
 Alto desempenho pode ser fundamental;
 Satisfação subjetiva tem importância modesta;
 Memorização obtida a partir do uso freqüente

Ciência da Computação 17 Interação Humano-Computador


IHC Interface com o Usuário

 Fatores que influenciam o projeto da interface:

 Contexto de uso do sistema:

 Exemplo 3: sistemas de uso doméstico como aplicações de


escritório, domésticas e de entretenimento, processadores de
texto, jogos, softwares educacionais, etc. (custo baixo é muito
relevante)
 Facilidade de aprendizagem;
 Baixa taxa de erros de operação e satisfação subjetiva são
fundamentais;
 Assistência online é importante;
 Rememorar também é relevante.

Ciência da Computação 18 Interação Humano-Computador


IHC Interface com o Usuário

 Fatores que influenciam o projeto da interface:

 Contexto de uso do sistema:

 Exemplo 4: sistemas exploratórios, cooperativos e criativos como


enciclopédias eletrônicas, escrita cooperativa, tomada de
decisão, simulação científica, sistemas para composição musical,
diagnóstico médico, apoio a projetos de arquitetura, etc.
 Usuários peritos no domínio e não em computadores;
 Usuário se preocupa somente com a tarefa;
 Objetivo principal: deixar o computador transparente para o
usuário.

Ciência da Computação 19 Interação Humano-Computador


IHC Interface com o Usuário

 Lembre-se: o projeto da interface faz parte do projeto do software


e, portanto, está sujeito a limitações de cronograma, recursos
humanos, recursos financeiros, etc.

 Muitas vezes as necessidades em termos de interface são


conflitantes com esses limitadores.

 O desafio está em negociar esses limites e projetar a melhor


interface possível dentro dos limites estabelecidos para o projeto.

Ciência da Computação 20 Interação Humano-Computador


IHC Por que investir em IHC ?

 Visão de negócio:

 Tornar as pessoas mais produtivas ou eficientes.

 Custos com pessoas são maiores que custos com


hardware e software.

Ciência da Computação 21 Interação Humano-Computador


IHC Por que investir em IHC ?

 Visão pessoal

 As pessoas vêem os computadores como


“utilitários” e querem que se comportem como tal

Ciência da Computação 22 Interação Humano-Computador


IHC Por que investir em IHC ?

 Visão de mercado:

 Pessoas médias usam computadores:


 Esperam sistemas “fáceis de usar”
 Não toleram sistemas mal projetados
 Não recebem treinamento
 Grupo heterogêneo

 Se o produto for difícil de usar, as pessoas


buscarão outros produtos. Exemplos:
 Mac x PC
 Apple x Microsoft

Ciência da Computação 23 Interação Humano-Computador


IHC Por que investir em IHC ?

 Visão de sistemas:

 Humanos: complexo

 Computador: complexo

 Interface entre os dois: complexa

Ciência da Computação 24 Interação Humano-Computador


IHC Por que investir em IHC ?

 Visão de fatores humanos:

 Humanos tem limitações.

 Erros são custosos em termos de:


 Perda de tempo
 Perda de dinheiro
 Perda de vidas (em sistemas críticos)
 Perda de confiança

 Design da interface pode lidar com estas limitações!

Ciência da Computação 25 Interação Humano-Computador


IHC Disciplina de IHC

 A disciplina de IHC envolve:

Ciência da Computação 26 Interação Humano-Computador


IHC Disciplina de IHC

 Uso e Contexto:

 Sinergia e adaptação entre o homem e o computador:

 Entendimento da organização social e trabalho

 Entendimento das características do domínio da aplicação

 Aumentar a sinergia entre o computador e sua utilização:


 Como usuários improvisam sua rotina
 Como sistemas se adaptam ao usuário (customização)
 Como os usuários se adaptam ao sistema (treinamento,
facilidade de aprendizado)
 Guias para o usuário (ajuda, documentação, tratamento
de erros)

Ciência da Computação 27 Interação Humano-Computador


IHC Disciplina de IHC

 Características humanas:

 Estudar o homem como um sistema de informações, como ele se


comunica e seus requisitos físicos e psicológicos:

 Processamento de informações humano:


 Características do homem como processador de informações:
memória, percepção, habilidades motoras, atenção, resolução de
problemas, aprendizado e aquisição de habilidades, motivação, etc.

Ciência da Computação 28 Interação Humano-Computador


IHC Disciplina de IHC

 Características humanas:

 Estudar o homem como um sistema de informações, como ele se


comunica e seus requisitos físicos e psicológicos:

 Linguagem de comunicação e interação:


 Aspectos de linguagem:
 Sintaxe, semântica, pragmática, interação conversacional,
linguagens especializadas

 Ergonomia:
 Características das pessoas e sua relação com a área de
trabalho e o ambiente:
 Organização de displays e controles, limites cognitivos e
sensoriais, fadiga e saúde, mobiliário e iluminação, design para
ambientes perigosos ou estressantes, design para pessoas com
limitações físicas, etc.

Ciência da Computação 29 Interação Humano-Computador


IHC Disciplina de IHC

 Características computacionais:

 Estudar os componentes específicos através dos quais o computador


interage com os usuários:

 Dispositivos de entrada e saída:


 Mecânica e características de dispositivos de hardware,
desempenho, dispositivos virtuais, etc.

 Técnicas de diálogo:
 Técnicas básicas de software para interação com humanos:
 Ex: diálogos de entrada e saída, estilos de interação

Ciência da Computação 30 Interação Humano-Computador


IHC Disciplina de IHC

 Características computacionais:

 Estudar os componentes específicos através dos quais o computador


interage com os usuários:

 Computação gráfica:
 Conceitos básicos de computação gráfica são úteis para IHC

 Arquitetura de diálogo:
 Arquitetura de software e padrões de interface:
 Ex: geração de imagens em tela, gerenciadores de janelas,
toolkits de interface, arquiteturas multi-usuário, look and feel,
padronização e interoperabilidade.

Ciência da Computação 31 Interação Humano-Computador


IHC Disciplina de IHC

 Processo de desenvolvimento:

 Construção e avaliação de interfaces HC:

 Abordagens de design:
 Ex: fundamentos de design gráfico (tipografia, cor, etc.),
engenharia de software, análise de tarefas, design industrial, etc.

 Técnicas e ferramentas de implementação:


 Ex: prototipação, toolkits de diálogo, métodos OO , representação
de dados e algoritmos

Ciência da Computação 32 Interação Humano-Computador


IHC Disciplina de IHC

 Processo de desenvolvimento:

 Construção e avaliação de interfaces HC:

 Técnicas e métodos de avaliação:


 Ex: produtividade, testes de usabilidade, técnicas de inspeção de
interface

 Sistemas de exemplo e estudos de caso:


 Designs clássicos que servem como exemplos de estilos de
interface com o usuário

Ciência da Computação 33 Interação Humano-Computador


IHC Fundamentos de Projetos de IHC

 Entender o usuário e suas tarefas:


 Projetar a interface a partir das tarefas do usuário (projeto
baseado em tarefas)
 Desenvolver tarefas-exemplo
 Avaliar designs através de um passo a passo centrado na tarefa

 Projetar junto com o usuário:


 Projeto e prototipação centrados no usuário:
 Métodos para projetar junto com os usuários
 Prototipação de baixa e média fidelidade

 Avaliação de interfaces com o usuário:


 O papel da avaliação no design de interface
 Como observar usuários utilizando sistemas para detectar
problemas de interface

Ciência da Computação 34 Interação Humano-Computador


IHC Fundamentos de Projetos de IHC

 Projeto de interfaces visuais:


 “Design of everyday things”
 O que faz com que o design da interface funcione?

 Além do projeto de tela


 Representações e metáforas

 Design de telas gráficas


 Posicionamento de componentes de interface em uma tela

 Princípios de design:
 Princípios, regras e heurísticas de usabilidade para projetar e
descobrir problemas de usabilidade

Ciência da Computação 35 Interação Humano-Computador


IHC Fundamentos de Projetos de IHC

 Evolução das interfaces :


 Interface de Linha de comando
 Interface Caracter
 Interface Gráfica (GUI)
 Interface Natural (NUI)

Ciência da Computação 36 Interação Humano-Computador


IHC Fundamentos de Projetos de IHC

 Interface de Linha de comando


• São implementadas pela entrada de comandos linha a linha (como no DOS).

• Requer que os usuários aprendam a sintaxe correta de muitos comandos.

• As sequências das ações não são padronizadas e geram muitas repetições.

• O computador controla a maneira como os usuários trabalham. Induz o


usuário a fornecer informação apenas quando o aplicativo precisa.

• As aplicações são escritas para refletir a ordem na qual o programa


necessita da informação e não a ordem de tarefas desejada pelo usuário.

• Assim para resolver um pequeno problema, com poucos comandos,


acabava-se com um maior, que é entender o programa.

• O operador era direcionado pela máquina. Não estava no controle do


diálogo H-M.

• Exemplos: DOS (monousuário) e Unix (sem X-Windows; multiusuário).

Ciência da Computação 37 Interação Humano-Computador


IHC Fundamentos de Projetos de IHC

 Interface de Linha de comando


• Sessão Telnet - Unix

Ciência da Computação 38 Interação Humano-Computador


IHC Fundamentos de Projetos de IHC

 Interface de Linha de comando


• Cartão perfurado

Ciência da Computação 39 Interação Humano-Computador


IHC Fundamentos de Projetos de IHC

 Interface Caracter
 Envolvem apenas o uso de caracteres

o valendo-se somente do teclado


o sem botões
o sem imagens
o sem ícones
 A comunicação H-M é realizada por:

o Telas de Menu: onde o usuário digita o caracter (ou comando abreviado) de


uma lista;

o Full Screen: mostra uma série de campos para serem preenchidos por
informação textual;

o Teclas de funções: selecionam o modelo de tela a ser utilizado.

Ciência da Computação 40 Interação Humano-Computador


IHC Fundamentos de Projetos de IHC

 Interface Caracter.
• Estilo de interação por menus - conjunto de opções apresentados na tela

• A implementação de uma interface caracter podia se realizar de várias


maneiras. Era comum o uso de telas definidas por uma linguagem de tags
(marcadores < >, / : \).

o Foi uma das origens da linguagem de marcação HTML da WWW.

• Dá ao usuário uma direção da interação com o software;

• Explica a sintaxe necessária;

• Porém, o computador ainda dita a maneira como o usuário deve trabalhar.

Exemplos: videotexto, XTreeGold e Help DOS.

Ciência da Computação 41 Interação Humano-Computador


IHC Fundamentos de Projetos de IHC

 Interface Caracter – Exemplo: Sessão Help do DOS

Ciência da Computação 42 Interação Humano-Computador


IHC Fundamentos de Projetos de IHC

• Interface Gráfica (GUI)


 Para realizar a comunicação H-M usam propriedades táteis, propriedades
visuais, contraste, imagens, Cores e fontes.

 Estilo de interação WIMP (Janelas, Icones, Menus e Ponteiros)

 1ª Geração:
 O usuário pode usar o mouse para navegar.
 Os arquivos ficam visíveis o tempo que o usuário quiser.
 Há caixas de diálogo para a interação.
 Os usuários controlam as tarefas.
 Sem acesso ao Help
 Exemplo: Windows 1.0 e 2.0, Edit do DOS

Ciência da Computação 43 Interação Humano-Computador


IHC Fundamentos de Projetos de IHC

• Interface Gráfica (GUI)

 2ª Geração:

 O Help está acessível.


 As aplicações são representadas por ícones.
 Há interação com janelas múltiplas.
 Efeitos 3D dão retorno do estado dos controles.
 Excesso de janelas abertas confundem o usuário.
 Utilização do duplo clique.
• 3ª Geração

 Armazenamento de documentos e arquivos no desktop.


 Help fácil de ser obtido e sensível ao contexto.
 As aplicações abertas estão sempre visíveis.

Ciência da Computação 44 Interação Humano-Computador


IHC Fundamentos de Projetos de IHC

• A interface gráfica atual mais utilizada é o Windows, que utiliza a metáfora


da mesa de trabalho (desktop).

• Sua evolução está tendendo para algo semelhante a um browser da


Internet.

• No Windows há janelas e num browser há frames, onde programas


diferentes são executados.

• Problemas da interface gráfica do Windows:

 significado dos ícones (alguns símbolos com difícil tradução);


 perda fácil das janelas que se sobrepõem;
 não compreensão da hierarquia dos arquivos;
 não saber quando dar um duplo clique;
 convivência de cursores de texto e ponteiros de mouse simultâneos.

Ciência da Computação 45 Interação Humano-Computador


IHC Fundamentos de Projetos de IHC

 Interface Natural (NUI)


 Evolução das interfaces atuais.
 Mais intuitiva e de fácil aprendizado.
 Explora novos dispositivos gráficos de entrada e saída, em
especial dispositivos touch screen, reconhecimento de gestos e
voz, etc.
 Próximos passos: Interface Orgânica com o usuário (OUI –
Organic User Interface).

Ciência da Computação 46 Interação Humano-Computador