PUC-RIOErgodesign de Interfaces: Usabilidade e Arquitetura de Informação

INTERAÇÃO HUMANO-COMPUTADORe projeto centrado no usuário

05/09/2015Alice Wanderley, Fernanda Sarmento, Raquel Winter e Renan Andrade

Categoria #1

Facilitar o aprendizado do sistema

CompatibilidadeCondução / Incentivo / Transparência (Explicitness)

COMPATIBILIDADE

Google Apresentações

Ao acessar a ferramenta pela primeira vez, é possível identificar elementos de

outros softwares que possuem o mesmo objetivo, o que torna a

ferramenta fácil de ser compreendida.

“Projetar um produto de tal maneira que seu modo de uso compatível com as

experiências de usuários provenientes do uso de outros produtos.” (JORDAN, 1998)

COMPATIBILIDADE

Site Pinterest

O Pinterest é uma rede social que permite a partilha de fotos e vídeos em diferentes murais, de acordo com os

gostos de cada utilizador. Porém, ao acessar a ferramenta pela primeira vez o

usuário fica perdido por não conhecer a opção “pin”.O usuário leva um certo tempo para entender que o

nome pin + interest para uma parede virtual onde cada pessoa pode pendurar aquilo que mais lhe interessa.

“O conhecimento necessário para uma tarefa deve estar disponível no mundo exterior. O usuário deve ser capaz de deduzir o comportamento de um sistema quando interage

com ele.” (NORMAN, 2002)

CONDUÇÃO / INCENTIVO / TRANSPARÊNCIA (EXPLICITINESS)

Site NetShoes

O site conduz o usuário de maneira clara e bem objetiva quando se trata de buscar algum produto

específico até o fechamento do pedido.

“O sistema deve utilizar a linguagem do usuário, com palavras, frases e conceitos familiares a ele, ao invés de

usar termos orientados ao sistema.” (NIELSEN, 1998)

CONDUÇÃO / INCENTIVO / TRANSPARÊNCIA (EXPLICITINESS)

Site RioCard

Ao tentar recuperar a senha o usuário se perde. As informações importantes são

muito pequenas, sem destaque.Ele também indica para o usuário preencher

um campo do outro lado, saindo da sua posição atual. Além de mandar clicar em um

botão que não existe.

“Projetar um produto de tal maneira que seu modo de uso compatível com as experiências

de usuários provenientes do uso de outros produtos.” (JORDAN, 1998)

Categoria #2

Facilitar a procura, a percepção, o reconhecimento e a compreensão das informações no sistemaAgrupamento / Clareza Visual / PriorizaçãoLegibilidade e Clareza Visual

AGRUPAMENTO / DISTINÇÃO PELO FORMATO

Google Now

Informações estão separadas de forma bastante clara com a utilização de cards.

Diferenças de tamanhos de fontes evidenciam os títulos das categorias.

Ícones auxiliam na rápida compreensão.

“Organização visual dos itens de informação, uns em relação aos outros. O agrupamento considera a

localização e o formato para indicar as relações entre os diversos itens apresentados, e se eles pertencem ou não

a uma mesma classe de itens.” (BASTIEN & SCAPIN, 1993)

LEGIBILIDADE/CLAREZA VISUAL

Aplicativo Pocket

Permite a troca de cor de fundo, tipo e tamanho de fonte e brilho da tela para oferecer maior conforto de

leitura aos usuários.

“Características concretas da apresentação das informações que devem facilitar a leitura.”

(BASTIEN & SCAPIN, 1993)

“Projetar um produto de tal maneira que a informação apresentada possa ser lida fácil e rapidamente sem que

ela leve à confusão.”(JORDAN, 1998)

AGRUPAMENTO / DISTINÇÃO POR FORMATO

Site Boa Dica

Informações apresentadas não podem ser distinguidas rapidamente, pois não

há uma hierarquia bem definida dos elementos.

A organização das informações na página não é definida de acordo com as

principais tarefas a serem realizadas pelos usuários.

“Organização visual dos itens de informação, uns em relação aos outros.”

(BASTIEN & SCAPIN, 1993)

PRIORIZAÇÃO DE FUNCIONALIDADES E

INFORMAÇÕES

Aplicativo Spotify

Informações agrupadas de modo que o usuário é capaz de acessar as

funcionalidades mais importantes do sistema de forma rápida e em poucos

passos.Pode-se dizer que a tela se encontra

“divida” em 5 áreas distintas das quais 4 ficam fixas independentemente da

ação do usuário, o que facilita o reconhecimento das funcionalidades.

“Projetar um produto de modo que as funcionalidades e as informações mais

importantes estejam facilmente acessíveis ao usuário.”

(JORDAN, 1998)

Categoria #3

Facilitar o controle da interação com o sistema

Significado dos Códigos e DenominaçõesAjuda e DocumentaçãoFeedbackControle do usuárioPrevenção e Recuperação de Erros

FEEDBACK

Na maioria das vezes que é feita uma compra pela internet, imediatamente é enviado por e-

mail uma confirmação, acompanhada de informações detalhadas sobre o

produto/serviço adquirido.

Também há feedback quando é feito um pagamento com determinados cartões e o

usuário logo recebe um sms confirmando o pagamento.

Outra forma de feedback parecida é quando o usuário se cadastra em um determinado site e

o mesmo lhe envia um e-mail agradecendo e registrando sua nova conta.

“Projetar um produto de tal modo que as ações realizadas pelo usuário sejam reconhecidas e que

uma indicação significativa seja dada sobre os resultados das ações.”

(JORDAN, 1998)

PREVENÇÃO E RECUPERAÇÃO DE ERROS

O DreamWeaver é um programa da Adobe que permite o acompanhamento em tempo real de

como o projeto está ficando, no momento em que são colocados os códigos.

Além dele sinalizar os erros mais comuns (por exemplo espaçamento indevido), ele e outros

programas da Adobe ficam com um asterisco na parte superior até que o documento seja salvo.

“É preferível projetar um produto que evite que o usuário cometa erros, do que apresentar boas

mensagens de erro.”(NIELSEN, 1994)

PREVENÇÃO E RECUPERAÇÃO DE ERROS Pequenas sinalizações em tags, são exemplos de

prevenção de erros. Mostram de forma simples os erros mais comuns a serem evitados.

“Projetar um produto de tal modo que os possíveis erros por parte do usuário sejam minimizados, e se os erros ocorrem, que seja possível recuperá-los rápido e

facilmente.”(JORDAN, 1998)

CONTROLE DO USUÁRIO

Ferro

O Ferro de passar roupas causou inúmeros acidentes domésticos por causa da alta temperatura

que não apresentava limites nem sinalização de alerta.

Hoje a maioria (mas não todos) possui um limite de temperatura.

"O usuário aplica algumas vezes sem querer funções erradas. Ele deve dispor de funções que lhe permitam sair rapidamente do estado em que se encontra sem

ser obrigado a passar por uma interação complexa. Se trata então de propor funções que permitam desfazer

ou refazer uma ação.”(NIELSEN, 1994)

CONTROLE DO USUÁRIO

ImpressoraTrava folhas

Imprime folha de teste

Não era possível interromper a impressão

(hoje na maioria é)

Quando a folha está sendo puxada, o cancelamento e retirada desta, é quase sempre complicado

“Projetar um produto de maneira a maximizar o controle do usuário sobre suas próprias ações, sobre o

produto, e sobre o estado no qual se encontra o produto.”

(JORDAN, 1998)

CONTROLE DO USUÁRIO

Corretores ortográficos.

Estes estão sendo cada vez mais motivo de discussões e polêmica, pois em muitos casos

alteram o sentido da frase que o usuário deseja transmitir.

Acontece em e-mail, midias sociais e documentos (Office, Adobe etc)

“Os usuários experientes apreciam saber que dominam a situação e que tem a possibilidade de controlar o

funcionamento do sistema. Projetar o sistema de modo que os usuários sejam os iniciadores das ações ao

invés de respondentes.”(SHNEIDERMAN, 1998)

Categoria #4

Considerar o contexto de uso do sistema e o tipo de usuário

Adaptabilidade / FlexibilidadePermitir que usuários frequentes usem atalhosFlexibilidade e eficiência de uso

ADAPTABILIDADE / FLEXIBILIDADE

No Uno Vivace, assim como em outros carros, existe a possibilidade de adaptar o volante de acordo com a

altura do motorista, ou seja, permite que esse sistema reaja de acordo com as necessidades/preferências do

usuário, garantindo a personalização da interface.

“A adaptabilidade de um sistema diz respeito a sua capacidade de reagir de acordo com o contexto, e de

acordo com as necessidades e preferências dos usuários”’“Refere-se aos meios disponíveis ao usuário para

personalizar sua interface de maneira a considerar suas estratégias de trabalho e/ou seus hábitos e as exigências de

suas tarefas. (BASTIEN & SCAPIN, 1993)

ADAPTABILIDADE / FLEXIBILIDADE

Configuração de preferências de anúncios no Google

É possível editar o seu perfil do Google como target de anúncios através do link: https://www.google.com/settings/u/0/ads/authenticated

Embora não seja possível desabilitar anúncios (até por que a maior parte dos anúncios ocorre em sites parceiros), é possível determinar quais informações você deseja que os anunciantes

saibam e de quais clusters de marketing deseja participar.

“A adaptabilidade de um sistema diz respeito a sua capacidade de reagir de acordo com o contexto, e de acordo com as necessidades e

preferências dos usuários”’“Refere-se aos meios disponíveis ao usuário para personalizar sua

interface de maneira a considerar suas estratégias de trabalho e/ou seus hábitos e as exigências de suas tarefas.

(BASTIEN & SCAPIN,1993)

ADAPTABILIDADE / FLEXIBILIDADE

Facebook x Instagram - #1 - Agilidade para deixar de seguir alguém

Enquanto o Facebook permite que o usuário faça isso diretamente no post, o Instagram só dá oferece a opção de denúncia. Para deixar de seguir é necessário ir até o

perfil e deixar de seguir.

“A adaptabilidade de um sistema diz respeito a sua capacidade de reagir de acordo com o contexto, e de

acordo com as necessidades e preferências dos usuários”’“Refere-se aos meios disponíveis ao usuário para

personalizar sua interface de maneira a considerar suas estratégias de trabalho e/ou seus hábitos e as exigências de

suas tarefas. (BASTIEN & SCAPIN,1993)

ADAPTABILIDADE / FLEXIBILIDADE

Facebook x Instagram - #2 - Agilidade em reportar publicidade inconveniente

Enquanto o Facebook permite que o usuário faça isso diretamente no post, o Instagram não oferece nenhuma opção

senão a de instalar, comentar ou curtir.

“A adaptabilidade de um sistema diz respeito a sua capacidade de reagir de acordo com o contexto, e de acordo com as necessidades

e preferências dos usuários”’“Refere-se aos meios disponíveis ao usuário para personalizar sua

interface de maneira a considerar suas estratégias de trabalho e/ou seus hábitos e as exigências de suas tarefas.

(BASTIEN & SCAPIN,1993) )

PERMITIR QUE USUÁRIOS FREQUENTES USEM ATALHOS

No AutoCad diversos comandos podem ser acessados através da digitação do nome do mesmo ou até mesmo através da digitação

de parte dele. Isso é extremamente desejável pois, como pontuado pelo princípio, usuários experientes buscam por tempos de

resposta curtos do sistema.

p.ex.:1) Modify (no Menu) > Rotate ou

2) Digitar “Rotate”ou

3) Digitar “Ro” (é possível configurar atalhos para rotinas específicas, ou seja, automatizar uma série de comandos)

“Os usuários experientes buscam por tempos de resposta curtos do sistema. Por outro lado, mesmo se os usuários iniciantes passam mais

tempo a explorar o conteúdo da tela, eles tem portanto a possibilidade de responder a seus ritmos. Como conseqüência, é preferível ter

sistemas que funcionam o mais rápido possível”.(SHNEIDERMAN, 1998)

1

2

3

FLEXIBILIDADE E EFICIÊNCIA DE USO

O aplicativo da Gol permite que você realize check in cadastrando-se ou não. Assim, usuários habituados e que optam por se cadastrar usufruem de algumas facilidades, mas usuários iniciantes podem seguir realizando a tarefa

desejada. Neste caso, o sistema se adapta tão bem ao usuário experiente quanto ao usuário iniciante, conforme

previsto pelo princípio.“Os aceleradores ou os atalhos – invisíveis aos usuários

inexperientes – podem facilitar o uso de indivíduos experientes. O sistema deve assim poder se adaptar tão bem

ao usuário experiente quanto ao usuário iniciante. Permitir também ao usuário personalizar ou padronizar as ações que

ele executa com mais freqüência.(NIELSEN, 1994)