Importância da Interface Gráfica

Por Thais Maia Campos

A importância de um bom código na qualidade final de um software é indiscutível, mas a qualidade de um programa também se baseia em outro aspecto da programação que nem sempre tem a atenção merecida: a interface gráfica, ou interface de usuário.

Assim como o algoritmo, que fica por debaixo dos panos, a interface gráfica tem uma importância fundamental para o sucesso de seu sistema. São inúmeras as técnicas existentes para auxiliar a construção de excelentes softwares, como Design Patterns, POO e POA. Mas quais técnicas auxiliam na elaboração dos desenhos de interfaces gráficas? O que deve ter em mente o programador ou projetista de interface para construir uma boa interface de usuário?

A palavra chave quando falamos em interface de usuário é USABILIDADE. Interfaces gráficas não foram feitas apenas para serem visualmente agradáveis, mas também para facilitarem o trabalho de quem as utiliza. Beleza sem usabilidade pode-se comparar a uma Ferrari sem volante. É linda, porém não vai servir para o propósito ao qual foi feita.

A tarefa do projetista de interface gráfica não é fácil. São cometidos vários equívocos ao desenhar uma nova janela ou página apenas porque não se pensa como um usuário. Se colocar no lugar do usuário é uma tarefa difícil e é o segredo para o sucesso de qualquer projetista de interface. É preciso pensar com qual freqüência o recurso será utilizado, se é crítico, se a velocidade faz diferença, se é acessível via teclado ou exige o uso do mouse… São muitas perguntas, mas o objetivo é apenas um: uma boa interface gráfica é aquela que se comporta da forma como o usuário espera que ela se comporte.

Se você coloca um botão lindo com ícones em 3D, mas não deixa claro para o que ele serve, não está construindo uma interface boa para o usuário. É preciso colocar legendas claras e, se possível, hints explicativos e teclas de atalho explicitas, pois nem todo mundo gosta ou pode ficar utilizando mouse. Se o padrão do sistema operacional é que em caixas de mensagens o botão OK venha antes do Cancelar, o sistema também deve seguir desta forma. Se existe um recurso que ainda não foi implementado, não coloque o botão na janela apenas para que o usuário tenha que clicar e ver que nada acontece. Recursos incompletos são piores que a ausência total deles.

Outra característica interessante relacionada ao usuário: eles não gostam de ler. Portanto, não adianta fazer um manual extenso, explicando minuciosamente como utilizar a nova janela, pois eles não o lerão de forma alguma. Da mesma forma, não adianta escrever caixas de diálogos com textos explicativos muito grandes. Textos curtos e claros são ideais. Usuários também costumam pensar que recursos parecidos devem se comportar da mesma forma. Então, se vai construir uma janela nova, pergunte-se se não existe um padrão a ser seguido. Não inove sem critério, um aplicativo cujas interfaces gráficas têm aspectos funcionais diferentes umas das outras são difíceis de usar.

Caso tenha dúvida sobre qual melhor abordagem para um recurso, não invente. Pergunte ao usuário, faça um teste de interface com ele, observe como ele interage com os botões, menus e mensagens. É a melhor forma de descobrir.

Usabilidade na Web: 11 Dicas para Sites

por João da Fonseca para SEOmaster

Um dos conceitos mais importantes em marketing online e geralmente ignorado, até mesmo por desconhecimento, é a usabilidade na web.

Muitas empresas, que têm consciência da importância de um bom ambiente virtual e querem fazer um bom trabalho, investem pesado para criar seus sites. Encomendam templates sob medida, colocam toda a identidade visual da empresa e o site torna-se o novo queridinho.

O problema é que é comum acabar esquecendo a experiência do usuário, uma vez que o site foi feito somente seguindo as vontades e gostos de quem planejou. Pode acontecer de o visitante entrar no site mas não conseguir chegar ao pedido de orçamento, ou não ter uma estrutura que tenha lógica de navegação.

Agora que já tivemos uma boa quantidade de teorias e definições sobre o tema, veja abaixo a lista com algumas dicas para melhorar a usabilidade.

Dicas de Usabilidade

1 - Diálogos simples e naturais

O site ideal deve apresentar exatamente a informação que o usuário precisa no momento, nem mais nem menos.

Não adianta encher a sua tela de informações para que ele efetue a compra do seu produto, se naquele momento só é importante perguntar qual a forma de envio que ele quer escolher.

Isso também vale para blogs: não encha a página de anúncios, principalmente na parte acima do texto. Isso passa uma grande insegurança para o visitante, diminuindo a credibilidade do site. Além de existir uma grande probabilidade do visitante sair sem ver seu conteúdo, porque ele não rolou a página. Seja consistente

Uma mesma interação ou comando tem que ter sempre o mesmo resultado. Se for incluir um botão de ação dentro das páginas de produtos, ele tem que ter sempre a mesma ação, como “incluir no carrinho” ou “pedir orçamento”.

Se, ao invés disso, exibir diversos botões de ação diferente para cada produto, vai confundir o visitante.

Caso seja necessário, utilize cores, formatos ou posições diferentes para comandos diferentes.

2 - Fale a linguagem do usuário

O conteúdo das páginas deve ser produzido para uma pessoa entender, e não para os robôs do Google. O visitante em primeiro lugar, sempre.

Isso já foi dito diversas vezes pela empresa, então as informações têm que ser organizadas seguindo a lógica do pensamento humano.

Organize o texto seguindo uma ordem natural, com o primeiro parágrafo introduzindo a idéia, o corpo desenvolvendo, e o último fazendo a conclusão. Utilize boas palavras-chave dentro do texto, em lugares que agregue valor ao leitor.

Esse tempo investido para aumentar a qualidade é refletida nas principais métricas de experiência do usuário, como tempo na página e taxa de rejeição.

3 -Ofereça saídas claras

É necessário que o usuário consiga sair do seu sistema ou fazer o logout a qualquer momento, de forma fácil e sem barreiras.

Não faça como muitas empresas que dificultam uma pessoa a sair ou a apagar o seu cadastro. Isso vai contra todas as boas práticas de experiência do usuário. Se ele quiser sair, mostre-o como e pergunte o porquê. Dessa forma você pode ter um feedback e melhorar. Você não coloca obstáculos para seus clientes saírem da sua loja, então também não faça isso no seu site.

4 - Não sobrecarregue a memória do usuário

O sistema tem que ser o mais intuitivo possível, para que seja fácil aprender a executar as etapas necessárias, e consiga facilmente criar um mapa mental, que irá ajudá-lo a navegar pelo site.

O melhor método para isso é deixar bem claro o caminho, o ideal seria deixar poucas e claras opções de ação.

Um bom caso de sucesso é o Twitter. É muito fácil aprender que pode digitar no máximo 144 caracteres (tem até um contador regressivo), e postar. Simples!

No entanto, na maioria das vezes isso não é possível, aí é importante que mesmo oferecendo diversas opções de atalhos, a principal deve ter um destaque para facilitar a construção do mapa mental para o usuário.

5 - Diminua os erros

Identifique quais são as principais situações de erro dentro do seu site. Vou dar a dica de uma técnica simples: faça uma lista dos 10 problemas mais comuns, começando pelo que mais se repete. Com a lista pronta, pegue os dois primeiros problemas e os resolva. Dessa forma, é provável que 80% da quantidade de problemas irá diminuir, somente por resolver os mais recorrentes. Vale sempre a pena investir nesse salto de qualidade do site.

6 - Mostre os benefícios

Seu site deve mostrar claramente quais são os benefícios que oferece ao usuário. Crie uma lista dos principais benefícios que seu site oferece, pois chama muito mais atenção do que um texto descritivo.

É melhor deixar explícito para o visitante sobre o que é o seu site, para fazê-lo ficar curioso, e querer explorar o site.

Dica: Faça o Teste dos 5 Segundos. Peça para alguém acessar o site durante 5 segundos, e responder sobre o que era o conteúdo, o que era oferecido, etc. Se ele tiver dificuldade, é hora de melhorar!

7 - Tenha atalhos de navegação

Os usuários que já conhecem seu site devem conseguir executar suas funções com rapidez. Disponibilizar atalhos, menu detalhado ou links para páginas mais visitadas são algumas sugestões. Pense no que seu site oferece e como seu usuário interage com ele, então imagine o que irá facilitar que seu usuário chegue ao seu objetivo.

8 - Dê feedback

O site é uma mídia digital com grande capacidade de interação. O usuário espera uma resposta do sistema quando passa o mouse em cima de um link, por exemplo.

É ótimo que o mouse e a cor do botão mude, pois fica claro que se clicar ali uma outra parte do site será apresentada. Destaque as funções do seu site, indicando de alguma forma onde existe interação. Só a mãozinha de link não basta. O site deve informar a todo momento ao usuário o que está acontecendo.

Diferente de um livro, que só se pode ler, seu site pode ter incontáveis interações. Aproveite essa vantagem!

9 - Crie boas mensagens de erro

Apesar de trabalhar para diminuir a quantidade de erros, infelizmente você não conseguirá eliminar todos. Então crie uma mensagem de aviso para cada erro que ocorrer, e é muito importante que cada um deva ser identificado claramente, explicando para o usuário o que aconteceu.

Não basta colocar “Erro 3″, como o Google faz no Hangout, sua ferramenta de videochat. Sua linguagem deve ser clara e sem códigos sem explicação, justamente porque devem ajudar o usuário a entender e resolver o problema. E principalmente, NUNCA culpe o usuário.

10- Página de Ajuda

Seu sistema tem que ser planejado para que seja operado de forma tão fácil que não necessita de ajuda. No entanto, essa é uma situação ideal, e por melhor que ele fique, sempre alguém vai ficar com dúvidas.

Então disponibilize uma Ajuda ao Usuário, podendo ser na página ou em um endereço independente, que deve estar facilmente acessível.

Pode até mesmo ser um chat online, com uma janelinha que fica no canto com alguém sempre à disposição para tirar dúvidas.

11 - Pós-Leitura
Utilize os Goals e Eventos do Analytics

Antes que você implemente os pontos abordadas acima, é muito importante que defina claramente o que está mudando, e quais seriam as métricas para ter um controle e saber se realmente essa alteração teve benefícios para o seu site ou não. Utilize o sistema de Goals que o Google Analytics oferece, que não é muito difícil de configurar.

Teste A/B

Se depois de ler todas as dicas, ficou confuso e várias ideias diferentes surgiram, isso é ótimo! Mas aí você se pergunta como juntar elas, ou qual seria a melhor.

Não podemos saber como nosso visitante vai reagir, pois o comportamento pode variar muito de acordo com o tipo de site, com o mercado e até mesmo com a cultura individual. Para isso é indispensável que faça um Teste A/B, para validar as suas alterações e ver se realmente melhoram a experiência do seu site.

É muito importante que sempre teste as mudanças que fizer no seu site, para ir tornando-o melhor para seu usuário. Cada investimento vale muito, pois com certeza seu visitante irá sentir diferença!

Interface e Usabilidade: Como levar o usuário onde queremos!

Por Marcelo Prudente

Interface e Usabilidade: Como levar o usuário onde queremos! from Marcelo Prudente

Princípios gerais de usabilidade em web sites

Por Eduardo Manchón

Embora estes princípios podem parecer muito gerais, são a base da disciplina e de sua extrapolação e perfeita compreensão permite resolver qualquer casuística concreta.

1. Antecipação, o web site deve antecipar-se às necessidades do usuário.

2. Autonomia, os usuários devem ter o controle sobre o web site. Os usuários sentem que controlam um web site se conhecem sua situação em um meio abrangente, mas não infinito.

3. Há que utilizar as cores com precaução para não dificultar o acesso aos usuários com problemas de distinção de cores (aprox. um 15% do total).

4. Consistência, as aplicações devem ser consistentes com as expectativas dos usuários, ou seja, com sua aprendizagem prévia.

5. Eficiência do usuário, os web sites devem centrar-se na produtividade do usuário, não no próprio web site. Por exemplo, às vezes as tarefas com maior número de passos são mais rápidas de realizar para uma pessoa que outras tarefas com menos passos mas mais complexas.

6. Reversibilidade, um web site há de permitir desfazer as ações realizadas

7. Lei de Fitts indica que o tempo para alcançar um objetivo com o mouse está em função da distância e do tamanho do objetivo. A menor distância e maior tamanho mais facilidade para usar um mecanismo de interação.

8. Redução de tempo de latência. Torna possível otimizar o tempo de espera do usuário, permitindo a realização de outras tarefas enquanto se completa a prévia e informando ao usuário do tempo pendente para a finalização da tarefa.

9. Aprendizagem, os web sites devem requerer um mínimo processo de aprendizagem e devem poder ser utilizados desde o primeiro momento.

10. O uso adequado de metáforas facilita a aprendizagem de um web site, mas um uso inadequado destas pode dificultar enormemente a aprendizagem.

11. A proteção do trabalho dos usuários é algo prioritário, deve-se assegurar que os usuários nunca percam seu trabalho por conseqüência de um erro.

12. Legibilidade, a cor dos textos deve contrastar com a do fundo, e o tamanho de fonte deve ser suficientemente grande.

13. Continuação das ações do usuário. Conhecendo e armazenando informação sobre seu comportamento prévio deve-se permitir ao usuário realizar operações freqüentes de maneira mais rápida.

14. Interface visível. Deve-se evitar elementos invisíveis de navegação que há de ser inferidos pelos usuários, menus desdobráveis, indicações ocultas, etc.

Outros princípios para o design de web sites são:

a) Os usuários devem ser capazes de alcançar seus objetivos com um mínimo esforço e com resultados máximos.

b) Um web site não pode tratar o usuário de forma hostil. Quando o usuário comete um erro o sistema deve solucionar o problema, ou por padrão sugerir varias soluções possíveis, mas não emitir respostas que meramente informem do erro culpando o usuário.

c) Em nenhum caso um web site pode ir abaixo ou produzir um resultado inesperado. Por exemplo, não devem existir links quebrados.

d) Um web site deve se ajustar aos usuários. A liberdade no uso de uma web site é um termo perigoso, quanto maior for o número de ações que um usuário possa realizar, maior será a probabilidade que cometa um erro. Limitando o número de ações ao público objetivo facilita-se o uso de um web site.

e) Os usuários não devem sofrer sobrecarga de informação. Quando um usuário visita um web site e não sabe por onde começar a ler, existe sobrecarga de informação.

f) Um web site deve ser consistente em todos os passos do processo. Embora possa parecer apropriado que diferentes áreas tenham designs diferentes, a consistência entre os designs facilita ao usuário o uso de um site.

g) Um web site deve prover de um feedback aos usuários, de maneira que estes sempre conheçam e compreendam o que acontece em todos os passos do processo.

Fonte: Criar Web

Interface, interação e usabilidade

Confira a apresentação ded Guilherme Menga e Lucas Húngaro sobre interface, interação e usabilidade.

Interface Interação E Usabilidade from guimenga

Que tal acompanhar a copa de seu Iphone?

Muitas marcas estão adotando os aplicativos (apps) para Iphone como estratégia de marketing para se aproximar de seus clientes.

A Finger Tips é uma empresa que planeja e desenvolve aplicativos e soluções das mais diversas para iPhone e Android. Foram eles que desenvolveram o aplicatico Copa do Mundo.

O aplicativo Copa do Mundo foi desenvolvido para dar ao usuário uma solução completa de acompanhamento do maior campeonato de futebol do planeta. Dentre as funcionalidades destacam-se:

•Tabela da Copa;
•História das Copas;
•Tudo sobre a África do Sul, as cidades sedes e os estádios;
•Perfil completo das seleções e seus 22 jogadores;
•Narração minuto-a-minuto de todos os jogos;
•Estatísticas de todos os jogos e performances das seleções, atualizadas em tempo real;
•Twitter integrado à narração minuto-a-minuto;
•Programação de alertas Push para os gols, início e/ou final das partidas;

•Além da cobertura em tempo real, os usuários do aplicativo poderão se divertir simulando resultados dos jogos e calcular a sequência do campeonato até a final.

Gostou? Quer saber esse e outros aplicativos para seu Iphone?

Animação e Usabilidade

Vocês sabiam que hoje é o dia mundial da usabilidade? O evento é promovido pela UPA (Usability Professionals' Association) desde 2006. No site do evento é possível ver todas as comemorações que acontecerão hoje ao redor do mundo.

Usabilidade pode ser definida, segundo o site Usabilidoido como "o mesmo que facilidade de uso. Se um produto é fácil de usar, o usuário tem maior produtividade: aprende mais rápido a usar, memoriza as operações e comete menos erros."

Mas o que usabilidade tem a ver com animação? Tudo! Animações são recursos muito usados pelos sites como elementos de design. Mas elas podem tanto ajudar como atrapalhar.

Os principais problemas na utilização das animações são: excesso de animação, o que tira a atenção do usuário do site, problemas de carregamento nas páginas e incompatibilidade com alguns tipos de browser.

Mas isso não quer dizer que elas tenham que ser excluídas, o importante é saber quem é o usuário do site e ter bom senso.

E feliz dia da usabilidade!