Avaliação dos Princípios de Usabilidade
Amilcar Bittencourt1 , Roberto Müller1 , William Schneider 11 Departamento de Engenharias e Ciência da Computação – Curso de Ciência da
Computação – Universidade Regional Integrada do Alto Uruguai e das Missões (URI) Campus Santo Ângelo – Santo Ângelo – RS – Brasil
amilcarbittencourt@gmail.com, rmulcom@hotmail.com, will.schneider@hotmail.com
Resumo. Este artigo visa fazer uma avaliação dos principias de usabilidade
de uma pagina web. O objetivo é criar uma análise completa da pagina sobre os conceitos de usabilidade na web, conferindo se o site avaliado atende aos Princípios de Usabilidade e Princípios de Usabilidade na Web compreendidos em aula. A página escolhida para o desenvolvimento deste trabalho foi a da Globo.com (http://www.globo.com).
1. Introdução
Desde a criação da Internet, a tecnologia para construção de sites vem sendo muito incrementada permitindo o desenvolvimento de aplicações cada vez mais complexas que utilizam a web não apenas para troca de informações, mas como plataforma para aplicações tais como comércio eletrônico e intranets. Assim como as aplicações evoluem, os designers exploram as novas tecnologias, pois entendem a mesma e percebem a necessidade de evolução humana.
Durante esta evolução o número de usuários e de sites cresceu exponencialmente e a web tornou-se acessível a praticamente todas as pessoas contando com uma grande variedade de aplicações. Contudo, observa-se que tal popularidade não implica necessariamente em satisfação dos usuários, que se confrontam muito freqüentemente com problemas de usabilidade.
Interface de usuário tem ajuda e muito no dia a dia de muitas pessoas como, por exemplo, ambientes de aprendizagem, segurança para vôos de aeronaves, etc. Mas é também motivo de preocupação, pois muitas vezes o usuário se depara com muitas situações de erros ou com designs muito complexos e com uma aprendizagem de uso muito difícil.
Quando a usabilidade, conceito utilizado para descrever a qualidade de uso de uma interface, é levada em conta durante o processo de desenvolvimento de interfaces, vários problemas podem ser eliminados. Por exemplo, pode-se reduzir o tempo de acesso à informação, tornar informações facilmente disponíveis aos usuários e evitar a frustração de não encontrar informações no site.
Tendo base isso, existe uma série de métodos de avaliação que podem ser utilizados em diferentes etapas do desenvolvimento de interfaces a fim de solucionar ou ao menos minimizar os problemas.
Por fim, é apresentada nesse trabalho uma avaliação de um site da web, seguindo os conceitos de IHC (Interface Homem-Computador), realizado sobre os dados coletadas pelos três autores deste artigo.
2. IHC
O Estudo da Interação Humano-Computador envolve conhecimento sobre o Humano por um lado, sobre a tecnologia por outro e sobre as maneiras como um influencia e é influenciado pelo outro.
O principal objetivo de IHC é produzir sistemas usáveis, seguros e funcionais, assim como desenvolver ou melhorar a segurança, utilidade, efetividade e usabilidade de sistemas computacionais. Sabemos que até bem pouco tempo atrás existia uma preocupação grande no aprendizado e utilização de um determinado software, mas não a preocupação se este software oferecia condições para que o usuário de forma lógica compreendesse o que estava sendo proposto a ele. É comum encontrarmos usuários que não utilizam todos os recursos que um determinado software oferece, e muitas vezes nem os conhecem.
O sistema desenvolvido deve ter uma boa usabilidade, o sistema deve ser fácil de aprender, eficiente, fácil de lembrar onde se encontram os botões, ícones, comandos e ajuda, os erros encontrados são constantes levando a uma perda considerável de tempo para solução de problemas e satisfação subjetiva.
Nos estudos de IHC é analisado a capacidade dos usuários. Visando atender as necessidades do usuário é importante lembrar que fatores que devem ser trabalhados em um sistema.
1. Fatores Organizacionais – treinamentos, políticas, organização do trabalho etc. 2. Fatores Ambientais – barulho, aquecimento, ventilação, luminosidade etc. 3. Saúde e Segurança – estresse, dores de cabeça, perturbações musculares etc. 4. Conforto – posição física, layout do equipamento etc.
5. Interface do Usuário – dispositivos 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.
6. Tarefa – fácil, complexa, nova, alocação de tarefas, repetitiva, monitoramento, habilidades, componentes etc.
7. Restrições – custos, orçamentos, equipe, equipamento, estrutura do local de trabalho etc.
8. Funcionalidade do Sistema – hardware, software, aplicação
9. Produtividade – aumento 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.
Partindo dos objetos que nos cercam podem-se identificar alguns princípios básicos de um bom designer:
Visibilidade e affordances – leva em consideração necessidades imediatas do
usuário tais como se o usuário necessita de ajuda para solução de seu problema e se esta ajuda existe e está ao seu alcance. Quanto ao conteúdo que aparece na tela apenas as coisas necessárias devem estar visíveis para indicar quais as partes podem ser operadas e como, eliminando assim a "poluição" visual que dificulta encontrar o desejado.
A visibilidade indica o mapeamento entre ações pretendidas e as ações reais. Indica também distinções importantes como por exemplo diferenciar a vasilha do sal da
do açúcar. É importante que o usuário visualize o efeito das operações, sendo que a falta da visibilidade torna muitos dispositivos controlados por computadores tão difíceis de serem operados.
Affordance é o termo definido para se referir às propriedades percebidas e
propriedades reais de um objeto, que deveriam determinar como ele pode ser usado. Como por exemplo 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
Bom modelo conceitual - um bom modelo conceitual permite prever o efeito de
ações. Sem um bom modelo conceitual opera-se sob comando, cegamente. Um exemplo prático é a tesoura que permite conhecer o resultado antes de usá-la. Já no que diz respeito a um contra exemplo seria os relógios digitais possuindo dois e até quatro botões deixando a desejar a funcionalidade dos botões.
Bons mapeamentos - é o 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, normalmente aproveitam analogias físicas e padrões culturais.
Feedback significa 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.
A tecnologia oferece potencial para tornar nossa vida mais simples e agradável, e cada nova tecnologia traz mais benefícios. Ao mesmo tempo adiciona tamanha complexidade que faz aumentar nossa dificuldade e frustração. É o paradoxo da tecnologia, levando muitos usuários a resistência ao depararem com ela.
Sempre que o número de funções excede o número de controles, o design torna-se arbitrário, não natural e complicado, distante do usuário, uma vez que para ele a mesma tecnologia que simplifica a vida provendo um maior número de funcionalidades em um objeto, também a complica tornando muito mais difícil aprender e usar. Aí reside a necessidade dos conceitos de IHC serem aplicados de forma coesa para fortalecer o elo homem-máquina.
Mas o que é usabilidade? Usabilidade é definida como o grau com que o usuário consegue realizar uma tarefa. Pode-se averiguar a usabilidade verificando se a funcionalidade é correta, se existência eficiência de uso, facilidade de aprendizagem, facilidade de relembrar ações já feitas, tolerância a erros e se a satisfação é subjetiva.
3. Usabilidade
A avaliação de usabilidade da pagina vai ser por meio da avaliação de heurísticas. A Avaliação Heurística pode ser conduzida por um pequeno conjunto de 3 a 5 avaliadores examinando a interface e analisando o atendimento as heurísticas de usabilidade.
Para esta avaliação deverá ser utilizado duração de uma sessão será algo em torno de duas horas. Durante haum observador e a sessão de avaliação o avaliador
percorre a interface diversas vezes inspecionando as diferentes componentes do diálogo e comparando-as com a lista de princípios de usabilidade. O avaliador é quem decide como conduzir a avaliação, sendo que deverá percorrer a interface pelo menos duas vezes.
3.1 Princípios de Usabilidade
Usabilidade como já descrito anteriormente é o conceito utilizado para descrever a qualidade da interação de uma interface diante de seus usuários. A interface de um sistema é o meio por qual o sistema e o usuário se comunicam, em outras palavras, a interface pode ser considerada a “embalagem” do software ou sistema.
Problemas de usabilidade ocorrem quando o desenvolvedor negligencia a facilidade de aprender, a simplicidade de utilização ou características como ser amigável e direta. Isso leva ao usuário encontrar dificuldades para realizar uma tarefa na interface, o que resulta em perda de eficiência, diminuição da produtividade, entre outros problemas, podendo chegar até a perda de dados.
Na web, problemas de usabilidade em sua maioria estão relacionados à navegação, ou seja, o usuário tem dificuldades ou não consegue encontrar a informação desejada. Mas há problemas também por outros motivos, como por exemplo, a utilização muitas e diversas cores em um mesmo site.
A interpretação do que é um problema de usabilidade pode variar, e, portanto o quê representa um problema para um usuário pode não ser um problema para outro. Contudo, existem alguns problemas comuns a grande maioria, e com isso é possível identificar fatores a serem observados para a determinação de um problema de usabilidade, tais como:
Visibilidade do Status do Sistema: O sistema precisa manter os usuários
informados sobre o que está acontecendo, fornecendo um feedback adequado dentro de um tempo razoável.
Site globo.com: A página oferece de certo modo um feedback consistente com o
cenário atual, por exemplo, se o usuário clicar em determinado link e o link estiver online, então informações relativas aquele link serão apresentadas, porém caso o link encontre-se off-line então será apresentado uma mensagem informando ao usuário que o link já foi removido ou não se encontra no ar no momento. Outro exemplo desse princípio pode ser observado no menu de categorias superior (notícias, esportes, entretenimento, vídeos) quando o usuário selecionar determinada categoria a página apresentará uma barra de foco sobre a categoria selecionada.
Figura 1. Exemplo de Visibilidade de Status do Sistema
Compatibilidade do Sistema com o Mundo Real: O sistema precisa falar a linguagem do usuário, com palavras, frases e conceitos familiares ao usuário, ao invés de termos orientados ao sistema.
Site globo.com: O sistema apresenta um padrão de cores, cada cor foi escolhida
cuidadosamente de modo a representar o conteúdo associado, por exemplo, a categoria notícias foi associada a uma cor de destaque (vermelho). Por exemplo, na categoria esportes, cada time de futebol é representado por seu brasão. Além disso, o site também apresenta linguagem popular sempre visando o maior entendimento por parte do usuário.
Figura 2. Exemplo de Compatibilidade com o Mundo Real
Controle do Usuário e Liberdade: Os usuários freqüentemente escolhem por
engano funções do sistema e precisam ter claras saídas de emergência para sair do estado indesejado.
Site globo.com: O site é destituído de mecanismos de saída de situações
desagradáveis. Ficando a cargo do navegador tal requisito.
Consistência e Padrões: Os usuários não precisam adivinhar que diferentes palavras, situações ou ações significam a mesma coisa. Seguir convenções de plataforma computacional.
Site globo.com: O site apresenta uma boa consistência quanto ao padrão de cores
e fontes utilizadas, por exemplo, as manchetes possuem uma fonte maior do que as demais notícias, quanto às cores cada categoria principal possui suas respectivas notícias associadas a uma cor. Ver exemplo conforme a Figura 2 acima posicionada.
Prevenção de Erros: Melhor que uma boa mensagem de erro é um design
cuidadoso o qual previne o erro antes dele acontecer.
Site globo.com: O site não possui nenhum mecanismo de prevenção de erros. Reconhecimento em Vez de Memorização: Tornar objetos, ações e opções
visíveis.
Site globo.com: O reconhecimento é bastante utilizado no site globo.com,
exemplos disto podem ser observados já na página inicial onde o usuário pode associar cada manchete à determinada categoria apenas pela cor, ou ainda na seção de esportes onde é possível reconhecer um determinado time apenas pelo seu escudo.
Flexibilidade e Eficiência de Uso: Usuários novatos se tornam peritos com o
uso. Prover aceleradores de forma a aumentar a velocidade da interação. Permitir a usuários experientes "cortar caminho" em ações freqüentes.
Site globo.com: Após a primeira interação com o site o usuário consegue acessar
mais rapidamente o conteúdo desejado. Por exemplo, um usuário que procura conteúdo relacionado a entretenimento de cara já seleciona a categoria correspondente.
Estética e Design Minimalista: Não deve conter informação irrelevantes ou raramente necessárias.
Site globo.com: Como o site é um agregador de conteúdo pode possuir
informação irrelevante para um usuário, mas para outro pode ser exatamente o conteúdo que ele busca.
Ajudar os Usuários a Reconhecer, Diagnosticar e Corrigir Erros:
Mensagens de erro devem ser expressas em linguagem clara (sem códigos) indicando precisamente o problema e construtivamente sugerindo uma solução.
Site globo.com: O site raramente ou quase nunca apresenta algum tipo de erro,
desse modo não conseguimos constatar mensagens informando ou apontando solução para um determinado erro.
Ajuda e Documentação: Embora seja melhor um sistema que possa ser usado sem documentação, é necessário prover help e documentação. Essas informações devem ser fáceis de encontrar, focalizadas na tarefa do usuário e não muito extensas.
Site globo.com: Não disponibiliza ajuda para a navegação na pagina, pois não
necessita já que sua usabilidade é bem disposta.
4. Usabilidade na Web
A Internet como ferramenta tecnológica cria um espaço universal para o compartilhamento de informações, servindo como alternativa comercial para empresas virtuais, mudando todo o sistema de comunicação entre pessoas e empresas, de gestão estratégica e o próprio comportamento do consumidor, por eliminar os limites territoriais entre empresas e o mundo.
Dados estatísticos apontam que muitos bilhões de dólares já deixaram de serem ganhos na Web norte-americana devido a designs mal feitos. Sabemos que com a enorme oferta de alternativas os usuários de internet tem uma notável impaciência e insistência em gratificação imediata, portanto a usabilidade governa a Web, se o cliente não encontrar o produto, ele não o comprará. O cliente detém o poder, uma vez que quem clica no mouse decide tudo. Afinal, é tão fácil ir a outro lugar; todos os concorrentes do mundo estão a um simples clique do mouse. Portanto a usabilidade assume uma importância substancial na economia da Internet.
Quanto ao design de produtos e de software tradicionais, os usuários pagam antes e experimentam a usabilidade depois. Isto não acontece na Web onde os usuários experimentam a usabilidade antes e pagam depois, ou seja, a má usabilidade equivale a nenhum cliente.
Com toda essa importância da usabilidade na web cada vez mais os sites (paginas) devem atender aos princípios estabelecidos pela IHC para a usabilidade na web, para que o usuário possa fazer um bom uso da pagina.
4.1. Princípios da Usabilidade na Web8
A seguir estão relacionados os princípios estudos e que serão levados em conta na avaliação do site escolhido.
Clareza na arquitetura da informação: É essencial que o usuário consiga
discernir o que é prioritário e o que é um bom arranjo da informação, fará com que os usuáriossecundários na ferramenta não tenham dificuldades em encontrar o que
procuram.
Site globo.com: As informações encontram-se dispostas de maneira bem
eficiente, por exemplo, as principais manchetes do dia estão na parte central superior da página, desse modo, o usuário não precisa utilizar a barra de rolagem para procurar as principais informações do dia. Também é possível destacar várias hierarquias de menus, um mais genérico e localizado na parte superior do site. Segundo esse menu o conteúdo do site encontra-se dividido em quatro categorias principais: notícias, esportes, entretenimento e vídeos, quando o usuário clica num desses menus é aberta uma nova página com as principais manchetes daquela categoria. Já as categorias citadas anteriormente também são subdivididas em diversas categorias, e estão localizadas no lado esquerdo do site, como por exemplo, a categoria esportes encontra se dividida em atletismo, basquete, etc.
Figura 4. Exemplo de Clareza na Informação.
Facilidade de navegação: O usuário deveria conseguir acessar a informação
desejada no máximo em três cliques. Sentir-se perdido na pagina causa desinteresse em continuar a navegar.
Site globo.com: As principais informações do dia o usuário consegue acessar
com apenas um clique, mesmo as informações que não possuam o destaque dado a uma manchete são acessadas em menos de três cliques. Por exemplo, se você deseja saber a reportagem inteira de uma das principais manchetes do seu time, basta clicar em esportes, clicar no escudo do seu time e depois na manchete desejada. Exemplo visual conforme figura 3.
Simplicidade: Quem navega quer encontrar o mais rapidamente possível o
Site Globo.com: Trata-se de mais um princípio bem atendido no site, visto que,
escancarada na parte superior do site é disponibilizada uma barra de busca e ainda três opções para o usuário selecionar em qual fonte deseja fazer a pesquisa, sendo as opções no próprio site, no site de busca Google ou ainda no shopping (página de vendas do site globo.com). Além disso, a simplicidade também pode ser vista no resto da página, como nas manchetes, visto que cada para obter mais informação sobre uma determinada manchete basta clicar em cima da mesma. A não contém links extravagantes que possam causar um choque ou até mesmo desviar a atenção do usuário.
A Relevância do Conteúdo: Informações secundárias deverão ser deixadas para
páginas de suporte. A página deve enfocar o conteúdo atribuído.
Site Globo.com: Como o site possui um conteúdo diversificado a quantidade de
informação dos mais variados assuntos é extremamente grande, por isso, o site apresenta uma enorme quantidade de manchetes, desse modo é possível apresentar todo conteúdo relevante em apenas uma página, caso o usuário se interesse por determinada informação basta que ele clique na manchete.
Manter 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.
Site Globo.com: Como pode ser visto o site possui um padrão de cores, sendo
uma cor para cada categoria principal, por exemplo, o vermelho para as notícias, o verde para os esportes, o laranja para o entretenimento e o azul para os vídeos. As manchetes espalhadas pelo site também são destacadas com uma determinada cor, por exemplo, uma manchete informando sobre a vitória de seu time possui a cor verde, desse modo o usuário sabe que aquela manchete está associada a esportes. As cores atribuídas a cada categoria não foram escolhidas aleatoriamente as cores são escolhidas propositalmente de modo a facilitar a vida do usuário, por exemplo, a cor vermelha foi associada à categoria notícias pois é uma cor de destaque assim como as principais notícias, já a cor verde foi atribuída a esportes por representar campos de futebol, visto que é o esporte mais popular do país.
Figura 5. Exemplo de Consistência
Tempo Suportável: O tempo de carga das páginas deve ser curto, 15 segundos é
o máximo de tempo antes que as pessoas percam o interesse.
Site Globo.com: O tempo de carga da pagina é relativamente suportável, pois
não contem muitas aplicações pesadas para serrem carregadas. O tempo de carga também é relativamente semelhante nos principais navegadores como (Mozilla, Internet Explorer, Opera).
Foco nos Usuários: A ferramenta deve oferecer para que o usuário possa fazer o
Site Globo.com: O site não desvia o foco do usuário, o usuário não
encontra dificuldades para encontrar o que ele deseja, pois a página não desvia para outras informações que não sejam do foco do usuário.
6. Conclusão
Conforme estudado, a usabilidade é uma área que tem se expandindo muito ultimamente. Os sites da internet estão se voltando para oferecer uma grande interação com o usuário, e é aí que surgem diversos desafios para a produção de sites. Embora o conceito de usabilidade seja simples, fornecendo ao usuário a possibilidade de realizar tarefas corretamente e atingir os objetivos, grande parte dos sites encontrados não possuem boa usabilidade.
Assim com a web está em evolução e é dinâmica, os usuários também são dinâmicos e nenhum tem o perfil igual a outro, sendo assim, há mudanças no meio de utilização das interfaces podendo haver ou não novos problemas não reconhecidos anteriormente.
Este trabalho procurou trazer alguma luz sobre estes pontos e alertar para esta problemática. A usabilidade na web é um campo em plena expansão devendo reservar muitas novidades para o futuro, pois como é de praxe, a informática está sempre em evolução.
Referências
Rocha, H e Baranauskas M (2003) “Design e Avaliação de Interfaces Humano-Computador. Instituto de Computação da Universidade Estadual de Campinas
Nielsen, J. (1993) “Usability Engineering”
Site Viva O Linux “http://www.vivaolinux.com.br/artigo/Avaliacao-da-interface-do-sistema-operacional-Linux?pagina=3. Acessado em 10/11/2009.
Materiais de aula da professora Cristina Paludo. http://www.urisan.tche.br/~paludo/IHM/. Acessado em 10/11/2009.
Site Monografias, http://br.monografias.com/trabalhos/ferramentas-ead-ihc-ensino-distancia/ferramentas-ead-ihc-ensino-distancia.shtml. Acessado em 10/11/2009.
