1.

4 HEURSTICAS RELEVANTES AO DESIGN

Conforme Norman (1988), partindo da experincia de observar e vivenciar as frustaes que as pessoas experimentam com objetos do cotidiano que no conseguem saber como usar, como embalagens que parecem impossveis de serem abertas, portas que mais parecem uma armadilha, mquinas de lavar e secadoras que tm se tornado cada vez mais poderosas e confusas, identificam alguns princpios bsicos de um bom design, que segundo ele, constituem uma forma de Psicologia, ou seja, a forma como as pessoas interagem com objetos. Existem alguns princpios, os quais sero vistos a seguir, so altamente interrelacinados e difceis de serem tratados e estudados isoladamente: [Castro e Tavares, 2010]

a)

Visibilidade

Apenas os itens necessrios devem estar visveis ao usurio, para indicar quais partes do sistema podem ser operadas. Desta forma, o usurio poupa tempo e pacincia a tentar descobrir o que pode ou deve fazer. A visibilidade ento indica o mapeamento entre aes pretendidas e as aes reais. Um grafismos claro e o destaque de todos os elementos acionveis so dois aspectos que contribuem para um boa visibilidade em uma aplicao. Um exemplo de falta de visibilidade em um sistema Web perceptvel em alguns servios de busca, como o Yahoo!, figura 8, que o desenvolvimento de novos servios e tentativas de agrup-los em uma nica interface. O que poderia, ento, auxiliar o usurio a encontrar mais rapidamente o servio que lhe convm, acaba por tornar-se um empecilho, pois ocorre demasiada poluio visual, perdendo-se a visibilidade das informaes.

FIGURA 3: EXEMPLO DE FALTA DE VISIBILIDADE

Fonte: www.yahoo.com.br

Alm disso, percebe-se a falta de explicaes ao usurio sobre o papel de cada elemento da interface, levando o mesmo a testar cada uma das funcionalidades.

b)

Retorno ou Feedback

Cada vez que o usurio aciona uma ao, necessrio que o sistema lhe fornea informaes acerca do estado da ao, nomeadamente atravs do destaque visual ou sonoro, nas suas mais variadas vertentes. Assim, importante que, por exemplo, os botes alterem o seu estado depois de serem pressionados e que os contedos mais pesados sejam precedidos de sinais adequados indicando ao usurio o estado da ao que foi desencadeada. Uma possvel falha na maior parte dos sistemas voltados para a WEB a falta de feedback explcito ao usurio logo aps suas aes. Como observado na figura 9, logo aps clicar no boto Localizar a nica informao visvel sobre o atual processamento da informao est na barra de status do navegador.

FIGURA 4: FALTA DE FEEDBACK

Fonte: www.altavista.com

c)

Consistncia

essencial que um mesmo sistema mantenha uma consistncia, quer em termos grficos, quer em termos de mecanismos de aes. Desta forma, o usurio no dispensar tanto tempo com a aprendizagem do seu funcionamento. Torna-se menor a probabilidade de o usurio errar e, portanto, mais satisfatria a utilizao do sistema. H ainda situaes de consistncia externa, em que vrios sistemas apresentam mecanismos de funcionamento idnticos, como acontece nos diferentes programas computacionais de uma mesma empresa. Segue abaixo imagem que ilustra os mesmos padres de interface para operaes similares.
FIGURA 5: EXEMPLO DE CONSISTNCIA

Fonte: www.ebay.com

d)

Disponibilidade ou Affordances

As caractersticas indicativas da disponibilidade dos objetos (affordances) so as propriedades que nos permitem perceber qual o seu uso prtico. O termo affordances foi criado por [Norman,1988] para discutir o design dos objetos do dia-adia, passando depois a ser utilizado no design de interao. Nas interfaces, as affordances no so fsicas, estando presente em uma barra de rolagem (scrollbar) ou em um boto acionvel, por exemplo. Ou seja, um objeto deve sugerir a ao a ser tomada, conforme pode-se perceber na figura abaixo, os botes indicam o que deve ser feito.

FIGURA 6: EXEMPLO DE DISPONIBILIDADE

Fonte: www.americanas.com

e)

Mapeamento

Se, por exemplo, em um fogo, os botes estiverem em posies trocadas em referncia s bocas, o usurio ir se confundir e perder mais tempo a trabalhar sem erros com o sistema. Da mesma forma, se um bom mapeamento em uma aplicao no for garantido, o tempo de aprendizagem da mesma ser maior. Um mapeamento a relao entre os elementos de controle, os seus movimentos e os seus resultados. Como exemplo tem-se os botes de pause, play e eject de um sistema de som.

FIGURA 7: EXEMPLO DE MAPEAMENTO

Fonte: http://www.m2brnet.com/

f)

Cor

A cor utilizada quer para realar elementos quer para transmitir sensaes, ideias e simbolismo. Pode tambm ser usada para manter uma coerncia ou para hierarquizar informao, embora no deva ser o nico elemento grfico com essas funes. Contudo, o seu uso deve ser prudente. Sabe-se que, num s relance, o olhar humano capta apenas cerca de cinco cores diferentes, dependendo do design. Por esse motivo, o nmero de cores utilizadas numa mesma interface deve ser limitado. Por outro lado, as combinaes de cores devem ser escolhidas de forma cuidadosa, preferindo as cores quentes para os objetos a destacar, as frias para o fundo e os cinzentos para os elementos neutros. A saturao da cor tambm deve ser pensada. Por esse motivo, as cores saturadas devem ser usadas para atrair a ateno e as cores no saturadas quando a performance e eficincia forem prioridade. Na imagem abaixo, pode-se perceber que o site mostrado no determina nenhum padro de utilizao de cores, o que gera grande poluio visual.

FIGURA 8: EXEMPLO FALTA DE PADRONIZAO DE CORES

Fonte: www.home-dns.certto.com.br/~aguerra/WebSystem.pdf

g)

Agrupamento de Informao (Chunking)

Para o usurio, torna-se muito mais fcil ler texto que se encontra disposto por blocos, de acordo com os itens lgicos a que se referem. Da mesma forma, escrever nmeros de telefone agrupando os algarismos em blocos torna mais fcil a leitura, a compreenso e a memorizao do texto, ou seja, tpicos e informaes semelhantes devem estar agrupados para facilitar o acesso do usurio. Segue abaixo, exemplo de soluo de agrupamento de informaes para o FAQ do Natural na Rede. Todos as possveis perguntas sobre o produto podem ser encontradas nesta nica pgina.

FIGURA 9: AGRUPAMENTO DE INFORMAES

Fonte: http://www.m2brnet.com/

h)

Proximidade

Os elementos devem ser agrupados, por proximidade fsica, de acordo com os seus significados e com a seco lgica que integram. Exemplos do princpio da proximidade no design web (disponvel http://desenvolvimentoparaweb.com/design/gestalt-aplicado-ao-design-web-parte-3exemplos-web-do-principio-da-proximidade/) em:

FIGURA 10: PROXIMIDADE NA WEB

Fonte: http://www.gmail.com

No screenshot do site do GMail pode relacionamentos:

ser

percebido

os

seguintes

Itens da direita: O formulrio que disponibiliza acesso conta de e-mail e, abaixo, link para se cadastrar no GMail. Esse relacionamento inferido devido a os dois terem o fundo colorido; Itens da esquerda: Justamente por todos terem fundo branco, esto relacionados, j que apresentam informaes gerais sobre a conta de e-mail. Com o ato simples de colocar cor no fundo de alguns elementos, o princpio da proximidade foi muito bem aplicado. J o site treforest design, com muita propriedade, utilizou o princpio da proximidade para dividir as informaes presentes. Pode-se notar que os textos (brancos) esto ligados aos respectivos tpicos (amarronzados). A proximidade entre os dois sugere que cada texto referente a cada tpico. Alm disso, quem olha interpreta que so vrios tpicos diferentes em funo da distncia entre cada tpico.

FIGURA 11: COMO DETERMINAR PROXIMIDADE EM SITES

Fonte: http://www.lahive.co.uk/treforest-design/

A Web Major utiliza o princpio da proximidade atravs dos espaamentos e das cores. O retngulo escuro, a chamada principal (possui letras maiores e fica na parte superior); ele separado das chamadas secundrias, que esto abaixo. Estas secundrias, por sinal, so divididas umas das outras atravs do espaamento e do fundo aplicado a cada um. Vejam que elas so interrelacionadas, e isto transmitido devido ao fato de todas apresentarem igual distncia e terem o mesmo background.

FIGURA 12: WEB MAJOR, EXEMPLO DE PROXIMIDADE

Fonte: http://desenvolvimentoparaweb.com/design/

i)

Sistema de Ajuda

conveniente que cada sistema apresente um conjunto de funes de ajuda ao usurio, que possa ser ativado a seu pedido ou a partir do sistema. Dessa forma, o usurio poder esclarecer dvidas e otimizar a sua utilizao do sistema. Na imagem abaixo, pode-se visualizar que o site da empresa Microsoft disponibiliza um menu com acesso ao suporte do usurio, caso este encontre alguma dvida em seus produtos.

FIGURA 13: SISTEMA DE AJUDA

Fonte: www.microsoft.com.br

Um detalhe importante, observado a partir dos exemplos mostrados determinado como o paradoxo da tecnologia: A tecnologia oferece potencial para tornar nossa vida mais simples e agradvel, e cada nova tecnologia traz mais benefcios. E ao mesmo tempo adiciona tamanha complexidade que faz aumentar nossa dificuldade e frustao. [Rocha e Baranauskas, 2000, p27].

1.5 USABILIDADE EM SISTEMAS

Usabilidade refere-se simplicidade e a facilidade com que o usurio consegue interagir com o a interface do sistema web. Pela definio da International Organization for Standardization (ISO), usabilidade a medida pela qual um produto pode ser usado por usurios especficos para alcanar objetivos especficos com efetividade, eficincia e satisfao em um contexto de uso especfico (ISO 9241-11). Sendo assim a usabilidade deve ser utilizada para automatizar a interao usurio-sistema, tornando as aes intuitivas. Para que um usurio possa interagir sem problemas com um sistema, devese observar as cinco metas que usabilidade prope: [Rocha e Baranauskas, 2000]

a)

Facilidade de aprendizagem (learnability)

O sistema precisa ser fcil de aprender de forma que o usurio possa rapidamente comear a interagir. Segundo Nielsen, o mais importante atributo de usabilidade, por ser a primeira experincia que qualquer usurio tem com um sistema. Certamente existem sistemas para aplicaes altamente especializadas e complexas onde se prev um extenso trabalho de treinamento em seu uso, mas na maioria dos casos um sistema deve ser fcil de aprender. Quando se analisa a facilidade de aprendizagem, preciso ter em mente que geralmente o usurio no aprende toda uma interface antes de comear a us-la. Pelo contrrio, o aprendizado ocorre do uso. Portanto, esse fator avaliado em funo do tempo que o usurio demora para atingir um suficiente grau de proficincia na execuo de suas tarefas. b) Eficincia

O sistema precisa ser eficiente no uso, de forma que uma vez aprendido o usurio tenha um elevado nvel de produtividade. Portanto, eficincia refere-se a usurios experientes, aps um certo tempo de uso. Um modo tpico de avaliar esse atributo definir de alguma forma o que significa um usurio experiente e avaliar um grupo desses executando tarefas tpicas de um sistema. c) Facilidade de relembrar (memorability)

O sistema precisa ser facilmente relembrado, de forma que o usurio ao voltar a us-lo depois de um certo tempo no tenha novamente que aprend-lo.

Esse atributo tanto se refere a usurios casuais (que uma categoria com um nmero grande de usurios na maioria dos sistemas) como para aqueles sistemas utilitrios que so inerentemente usados em periodos especficos como os sistemas para confeco de relatrios de atividades trienais, de imposto de renda, etc. Certamente, aumentar a facilidade de aprendizagem tambm torna a interface mais fcil de ser relembrada, mas tipicamente usurios que retornam a um sistema so diferentes dos usurios principiantes. Raramente se avalia esse item, mas notvel a preocupao com ele nas modernas interfaces grficas onde tudo que for possvel visvel. Usurios desses sistemas no precisam lembrar o que est disponvel, pois o sistema sempre o relembra quando necessrio. d) Satisfao Subjetiva

Os usurios devem gostar do sistema, ou seja, deve ser agrdvel de forma que o usurio fique satisfeito ao us-lo. Esse atributo muito relevante quando se considera sistemas usados fora do ambiente de trabalho, tais como jogos, sistemas domsticos em geral, etc. Para esses sistemas o entretenimento e envolvimento so muitas vezes, valores mais importantes que velocidade de processamento. Nielsen (1993) ressalta que satisfao subjetiva como atributo de usabilidade diferente dos estudos que avaliam atitudes gerais das pessoas com relao a computadores. Esses estudos so efetuados no contexto da aceitabilidade social de computadores (LaLomia e Sidowski, 1991) e no como atributo de usabilidade. Entretanto, certamente os sentimentos que as pessoas tm com relao a computadores em muito afeta sua interao com um determinado sistema. Pouco se conhece sobre a relao entre atributos de um determinado sistema e a atitude geral de uma pessoa com relao a computadores. Um dado importante que usurios que percebem que tm um alto grau de controle sobre os computadores tm atitudes positivas com relao a ele (Kay, 1989). E dar controle ao usurio no das solues atuais de design mais frequentes, muito pelo contrrio. Satisfao subjetiva pode ser medida simplesmente perguntando ao usurio sobre suas opinies subjetivas. Para um nico usurio o resultado desse questionamento subjetivo, mas quando se considera muitos usurios, a mdia das respostas passa a ser uma medida objetiva. Isso o que feito na maioria dos estudos de usabilidade. Tipo de questionrios usados e formas de avaliar satisfao subjetiva sero tratados nos tpicos seguintes. e) Erros

Neste contexto, erro definido como uma ao que no leva ao resultado esperado, um "engano" portanto. O sistema precisa ter uma pequena taxa de erros, ou seja, o usurio no pode cometer muitos erros durante o seu uso e, em errando, deve ser fcil a recuperarao, sem perda de trabalho. Erros catastrficos (o usurio perder seu trabalho, no perceber que errou, etc.) no podem ocorrer. Portanto o que se pode observar aps a listagem destas cinco metas da usabilidade, que todo sistema antes de ser projetado, deve ser feita uma anlise do grupo de usurios que ir utiliz-lo, para que o design seja bem projetado e no haja problemas de utilizao de sua interface.

Por exemplo em aplicaes de escritrio, domsticas e de entretenimento, devem possuir grande facilidade de aprendizagem, baixa taxa de erros e satisfao subjetiva, itens fundamentais, pois todos os usurios sero alvo deste tipo de software. J sistemas de uso comercial e industrial, como sistemas de banco, seguros, gerenciamento de carto de crdito, etc, exigem um elevado custo de treinamento, portanto a meta essencial a facilidade de aprendizagem para que os usurios se adequem em pouco tempo.

1.6 USABILIDADE EM SISTEMAS WEB ou Websites

Na dcada em que houve a popularizao da internet, os usurios que faziam uso dos websites disponveis eram na sua maioria profissionais de T.I., visto que o uso do computador ainda no havia sido difundido. Entretanto nos dias de hoje, muitos usurios que fazem uso da internet para pesquisas, trabalhos, publicidade etc, se enquadram em usurios leigos, ou seja, so pessoas que no dominam o uso do computador. Por este motivo os websites devem se assegurar que o seu cliente/usurio entendero o funcionamento destes, caso contrrio eles iro abandon-lo, evitando perda de tempo. O que Jakob Nielsen (2006) divulgou sobre os hbitos dos usurios, era de se esperar. Concluiu-se que os visitantes de sites da web possuem menos pacincia na hora de navegar do que no passado recente. Hoje os usurios preferem acessar um determinado site rapidamente, completar a tarefa e sair. Motivo pelo qual os buscadores, como exemplo: Google, se popularizaram. Da mesma forma que foi estabelecido alguns princpios bsicos sobre usabilidade para sistemas, ser descrito abaixo, conforme Nielsen (1999), pontos importantes que devem ser considerados ao se projetar um Website.

a)

Clareza na Arquitetura da Informao:

essencial que o usurio consiga discernir o que prioritrio e o que secundrio no site. Ou seja, antes de mais nada preciso chegar a um bom arranjo da informao. Os usurios sempre tero dificuldades em encontrar o que procuram, ento devem ser ajudados provendo-se um senso de como a informao est estruturada e localizada. Para se conseguir isso, uma das alternativas adotadas em alguns sites, prover um mapa do site, de forma que os usurios saibam onde esto e para onde podem ir.

FIGURA 14: CLAREZA NA ARQUITETURA DA INFORMAO

Fonte: http://www.ibm.com/br/sitemap/

b)

Facilidade de navegao

Uma site ideal, aquele que o usurio deveria conseguir acessar a informao desejada no mximo em trs cliques. E conseguir organizar a informao dentro disso j um bom princpio. Na imagem abaixo, pode-se observar que para acessar informaes sobre as novelas, necessrio apenas trs cliques, Diverso>Novelas>Passione.

FIGURA 15: FACILIDADE DE NAVEGAO

Fonte: http://www.terra.com.br

c)

Simplicidade

Quem navega quer encontrar o mais rapidamente possvel o objetivo da busca. Portanto, deve-se dar ao usurio paz e tranquilidade para que possa analisar a informao. Cuidados devem ser tomados para que a simplicidade no signifique ausncia de informao. Por exemplo, ao se entrar em uma homepage do site de uma instituio o usurio precisa que duas perguntas bsicas sejam respondidas: Onde eu estou? O que posso obter nesse site? Na imagem abaixo, pode-se observar que as duas perguntas foram respondidas, Onde eu estou?, esta pergunta pode ser respondida atravs da logotipo do instituto, e a segunda pergunta: O que posso obter nesse site?, pode ser encontrado nos menus suspensos.

FIGURA 16: SIMPLICIDADE

Fonte: http://www.ifpa.edu.br

d)

A relevncia do contedo

Se nas revistas ou na televiso, por exemplo, a seduo passa muito pela beleza das imagens, na Web o contedo o que mais importa para atrair e prender a ateno do usurio. Sempre que questionados sobre sites, usurios se referem a qualidade e relevncia do contedo. Um bom texto para essa mdia tem que ser o mais conciso e objetivo possvel, no promocional ou publicitrio, como impera hoje, com perda de credibilidade. preciso alterar o estilo de escrita, de forma a ser otimizado para leitores online que frequentemente imprimem textos e que necessitam pginas bem curtas com a informao secundria deixada para pginas de suporte.

e)

Manter a consistncia

Assim, como para qualquer outro tipo de software, a consistncia um poderoso princpio de usabilidade na Web. Quando as coisas acontecem sempre do mesmo jeito, os usurios no precisam se preocupar a respeito do que ir acontecer. Ao contrrio, eles sabem o que vai acontecer baseados numa experincia anterior. Isso leva a adoo de procedimentos padres, como por exemplo, o uso de cores. Layouts ambiciosos devem ser abandonados. As fontes a serem usadas devem ser as mais comuns, pois o designer no sabe as fontes que o usurio tem instaladas. Outro aspecto bastante verificado e que transparece no design, o de se

gerenciar um projeto para a Web da mesma forma que qualquer outro projeto corporativo tradicional. Isso conduz a um design com uma interface inconsistente. ] Ao invs disso, um Website deve ser gerenciado como um projeto nico de interface com o usurio. O website mostrado na ilustrao abaixo, mantm a consistncia utilizando o mesmo cone para a personalizao da pgina.

FIGURA 17: CONSISTNCIA

Fonte: http://www.submarino.com.br

f)

Tempo suportvel

O tempo de carga das pginas deve ser necessariamente curto. Estudos indicam que 10 segundos o mximo de tempo antes que as pessoas percam o interesse. Mas na Web os usurios j tm uma baixa expectativa, ento esse limite pode aumentar para 15 segundos e mesmo assim ser aceitvel.

g)

Foco nos Usurios

Novamente, todos os princpios podem ser sumarizados em um s: o foco deve estar nas atividades dos usurios. Como cada vez h um nmero maior de pginas, as pessoas esto se tornando impacientes com sites no usveis e no tem pudor algum em mudar - afinal, h atualmente outros dez milhes de sites para ir e nada impede a livre navegao.

PARA SABER MAIS

Para saber mais sobre interface homem-computador, leia os artigos publicados no congresso Simpsio de Fatores Humanos em Sistemas Computacionais, disponvel em: http://www.ufmg.br/swib/?cat=6.

REFLEXES SOBRE A APRENDIZAGEM

Na dcada da popularizao da internet, os sites disponveis na web no possuiam nenhuma preocupao com a usabilidade de sua interface. No eram aplicados testes para verificar quo fcil era o site se aprender explorando. Hoje, h uma grande necessidade de planejar a usabilidade de um sistemas, pois para os usurios h uma variedade de outros sistemas disponveis no mercado, caso a interface no agrade o usurio, este o abandonar.

RESUMO DA UNIDADE
Nesta unidade foi possvel esclarecer o conceito da disciplina interao homem-computador, o porqu que a usabilidade deve ser aplicada em projetos de sistemas web, e que pontos observar na criao de sistemas web e sites.

SUGESTES DE LEITURA
Segue abaixo, algumas sugestes de leitura sobre usabilidade:

Ergonomia do Objeto - Joo Gomes Filho Design de Interao: Alm da interao humano-computador - Preece, Rogers & Sharp Ergonomia: Projeto e Produo - Itiro Iida Ergonomia Prtica - Dul & Weerdmeester Ergonomia e Usabilidade - Walter Cybis