Intro Duca Oi HC

Multimdia e Interface Usurio - Mquina
Profa. Cristina Paludo Santos

Slides baseados no livro: Design e Avaliao de Interfaces Humano Computador (Helosa Vieira da Rocha/M.Ceclia C. Baranauskas). Material adaptado.
Cincia da Computao/ Sistemas de Informao
Sumrio
Introduo Objetivos Princpios bsicos de um bom design Slogans de Usabilidade Avaliao de interfaces
IHC
Introduo
- Contextualizao - Importncia -Conceitos -Exemplos
Objetivos
Princpios de um Bom Design

Visibilidade
Avaliaes de interfaces - Observao

- Verbalizao - Heursticas
- Sistemas teis - Sistemas Seguros - Sistemas Funcionais
Affordance Bom modelo conceitual

- Restries fsicas
Aceitabilidade de Sistemas
- Restries lgicas - Restries culturais
Bons mapeamentos
-
Aceitabilidade Social
Aceitabilidade Prtica
Relaes entre controle e seus movimentos e o resultado no mundo
Feedback
Custo
Utilidade
Compatibilidade
Confiabilidade
Funcionalidade
Usabilidade
Facilidade de aprendizagem
Eficincia
Facilidade de relembrar
Erros
Satisfao subjetiva
INTERATIVIDADE
Quais so os produtos interativos que voc utiliza em um dia normal?
PENSE UM MINUTO!
O PAPEL DA INTERFACE
Prover a interao entre pessoas e sistemas
O sistema a Interface
Interface
usurio
Funcionalidades
INTERFACES AMIGVEIS?
INTERFACES AMIGVEIS?
ACESSIBILIDADE
(Declarao dos Direitos Humanos)
Exemplos de interfaces mal projetadas

(problemticas)
EXEMPLOS DE INTERFACES PROBLEMTICAS
Como ajustar o relgio?
Como ajustar cadeiras?

1 - Situao : Ajustar a altura da cadeira
O usurio tenta abaixar ou levantar a cadeira enquanto est sentado, mexendo na alavanca. Problema: o usurio puxa e empurra a alavanca porm a cadeira no se move.
Para se abaixar a cadeira, deve-se levantar a alavanca e a cadeira ao mesmo tempo e depois empurr-la.
Para levantar a cadeira, deve-se puxar com fora o assento, segurando com o p as rodas da cadeira.

Mquina de caf expresso
sem instrues de uso em restaurante universitrio

M disposio dos menus Falta de indicao da sada
do caf
Quando devo colocar as moedas? Como funcionam os menus? De que torneira sair o caf? Devo observar outra pessoa fazendo antes?
EXEMPLOS DE INTERFACES PROBLEMTICAS A Mquina da Tess

Esta mquina aparentemente inofensiva possui o pssimo hbito de assaltar as pessoas que nela colocam seu dinheiro pensando que, em troca, recebero um carto com crdito para seu celular. Isso acontece toda vez que algum coloca nela o seu dinheiro e no existem mais cartes disponveis na mquina. S depois ela avisa que no existem mais cartes com o nmero de unidades que voc deseja. No existem quaisquer instrues de como recuperar o dinheiro.
O CRIME
EXEMPLOS DE INTERFACES PROBLEMTICAS O Problema A Soluo

Devolver Dinheiro
@#!
OU Primeiro escolher opo...
...depois colocar dinheiro.
ANTES
DEPOIS
Remoo da tampa
Fatores Tampa extremamente rgida e de difcil remoo;
Nenhuma estrutura auxiliar para ajudar a remoo da tampa.
Erros esperados A pessoa precisar, obrigatoriamente utilizar de um instrumento cortante, como uma faca - que no foi desenhada especificamente para este tipo de uso, podendo ocasionar acidentes;
Dependendo do instrumento utilizado, pode-se
contaminar a gua
10

Colocao do galo no bebedouro
Fatores

Peso elevado do galo; Tampa necessariamente aberta antes da colocao.
Erros esperados
praticamente impossvel virar o galo com sua tampa aberta e seu peso sem deixar a gua cair; No raro a pessoa deixar o galo cair neste momento, fazendo aquela aguaceira quando o galo explode no cho.
11
Uma interface ruim ineficiente e confusa
Uma interface ruim no confivel

Tudo bem?
Ou tudo mal?
12
Uma interface ruim tira o controle do usurio

Tarefa: Encontrar um liquidificador
13
O ADVENTO DE UMA NOVA COMPUTAO
14
Louvre (Frana)
15
REALIDADE AUMENTADA
16
HOLOGRAFIA
DESAFIOS DE IHM/IHC
Como dar conta da rpida evoluo tecnolgica? Como garantir que os design ofeream uma boa
IHM/IHC ao mesmo tempo que exploram o potencial e funcionalidade da nova tecnologia?
17
DESAFIOS DE IHM/IHC
O que se quer?
INTERFACE
No se pode pensar em interfaces sem considerar o ser humano que vai us-la, e portanto interface e interao so conceitos que no podem ser estabelecidos ou analisados independentemente. A primeira preocupao dos designers de interface deve ser a de melhorar o modo como as pessoas podem usar o computador para pensar e comunicar, observar e decidir, calcular e simular, discutir e projetar.
ROCHA e BARANAUSKAS, 2003
18
IHC - Conceito
IHC a disciplina preocupada com o design, avaliao e implementao de sistemas computacionais interativos para uso humano e com o estudo dos principais fenmenos ao redor deles.
ROCHA e BARANAUSKAS, 2003
PROFISSIONAIS QUE CONTRIBUEM PARA O ADVENTO DE NOVAS TECNOLOGIAS

Designers de Software explorando as melhores maneiras de se organizar as informaes. Desenvolvendo linguagens de consulta e facilidades visuais para a entrada, busca e sada de informaes. Utilizando, sons, representaes tridimensionais, animao e vdeo para melhorar o contedo e a expresso das interfaces. Tcnicas como a manipulao direta, telepresena, realidade virtual mudam a maneira de interagir e de prensar sobre computadores. Desenvolvedores de Hardware criao de novos designs de teclados, dispositivos de apontamento, displays de alta resoluo. Projetando sistemas com resposta rpida para complexas manipulaes tridimensionais. Tecnologias que permitem entrada e sada por voz, entrada por gestos, telas de toque, as quais tem aumentado muito a facilidade e o uso de computadores. Desenvolvedores na rea de tecnologia educacional criando tutoriais online e materiais de treinamento e explorando novas abordagens de discusses em grupo, ensino a distancia, apresentaes em vdeo etc...
19
IHC
Introduo
Objetivos

Visibilidade


- Restries fsicas - Restries lgicas - Restries culturais
Bons mapeamentos
-
Feedback
Custo
Utilidade
compatibilidade
Confiabilidade
Funcionalidade
Usabilidade
Eficincia
Erros
Satisfao subjetiva
ACEITABILIDADE DE SISTEMAS
Combinao de
SISTEMAS ATUAIS DE CONTROLE DE PORTAS DE ENTRADA DE BANCOS

Apesar de serem benficos socialmente (impedem situaes de assalto), no so aceitos socialmente pois levam a que qualquer pessoa que queira entrar no banco tenham que esbarrar na porta trancada por inmeras vezes at se desfazer de todo e qualquer objeto suspeito (pois no se sabe quais os objetos que impedem a entrada).
PARMETROS TRADICIONAIS: Custo Utilidade Usabilidade (facilidade de uso e aprendizado) Compatibilidade Confiabilidade, etc...
20
IHC
Introduo
Objetivos

Visibilidade


Bons mapeamentos
-
Feedback
Custo
Utilidade
compatibilidade
Confiabilidade
Funcionalidade
Usabilidade
Eficincia
Erros
Satisfao subjetiva
PRINCPIOS DE UM BOM DESIGN

1.Visibilidade
Determina
que apenas as coisas necessrias devem estar visveis. Indica o mapeamento entre aes pretendidas e as aes reais. Indica tambm distines importantes. Visibilidade do efeito das operaes A falta de visibilidade que torna muitos dispositivos controlados por computadores to difceis de serem operados.
EXEMPLOS: Diferenciar a vasilha do sal da do acar. Portas (puxar, empurrar ou deslizar)
21
IHC
Introduo
Objetivos

Visibilidade


Bons mapeamentos
-
Feedback
Custo
Utilidade
compatibilidade
Confiabilidade
Funcionalidade
Usabilidade
Eficincia
Erros
Satisfao subjetiva
2. Affordance
Refere-se as propriedades percebidas e propriedades reais dos objetos
da interface. Determinam como um objeto funciona. Quando se tem a predominncia da affordance o usurio sabe o que fazer somente olhando, no sendo preciso figuras, rtulos ou instrues. EXEMPLOS:
22
IHC
Introduo
Objetivos

Visibilidade


Bons mapeamentos
-
Feedback
Custo
Utilidade
compatibilidade
Confiabilidade
Funcionalidade
Usabilidade
Eficincia
Erros
Satisfao subjetiva

3. Bom Modelo Conceitual
Permite Inserir
prever o efeito de aes. Sem um bom modelo conceitual, efetuam-se as operaes sem saber que efeitos esperar ou o que fazer se algo der errado. Restries: Determinao das formas de delimitar o tipo de interao que pode ocorrer em um determinado momento.
Exemplo:
Desativar certas opes do menu sombreando-as, restringindo as aes do usurio somente s permitidas naquele estgio da atividade.
23

Modelo Conceitual Restries podem ser:
Modo como os objetos fsicos restringem o movimento das coisas. Exemplos: Um nico modo de inserir a chave em uma fechadura. De quantas formas voc pode inserir um CD ou um DVD no computador? Quais as restries fsicas nesta ao? Como isto difere da insero de um disquete?

Explorar o senso comum das pessoas sobre como as coisas funcionam. Exemplo: Relao entre o layout fsico de um dispositivo e o modo como ele funciona
24

No
uso de checkbox, em alguns pases o marcador X deve ser substitudo por V (sinal de visto) pois no Japo o X significa excluso.
Objetos brancos no Japo = morte Vermelho = bruxaria em muitos pases africanos
IHC
Introduo
Objetivos

Visibilidade


Bons mapeamentos
-
Feedback
Custo
Utilidade
compatibilidade
Confiabilidade
Funcionalidade
Usabilidade
Eficincia
Erros
Satisfao subjetiva
25

4. Bom Mapeamento

Relao entre controles e seus movimentos e o resultado no mundo EXEMPLOS:
IHC
Introduo
Objetivos

Visibilidade


Bons mapeamentos
-
Feedback
Custo
Utilidade
compatibilidade
Confiabilidade
Funcionalidade
Usabilidade
Eficincia
Erros
Satisfao subjetiva
26

4. Feedback
Feedback - Retornar ao usurio informao sobre as aes que foram feitas, quais os resultados obtidos.
- ? Falar com uma pessoa sem ouvir sua voz!!
IHC
Introduo
Objetivos

Visibilidade


Bons mapeamentos
- Feedback
- Relaes entre controle e seus movimentos e o resultado no mundo
Custo
Utilidade
compatibilidade
Confiabilidade
Funcionalidade
Usabilidade
Eficincia
Erros
Satisfao subjetiva
27
IHC
Introduo
Objetivos

Visibilidade


Bons mapeamentos
- Feedback
- Relaes entre controle e seus movimentos e o resultado no mundo
Custo
Utilidade
compatibilidade
Confiabilidade
Funcionalidade
Usabilidade
Eficincia
Erros
Satisfao subjetiva
Bibliografia
Helosa Vieira da Rocha; Maria Ceclia Calani
Baranauskas. Design e Avaliao de Interfaces humano-computador. Instituto de Computao. Universidade Estadual de Campinas, 2003.
Jakob Nielsen, Usabilty Engineering, Morgan
Kaufmann, Inc. San Francisco, 1993
28

Intro Duca Oi HC

Încărcat de

Informații document

Titlu original

Drepturi de autor

Formate disponibile

Partajați acest document

Partajați sau inserați document

Opțiuni de partajare

Vi se pare util acest document?

Este necorespunzător acest conținut?

Drepturi de autor:

Formate disponibile

Intro Duca Oi HC

Încărcat de

Drepturi de autor:

Formate disponibile

Multimdia e Interface Usurio - Mquina

Profa. Cristina Paludo Santos

Cincia da Computao/ Sistemas de Informao

Princpios de um Bom Design

Avaliaes de interfaces - Observao

- Sistemas teis - Sistemas Seguros - Sistemas Funcionais

Affordance Bom modelo conceitual

- Restries lgicas - Restries culturais

Relaes entre controle e seus movimentos e o resultado no mundo

Exemplos de interfaces mal projetadas

EXEMPLOS DE INTERFACES PROBLEMTICAS

EXEMPLOS DE INTERFACES PROBLEMTICAS

Como ajustar o relgio?

EXEMPLOS DE INTERFACES PROBLEMTICAS

Como ajustar cadeiras?

EXEMPLOS DE INTERFACES PROBLEMTICAS

EXEMPLOS DE INTERFACES PROBLEMTICAS

EXEMPLOS DE INTERFACES PROBLEMTICAS

sem instrues de uso em restaurante universitrio

EXEMPLOS DE INTERFACES PROBLEMTICAS

EXEMPLOS DE INTERFACES PROBLEMTICAS A Mquina da Tess

EXEMPLOS DE INTERFACES PROBLEMTICAS O Problema A Soluo

OU Primeiro escolher opo...

...depois colocar dinheiro.

EXEMPLOS DE INTERFACES PROBLEMTICAS

EXEMPLOS DE INTERFACES PROBLEMTICAS

Nenhuma estrutura auxiliar para ajudar a remoo da tampa.

EXEMPLOS DE INTERFACES PROBLEMTICAS

Peso elevado do galo; Tampa necessariamente aberta antes da colocao.

EXEMPLOS DE INTERFACES PROBLEMTICAS

EXEMPLOS DE INTERFACES PROBLEMTICAS

Uma interface ruim ineficiente e confusa

EXEMPLOS DE INTERFACES PROBLEMTICAS

Uma interface ruim no confivel

EXEMPLOS DE INTERFACES PROBLEMTICAS

Uma interface ruim tira o controle do usurio

EXEMPLOS DE INTERFACES PROBLEMTICAS

O ADVENTO DE UMA NOVA COMPUTAO

IHM/IHC ao mesmo tempo que exploram o potencial e funcionalidade da nova tecnologia?

PROFISSIONAIS QUE CONTRIBUEM PARA O ADVENTO DE NOVAS TECNOLOGIAS

Princpios de um Bom Design

Avaliaes de interfaces - Observao

- Sistemas teis - Sistemas Seguros - Sistemas Funcionais

Affordance Bom modelo conceitual

Relaes entre controle e seus movimentos e o resultado no mundo

SISTEMAS ATUAIS DE CONTROLE DE PORTAS DE ENTRADA DE BANCOS

Princpios de um Bom Design

Avaliaes de interfaces - Observao

- Sistemas teis - Sistemas Seguros - Sistemas Funcionais

Affordance Bom modelo conceitual

Relaes entre controle e seus movimentos e o resultado no mundo

PRINCPIOS DE UM BOM DESIGN

Princpios de um Bom Design

Avaliaes de interfaces - Observao

- Sistemas teis - Sistemas Seguros - Sistemas Funcionais

Affordance Bom modelo conceitual

Relaes entre controle e seus movimentos e o resultado no mundo

PRINCPIOS DE UM BOM DESIGN

Princpios de um Bom Design

Avaliaes de interfaces - Observao

- Sistemas teis - Sistemas Seguros - Sistemas Funcionais

Affordance Bom modelo conceitual

Relaes entre controle e seus movimentos e o resultado no mundo