slides baseados no livro: design e avaliação de interfaces humano computador

Slides baseados no livro:

Design e Avaliação de Interfaces Humano Computador

Heloísa Vieira da Rocha

M.Cecília C. Baranauskas

PrincípiosPrincípiosO primeiro princípio do design de interfaces,

tanto para uma maçaneta quanto para um computador, é manter em mente o ser humano que quer usá-la. A tecnologia é subserviente àquele objetivo.

….menos ênfase em “interfaces” e mais em ferramentas apropriadas para a tarefa. Mais ênfase em design centrado no usuário. Menos em tecnologia; mais nas pessoas, e grupos, e interações sociais. E tarefas. (Norman, D)

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

Objetivos de IHCObjetivos de IHCProduzir sistemas usáveis, seguros e

funcionaisDesenvolver ou melhorar a

segurança, utilidade, efetividade e USABILIDADE de sistemas computacionais

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

Aceitabilidade de um SistemaAceitabilidade de um SistemaD

ESIG

N E

AVA

LIAÇ

ÃO D

E IN

TERF

ACES

HU

MAN

O-C

OM

PUTA

DO

R

HEL

OÍS

A VI

EIRA

DA

ROCH

A -

MA

RIA

CECÍ

LIA

CALA

NI B

ARA

NA

USK

AS

Fatores Organizacionaistreinamento, políticas, organização do trabalho, etc.

Fatores Ambientaisbarulho, aquecimento, ventilação,

luminosidade, etc.

Saúde e Segurançaestresse, dores de cabeça,

perturbações musculares, etc.

capacidades e processos cognitivos

O Usuáriomotivação, satisfação,

personalidade, experiência, etc.

Confortoposição física, layout do

equipamento, etc.

Interface do Usuáriodispositivos de entrada e saída, estrutura do diálogo, uso de cores, ícones, comandos, gráficos,

linguagem natural, 3-D, materiais de suporte ao usuário, multimídia, etc.

Tarefafácil, complexa, nova,

alocação de tarefas, repetitiva,monitoramento, habilidades, componentes, etc.

Restriçõescustos, orçamentos, equipe,

equipamento, estrutura do local de trabalho, etc.

Funcionalidade do Sistemahardware, software, aplicação

Produtividadeaumento da qualidade, diminuição de custos, diminuição de erros,

diminuição de trabalho, diminuição do tempo de produção,aumento da criatividade , oportunidades para idéias criativas em direção a novos produtos, etc.

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

Disciplinas EnvolvidasDisciplinas EnvolvidasD

ESIG

N E

AVA

LIAÇ

ÃO D

E IN

TERF

ACES

HU

MAN

O-C

OM

PUTA

DO

R

HEL

OÍS

A VI

EIRA

DA

ROCH

A -

MA

RIA

CECÍ

LIA

CALA

NI B

ARA

NA

USK

AS

Princípios de DesignPrincípios de DesignVisibilidade e AffordancesBom modelo conceitualBons mapeamentosFeedback

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

Princípios de DesignPrincípios de Design Partindo dos objetos que nos cercam:

Visibilidade e Affordances O usuário necessita ajuda. Apenas as coisas necessárias têm que estar

visíveis para indicar quais as partes podem ser operadas e como.

Ex: portas Visibilidade

indica o mapeamento entre ações pretendidas e as ações reais.

indica também distinções importantes diferenciar a vasilha do sal da do açúcar.

Visibilidade do efeito das operações A falta de visibilidade é que torna muitos dispositivos

controlados por computadores tão difíceis de serem operados.

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

Visibilidade – Editores GráficosVisibilidade – Editores GráficosD

ESIG

N E

AVA

LIAÇ

ÃO D

E IN

TERF

ACES

HU

MAN

O-C

OM

PUTA

DO

R

HEL

OÍS

A VI

EIRA

DA

ROCH

A -

MA

RIA

CECÍ

LIA

CALA

NI B

ARA

NA

USK

AS

VisibilidadeVisibilidadeD

ESIG

N E

AVA

LIAÇ

ÃO D

E IN

TERF

ACES

HU

MAN

O-C

OM

PUTA

DO

R

HEL

OÍS

A VI

EIRA

DA

ROCH

A -

MA

RIA

CECÍ

LIA

CALA

NI B

ARA

NA

USK

AS

Princípios de DesignPrincípios de DesignVisibilidade e Affordances

Affordances o termo definido para se referir às

propriedades percebidas e propriedades reais de um objeto, que deveriam determinar como ele pode ser usado. Botões são para girar, teclas para pressionar,

tesouras para cortar, etc. Quando se tem a predominância da affordance

o usuário sabe o que fazer somente olhando, não sendo preciso figuras, rótulos ou instruções

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

Princípios de DesignPrincípios de Design Bom modelo conceitual

◦ Um bom modelo conceitual permite prever o efeito de ações.

◦ Sem um bom modelo conceitual opera-se sob comando, cegamente Ex.: uma tesoura Contra-ex: relógio digital com dois e até quatro

botões no mostrador

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

Princípios de DesignPrincípios de DesignBons mapeamentos◦termo técnico para denotar o relacionamento

entre duas entidades. ◦em interfaces, indica o relacionamento entre

os controles e seus movimentos e os resultados no mundo.

◦Mapeamentos naturais Aproveitam analogias físicas e padrões culturais

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

Princípios de DesignPrincípios de DesignFeedback◦Retornar ao usuário informação sobre as

ações que foram feitas, quais os resultados obtidos, é um conceito conhecido da teoria da informação e controle ? Falar com uma pessoa sem ouvir sua voz!! Carros X Telefones

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

Paradoxo da TecnologiaParadoxo da TecnologiaA tecnologia oferece potencial para

tornar nossa vida mais simples e agradável, e cada nova tecnologia traz mais benefícios. E ao mesmo tempo adiciona tamanha complexidade que faz aumentar nossa dificuldade e frustação.

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

Paradoxo da TecnologiaParadoxo da TecnologiaSempre que o número de funções excede

o número de controles, o design torna-se arbitrário e não natural, e complicado.

A mesma tecnologia que simplifica a vida provendo um maior número de funcionalidades em um objeto, também a complica tornando-a muito mais difícil aprender, e usar

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

Ciclo de Vida da TecnologiaCiclo de Vida da Tecnologia InovadoresEntusiastasPragmáticosConservadoresCéticos

tempo

usuários

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

USABILIDADE USABILIDADE DE SISTEMAS COMPUTACIONAISDE SISTEMAS COMPUTACIONAIS

S Nielsen explicita seus princípios de design a partir de alguns slogans, que ele define como slogans de usabilidade. A seguir apresentamos alguns deles:

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

SlogansSlogans de Usabilidade de Usabilidade

• Sua melhor tentativa não é suficientemente boa

• O usuário sempre está certo• O usuário nem sempre está certo• Usuários não são designers• Designers não são usuários• Menos é mais (less is more)• Help doesn´t

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS


Sua melhor tentativa não é boa o suficiente

É impossível fazer o design de uma interface ótima simplesmente baseado emnossas melhores idéias.

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS


Usuário está sempre certo A atitude do designer quando verifica que o

usuário tem problemas de interação com um determinado aspecto da interface, não deve ser a de julgar que o usuário é ignorante ou então, que ele não tentou o suficiente ou ainda, deixar passar que um dia o usuário aprende.

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS


Usuário não está sempre certo Também não se deve ir ao extremo de

construir uma interface somente a partir do que os usuários gostariam. Usuários freqüentemente não sabem o que é bom para eles.

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS


Usuários não são designers Uma solução simples para atender a diversidade de

usuários seria a de prover interfaces flexíveis que pudessem ser amplamente customizadas e aí cada usuário teria exatamente a interface que melhor lhe satisfizesse (análogo aos bancos de carros modernos mencionados anteriormente). Estudos demonstram que usuários novatos não customizam suas interfaces, mesmo quando essas facilidades estão disponíveis (Jorgensen e Sauer, 1990).

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS


Designers não são usuários Designers são humanos e certamente usam

computadores, mas são diferentes de usuários em diversos aspectos básicos: a experiência computacional e o conhecimento dos fundamentos conceituais do design do sistema.

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS


Menos é mais (less is more) Uma das frequentes soluções de design

que têm sido adotadas é colocar no sistema todas as opções e características imagináveis, pois se tudo está disponível então todos ficarão satisfeitos.

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS


Help não ajuda (help doesn´t) Muitas vezes, senão na maioria delas,

vemos usuários perdidos tentando encontrar informação na enorme quantidade de material de help que acompanha um sistema, e quando a encontra não consegue entendê-la.

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

Definição de UsabilidadeDefinição de UsabilidadeAtributos de usabilidade◦facilidade de aprendizagem (learnability)◦eficiência◦facilidade de rememorar (memorability)◦erros : poucos e não catastróficos◦satisfação subjetiva

Como medir usabilidade ?

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

Definição de UsabilidadeDefinição de Usabilidade

Facilidade de aprendizagem (learnability)

O sistema precisa ser fácil de aprender de forma que o usuário possa rapidamente começar a interagir. Segundo Nielsen, é o mais importante atributo de usabilidade, por ser a primeira experiência que qualquer usuário tem com um sistema.

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS


Eficiência O sistema precisa ser eficiente no uso, de

forma que uma vez aprendido o usuário tenha um elevado nível de produtividade. Portanto, eficiência refere-se a usuários experientes, após um certo tempo de uso.

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS


Facilidade de relembrar (memorability) O sistema precisa ser facilmente

relembrado, de forma que o usuário ao voltar a usá-lo depois de um certo tempo não tenha novamente que aprendê-lo.

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS


Erros Neste contexto, erro é definido como uma

ação que não leva ao resultado esperado, um "engano" portanto. O sistema precisa ter uma pequena taxa de erros, ou seja, o usuário não pode cometer muitos erros durante o seu uso e, em errando, deve ser fácil a recuperaração, sem perda de trabalho.

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS


Satisfação subjetiva Os usuários devem gostar do sistema, ou

seja, deve ser agrádável de forma que o usuário fique satisfeito ao usá-lo.

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

Definição de UsabilidadeDefinição de UsabilidadeAtributos de usabilidade◦facilidade de aprendizagem (learnability)◦eficiência◦facilidade de rememorar (memorability)◦erros : poucos e não catastróficos◦satisfação subjetiva

Como medir usabilidade ?

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

Medidas de Satisfação SubjetivaMedidas de Satisfação SubjetivaQuestionárioPor favor indique o grau com o qual você concorda ou não

com as seguintes afirmações sobre o sistema: É muito fácil aprender como se usa esse sistema Usar este sistema foi uma experiência muito frustante Eu sinto que esse sistema irá me permitir conseguir uma alta

produtividade Eu me preocupo que muitas das coisas que faço com esse sistema

podem estar erradas Este sistema pode fazer todas as coisas que eu poderia precisar É muito agradável trabalhar com esse sistema

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

Medidas de Satisfação SubjetivaMedidas de Satisfação SubjetivaEscala semântica Diferencial

Por favor marque as posições que melhor refletem suas impressões sobre o sistema

◦Agradável ------- Irritante◦Completo ------- Incompleto◦Cooperativo ------- Não Cooperativo◦Simples ------- Complicado◦Rápido de Usar ------- Lento para usar◦Seguro ------- Inseguro

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

Usabilidade de ÍconesUsabilidade de ÍconesD

ESIG

N E

AVA

LIAÇ

ÃO D

E IN

TERF

ACES

HU

MAN

O-C

OM

PUTA

DO

R

HEL

OÍS

A VI

EIRA

DA

ROCH

A -

MA

RIA

CECÍ

LIA

CALA

NI B

ARA

NA

USK

AS

Categorias de UsuáriosCategorias de Usuários e Diferenças Individuais e Diferenças Individuais

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

WEBWEBem janeiro de 2000 - 10 milhões de sites ◦1,6 bilhão de páginas◦72 milhões de servidores◦275 milhões de usuários navegando◦a cada 24hs

3,3 milhões de novas páginas 123 000 novos usuários

dezembro de 2000 - 25 milhões de sitesprevisão para fim de 2002 - 100 milhões

de sites

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

WEBWEB

em 1998 cerca de 3 bilhões de dólares deixaram de ser ganhos na WEB norte- americana por causa de designs mal feitos com a enorme oferta de alternativas usuários tem uma notável impaciência e insistência em gratificação imediata

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

WEBWEB

usabilidade assume uma importância ímpar na economia da Internet:◦no design de produtos e de software

tradicionais, usuários pagam antes e experimentam a usabilidade depois

◦na WEB experimentam a usabilidade antes e pagam depois

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

Usabilidade na WEB- Ex.: IBMUsabilidade na WEB- Ex.: IBMD

ESIG

N E

AVA

LIAÇ

ÃO D

E IN

TERF

ACES

HU

MAN

O-C

OM

PUTA

DO

R

HEL

OÍS

A VI

EIRA

DA

ROCH

A -

MA

RIA

CECÍ

LIA

CALA

NI B

ARA

NA

USK

AS

O caso IBMO caso IBM

recurso mais popular em seu site função de busca

as pessoas não conseguiam descobrir como navegar segundo recurso mais popular

◦ botão de ajuda. solução

amplo processo de redesign, envolvendo centenas de pessoas e milhões de dólares.

Resultado na primeira semana depois do redesign em fevereiro de 1999 o uso do botão de ajuda caiu 84% as vendas aumentaram 400%.

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

Usabilidade na WEBUsabilidade na WEBClareza na arquitetura da informação◦essencial que o usuário consiga discernir o

que é prioritário e o que é secundário no site. Um bom arranjo da informação

◦usuários sempre terão dificuldades em encontrar o que procuram devem ser ajudados

prover um senso de como a informação está estruturada e localizada. uma das alternativas adotadas em alguns sites, é prover

um mapa do site

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

Usabilidade na WEBUsabilidade na WEBFacilidade de navegação◦Uma máxima é que o usuário deveria

conseguir acessar a informação desejada no máximo em três cliques

Simplicidade◦Quem navega quer encontrar o mais

rapidamente possível o objetivo da busca. a pirotecnia deve ser evitada, dando ao usuário paz

e tranquilidade para que possa analisar a informação

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

SimplicidadeSimplicidade

Onde estou ? O que este site faz ?

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

SimplicidadeSimplicidadeD

ESIG

N E

AVA

LIAÇ

ÃO D

E IN

TERF

ACES

HU

MAN

O-C

OM

PUTA

DO

R

HEL

OÍS

A VI

EIRA

DA

ROCH

A -

MA

RIA

CECÍ

LIA

CALA

NI B

ARA

NA

USK

AS

Usabilidade na WEBUsabilidade na WEBA relevância do conteúdo◦Sempre que questionados sobre sites,

usuários se referem a qualidade e relevância do conteúdo

◦Um bom texto para essa mídia o mais conciso e objetivo possível não promocional ou publicitário leitores online imprimem textos

necessitam páginas bem curtas informação secundária deixada para páginas de suporte

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

Usabilidade na WEBUsabilidade na WEBManter a consistência◦Quando as coisas acontecem sempre do

mesmo jeito, os usuários não precisam se preocupar a respeito do que irá acontecer

◦um Website deve ser gerenciado como um projeto único de interface com o usuário

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

Usabilidade na WEBUsabilidade na WEBTempo suportável◦tempo de carga das páginas deve ser curto◦10 segundos é o máximo de tempo antes que as

pessoas percam o interesse na Web os usuários já têm uma baixa

expectativa limite pode aumentar para 15 segundos

Foco nos usuários◦ 'sair do caminho' para que o usuário possa fazer o que quer da

maneira mais rápida possível.

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

Usabilidade na WEB - resumoUsabilidade na WEB - resumoClareza na arquitetura da informaçãoFacilidade de navegaçãoSimplicidadeA relevância do conteúdoManter a consistênciaTempo suportávelFoco nos usuários

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

Amazon (1995) Amazon (1995) D

ESIG

N E

AVA

LIAÇ

ÃO D

E IN

TERF

ACES

HU

MAN

O-C

OM

PUTA

DO

R

HEL

OÍS

A VI

EIRA

DA

ROCH

A -

MA

RIA

CECÍ

LIA

CALA

NI B

ARA

NA

USK

AS

Amazon (2000)Amazon (2000)D

ESIG

N E

AVA

LIAÇ

ÃO D

E IN

TERF

ACES

HU

MAN

O-C

OM

PUTA

DO

R

HEL

OÍS

A VI

EIRA

DA

ROCH

A -

MA

RIA

CECÍ

LIA

CALA

NI B

ARA

NA

USK

AS

UOL 1995UOL 1995

A Folha Web, site da Folha de S. Paulo, no

ar em 1995, trazia reportagens

selecionadas do jornal impresso e a charge

do dia

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

UOL FuturoUOL Futuro

Barra de navegação principal

verticalizada à

esquerda

Barra superior de ajuste do

navegador

Nomes das estações no

miolo da página

Um dos estudos para a homepage do futuroUniverso Online, ainda com o nome de trabalhopara preservar o sigilo

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

UOL – 28.04.1996UOL – 28.04.1996D

ESIG

N E

AVA

LIAÇ

ÃO D

E IN

TERF

ACES

HU

MAN

O-C

OM

PUTA

DO

R

HEL

OÍS

A VI

EIRA

DA

ROCH

A -

MA

RIA

CECÍ

LIA

CALA

NI B

ARA

NA

USK

AS

UOL - agosto de 1996UOL - agosto de 1996D

ESIG

N E

AVA

LIAÇ

ÃO D

E IN

TERF

ACES

HU

MAN

O-C

OM

PUTA

DO

R

HEL

OÍS

A VI

EIRA

DA

ROCH

A -

MA

RIA

CECÍ

LIA

CALA

NI B

ARA

NA

USK

AS

UOL ( junção com Abril)UOL ( junção com Abril)

Em dezembro de 1996, a home page ficoumais quente: foi aberto espaço para imagens

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

UOL – 04.1999UOL – 04.1999

No aniversário de 3 anos do UOL, em abril de 1999, a

home page do UOL mudou para espelhar o crescimento

do site. Os assinantes votaram e ajudaram a escolher a nova

cara do UOL

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

UOL - 1999UOL - 1999

Em outubro de 1999, entra no ar a nova home com a cor escolhida pelo público.

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

UOL 2002UOL 2002D

ESIG

N E

AVA

LIAÇ

ÃO D

E IN

TERF

ACES

HU

MAN

O-C

OM

PUTA

DO

R

HEL

OÍS

A VI

EIRA

DA

ROCH

A -

MA

RIA

CECÍ

LIA

CALA

NI B

ARA

NA

USK

AS

USP 2002USP 2002D

ESIG

N E

AVA

LIAÇ

ÃO D

E IN

TERF

ACES

HU

MAN

O-C

OM

PUTA

DO

R

HEL

OÍS

A VI

EIRA

DA

ROCH

A -

MA

RIA

CECÍ

LIA

CALA

NI B

ARA

NA

USK

AS

UNICAMP - 2002UNICAMP - 2002D

ESIG

N E

AVA

LIAÇ

ÃO D

E IN

TERF

ACES

HU

MAN

O-C

OM

PUTA

DO

R

HEL

OÍS

A VI

EIRA

DA

ROCH

A -

MA

RIA

CECÍ

LIA

CALA

NI B

ARA

NA

USK

AS

INTERFACES INTERNACIONAISINTERFACES INTERNACIONAIS

Exportar software é vital para qualquer indústria produtora de software. Interfaces internacionais são aquelas projetadas para serem usadas em mais de um país. Fato mais que definitivo é que não basta um produto traduzido em muitas outras línguas.

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS


Fazer o design de uma interface internacional pode ou não envolver tradução de linguagem, mas certamente deve envolver conhecimento sobre as necessidades e cultura de outros países.

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS


Usuários desejam um produto que seja adequado às suas características culturais e práticas de trabalho e, algumas vezes, isso não implica necessariamente em uma tradução. Equipes de design de software têm então pela frente o desafio de garantir a usabilidade de seus produtos para todo o mercado global.

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS


Do ponto de vista dos usuários, temos que bem mais da metade de usuários de software usam atualmente interfaces cujo design foi feito em um país estrangeiro. Usabilidade para esse grande número de usuários irá depender da maior consciência da necessidade de se ter design direcionado à internacionalização (Nielsen, 1993).

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS


Internacionalização e Localização

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS


Podemos classificar os símbolos gráficos em três categorias distintas (Rogers, 1989):

Símbolos de semelhança ou íconesretratam o objeto que representam. Por

exemplo, a figura de uma impressora para indicar a função imprimir, a de uma tesoura para a cortar, etc.

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS


Símbolos de referênciaretratam algum objeto que por referência

ou analogia pode representar o conceito que o símbolo está querendo representar.

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS


Símbolos arbitráriosformas arbitrárias que somente tem

significado por convenção. Por exemplo, todos os sinais de trânsito (que têm sido fonte de inspiração para muitos designers dada a sua característica de padrão internacional).

DES

IGN

E A

VALI

AÇÃO

DE

INTE

RFAC

ESH

UM

ANO

-CO

MPU

TAD

OR

H

ELO

ÍSA

VIEI

RA D

A RO

CHA

- M

ARI

A CE

CÍLI

A CA

LAN

I BA

RAN

AU

SKAS

slides baseados no livro: design e avaliação de interfaces humano computador

Documents