Interface Homem Mquina

Introduo

Vnia Cordeiro da Silva

Roteiro
Introduo
Interao H-M
Princpios
Princpios na Internet
Concluso

Introduo
Interfaces de usurios tm mudado a vida
de muitas pessoas: novas formas de
aprender, comunicar, trabalhar, descobrir e
viver comearam a ser pensadas
Visualizao cientfica: experimentos seguros
Simuladores: treinamento a baixo custo
Novas mdias para comunicao: correio
eletrnico, vdeo conferncia e www
Artistas grficos explorando possibilidades
criativas

Introduo
Interfaces tm mudado a
vidas pessoas (cont.):
Medicina:
Diagnsticos mais precisos
Robs cirurgies

Introduo
Interfaces de usurios tm mudado a vida
de muitas pessoas (cont.):
Biblioteca digital de imagens: aplicaes
meteorolgicas at a explorao do espao
Tecnologia educacional
Tutoriais on-line
Material de treinamento
Discusses em grupo
EAD
Apresentaes de vdeos
Crianas em ambientes de aprendizagem
E-books

Introduo
Tecnologia Educacional:
Acesso pblico a sites de museus e bibliotecas

Introduo
Tecnologia Educacional:
Fontes de informaes governamentais

Introduo
Para as mquinas se tornarem aceitas e
usadas precisam ser bem projetadas
Projeto e implementao de sistemas teis:
suprimento da funcionalidade que os usurios
necessitam
Projeto e implementao de sistemas usveis:
suprimento da funcionalidade que pode ser usada
com um grau de esforo moderado

Introduo
Usurios comuns esto cada vez mais em
contato com sistemas computacionais:
Popularizao da Internet: sistema bancrio,
lojas virtuais, servios pblicos, entretenimento,
comunicao, etc.
Popularizao de Equipamentos e Servios:
caixas eletrnicos,
mquinas de carto de
telefnico, telefonia
celular, etc.

Interao H-M
Desafio: o rpido desenvolvimento
tecnolgico
Mquinas mais rpidas e com maior poder de
processamento
Aplicaes multimdias: som, imagem, vdeo e
texto interligados
Telecomunicaes
Realidade virtual

Interao H-M
Exemplos clssicos:
VCR/DVD: pessoas colocam fitas, retrocedem,
avanam, iniciam e interrompem reproduo, mas
programas para gravar...
Telefonia: falar fcil, mas e o resto das
funcionalidades?
Carros: som, sistema da ventilao, vidros
eltricos, limpadores de pra-brisa, luzes e ainda
dirigir!
Em geral, as pessoas conseguem, por que?

Interao H-M
Objetivo: produzir sistemas usveis,
seguros e funcionais
Atributos de aceitabilidade:
Fcil de aprender e de lembrar
Eficiente e com poucos erros
Custo e compatibilidade
Necessidade e capacidade humanas
Etc...

Mas como conseguir?

Interao H-M
Ponto bsico: pessoas...
Ningum deve mudar para se adequar ao
sistema, o sistema deve ser projetado para se
adequar as pessoas

Cincia da computao insuficiente:

fatores multifacetados
Perspectiva multidisciplinar
Independente e interligados

Interao H-M
Principais disciplinas:
Uma equipe multidisciplinar significa muito mais
idias sendo geradas, novos mtodos sendo
desenvolvidos e designs mias criativos e originais
sendo produzidos

Interao H-M
Cincia da computao: computador
Melhor organizar a informao: entrada, busca e
sada de informao (visual)
Conhecimento sobre tecnologias e explorao de
seus potenciais
Implementao e manuteno de sistemas
Ferramentas de apoio aos profissionais das
outras disciplinas

Interao H-M
Psicologia:
Cognitiva, social e organizacional
Modelar o comportamento humano e processos
mentais (viso, audio, olfato...)
Capacidades e limitaes: estudo da ateno,
memria, percepo, aprendizagem, etc
Quantidade de informao memorizada e processada de
uma s vez

Predizer o desempenho humano no uso de

computadores
Influencia das mquinas na prtica do trabalho

Interao H-M
Engenharias:
Construo e testes empricos de modelos na
produo de artefatos
Novos projetos de teclados e dispositivos de apontamento
Monitores de alta resoluo e de toque

Equipamentos de E/S de voz e gestos

Novos materiais

Interao H-M
Lingstica: estudo cientfico da
linguagem
Linguagem natural: facilitar a consulta e
acesso a BD
Linguagem no textual
Aspectos culturais: textos, datas, cones

Interao H-M
Fatores Humanos/Ergonomia:
Aplicao

de
conhecimentos
sobre
caractersticas humanas, visando o projeto dos
aspectos fsicos dos sistemas e equipamentos
(interface com o usurio)
Cincia aplicada relativa s caractersticas de
indivduos a serem consideradas no projeto e
estruturao de artefatos por eles utilizados, de
modo a prover uma interao mais efetiva e
segura

Interao H-M
Fatores Humanos/Ergonomia (cont.):
Gerao de produtos interativos
Desenvolvido na segunda grande guerra
Ergonomia na Europa
Fatores Humanos nos EUA

Conforto e satisfao dos usurios

Posio do vdeo, descanso de punho, etc.

Efeitos fisiolgicos: forma da apresentao da

informao no vdeo
Capacidade de memorizao
Capacidade fsicas e mentais

Interao H-M
Filosofia, antropologia e sociologia
Aplicadas no projeto e avaliao de IHM
No modela, faz anlise por observao
Interaes entre tecnologia, trabalho e
organizao

Interao H-M
Reunir pessoas com treinamentos e
formaes diferentes significa mais idias
geradas, novos mtodos desenvolvidos e
projetos mais criativos e originais
Algo que uma pessoa considere importante outras
podem nem enxergar

Fatores negativo:
Custos envolvidos
Pessoas trabalhando juntas mas no formam um
time

Interao H-M
Projetos de interface so um grande negcio
Web:altamente competitiva
Nmero de acessos, ndice de retorno do consumidor e sua
satisfao so afetados pela usabilidade

preciso destacar-se!!!!
Medir usabilidade: retorno a respeito de que mudanas
devem ser feitas , quais requisitos no foram preenchidos...

Abordagem centrada no usurio: entender como as pessoas

realizam as tarefas

Interao H-M
Metas de usabilidade:
Eficcia: auxilia os usurio em suas tarefas
Produz o resultado esperado

Eficincia: bom no que se prope

Tempo para completar uma tarefa: rpido

Segurana: proteger o usurio de situaes

perigosas e/ou indesejveis
Prevenir erros

Interao H-M
Metas de usabilidade (cont.):
Utilidade: quantidade de funcionalidade correta
oferecida
Precisa ou deseja realizar tal tarefa

Capacidade de aprendizagem: fcil de usar

Capacidade de memorizao: lembrar como usar
depois de aprender a usar

Interao H-M
Como garantir?
Avaliao:
Observando os usurios
Conversando com eles

Entrevistando-os
Pedindo que preencham questionrios
Usando mtricas e mtodos

Tal conhecimento auxilia os projetistas a determinar

quais solues escolher dentre as alternativas
disponveis

Vamos pensar um pouco...

Quanto tempo voc acha que deveria levar
para aprender as tarefas:
Utilizar um DVD/VCR para reproduo de filme?
Imediatamente se no tiver que selecionar canal

E para programar a gravao de 2 programas?

80% da populao americana no consegue realizar esta
tarefa

Princpios
Eixos-chaves:
Abordagens

de Projeto:

Consideraes

de fatores humanos, diretrizes para projeto

grfico, engenharia de software, anlise da tarefa
Tcnicas

e Ferramentas de Implementao

Tcnicas de prototipagem, caixas de ferramentas de dilogo,

mtodos orientados a objetos, representao de dados
Tcnicas

de Avaliao

Anlise de desempenho, teste de usabilidade, sondagem da

satisfao, inspeo de conformidade de produtos a padres,
heursticas, guias de estilo

Princpios
Princpios de usabilidade: sugerem aos
projetistas o que utilizar e o que no utilizar e o
que evitar numa
interface
Visibilidade
Affordance
Consistncia
Bons mapeamentos
Feedbacks

Princpios
Visibilidade:
mapeamento
entre
pretendidas e aes reais e distino
Exemplos:
Vasilha de sal diferente da de aucar
Portas de puxar, empurrar e
deslizar
Carro: operaes claramente
visveis

Quanto mais visveis as

funes, mais os usurios
sabero como proceder,
erraro menos

aes

Princpios
Visibilidade (cont.): dicas de como usar
Objetos que necessitam rtulos e explicaes
Mapeamento direto entre cone e conector utilizando cor e

rtulos grficos

Princpios
Visibilidade: apenas as coisas necessrias
devem estar visveis, para indicar quais partes
devem ser operadas e como
Desativar opes sombreando-as

Princpios
Affordance: atributo do objeto que permite as
pessoas perceberem como pode ser usado
Ideal: usurio deve saber o que fazer s de olhar
para o objeto, sem necessidade de elementos
adicionais

Princpios
Bom mapeamento: controles e efeitos
Tesoura: mapeamento entre buracos e dedos
Relgio digital (com 4 botes, por exemplo):

nenhum mapeamento aparente

Complexidade de sistemas computacionais:
necessidade de bom mapeamento bvia
Carro: volante movimentado para direita, carro
move-se para a direita
Analogias fsicas e padres culturais

Princpios
Bons mapeamentos:

Princpios
Consistncia: funcionalidades semelhantes,
operaes semelhantes
Mais fceis de usar e aprender
Clicar sempre com boto esquerdo do mouse

Princpios
Consistncia (cont.): diminui possibilidade de
erros
Telefones e controles
remotos

Calculadoras e
teclados numricos
7

3
6

1
0

4
7

Princpios
Consistncia (cont.): problemtico para
interfaces complexas (muitas operaes)
Criao de categorias de comandos que podem ser

mapeados em subconjuntos de operaes

Categorizados em subconjuntos de menus
Selecionar uma operao implica em dirigir-se a categoria

correta de opes (menu) e procurar a operao desejada ao

invs de procura-la numa longa lista

Princpios
Feedback: retorno de informaes sobre
aes feitas e resultados obtidos
Falar sem ouvir a prpria voz
Telefones analgicos e impressoras: pssimos

feedbacks

Princpios
Feedback: mecanismos udios, tteis,
visuais e combinao
dos mesmos
Relgios
Ampulhetas
Indicadores
Unidade de lote
Tipo manmetro
Tipo cursor
Termmetro
Regressivo/Progressivo
Barras de progresso

Princpios
Usabilidade de sistemas computacionais:
O usurio tem um grande potencial para mal

interpretar os elementos da sua interface

Usurio est sempre certo (sem extremos): refaa,
voc no o usurio
Customizao: facilita usabilidade, dificulta ajudas
Agradar a diferente tipos de usurios: de novatos a
especilaistas
Atalhos/aceleradores?

Um bom help ajuda

Fcil recuperao ao ocorrerem erros

Princpios na Internet
Internet est crescendo sem parar
Em 1998 cerca de 3 bilhes de dlares
deixaram de ser ganhos na web norteamericana por problemas de interface
Todos os perfis de usurios
Concorrncia: mais de 100 milhes de sites
em 2002

Princpios na Internet
Produtos: paga-se antes e experimenta-se
a usabilidade depois
Internet: experimentao primeiro
Concluso: interface fundamental!!!!!!!
Trade-off entre uso da tecnologia disponvel

e usabilidade

Princpios na Internet
Um exemplo: IBM (1999)
Recursos mais utilizados: busca e ajuda
Amplo processo de redesenho: centenas de

pessoas e milhares de dlares

Resultado: na primeira semana o boto de ajuda

caiu 84% e as vendas aumentaram 400%

Princpios na Internet
Clareza na arquitetura da informao:
Dividindo em prioritrio e secundrio
Mapas de sites: onde esto e para onde vo

Facilidade de navegao:
Mxima: usurio conseguir acessar a informao

em 3 cliques, no mximo

Princpios na Internet
Simplicidade: pirotecnia deve ser evitada
Mas sem exageros...
Fontes comuns: no se sabe as fontes instaladas
Tempo de carga necesssariamente curto: entre

10 e 15 segundos

Consistncia: experincia anterior

Websites devem ter um nico projeto de interface

Princpios na Internet
Interface internacional: usadas em mais de
um pas
Mais que traduo: necessidades e cultura do

outro pas

Internacionalizao: nico projeto

Localizao: adaptao para um
especfico

local

Interao H-M

Iniciar o navegador Internet Explorer.lnk

Princpios na Internet
Smbolos de semelhana: cones
Impressora para imprimir
Tesoura para cortar

Smbolos de referncia
Lupa para zoom
Disquete para salvar

Smbolos arbitrrios: por conveno

? para dvidas
Sinais de trnsito

Erros mais Comuns

Segundo Jakob Nielsen
No exibir preo de produtos
Rolagem de tela na horizontal
Grandes blocos de texto: escrever pra leitura online e no impresso
Janelas pop-up
Inserir links de e-mail em lugares no esperados

Sites orientados a modismos

Concluso
IHM: parte do sistema que expande a
autonomia do usurio
IntermultidisciplinaridadedeIHM
Princpios para um bom projeto de IHM
Nada impede a livre navegao: existem
milhes de pginas pra visitar
A seguir: aprofundamento...

Atividade 1
Entregar por manuscrito na prxima tera
Atividade em dupla