Descubra qual a região do seu site tem mais impacto visual
Esta semana assisti a uma palestra (em vídeo) sobre o produto Adsense do Google. Além das já tradicionais dicas sobre o melhor uso da ferramenta, o palestrante fez algumas considerações que merecem destaque.
Ao ilustrar como os usuários visualizam uma página web, ele argumentou que o olhar do internauta faz um percurso semelhante a letra “F“, partido de cima para baixo. Segundo ele esta conclusão (já bastante conhecida) pode ser facilmente verificada através do mapeamento das áreas da página web, onde o “fluxo da visão” passa.
Através dos testes de Eye tracking (já publicamos uma artigo sobre o tema aqui no Chapa) é possível mapear o chamado “fluxo da visão” em uma página web.
Eye tracking é o processo de medição, quer do ponto de olhar (“onde estamos olhando”) ou o movimento de um olho em relação à cabeça. Um olho tracker (eye tracker) é um dispositivo de medição da posição dos olhos e dos movimentos oculares. Olho trackers são utilizados na investigação sobre o sistema visual, na psicologia, na lingüística cognitiva e na concepção dos produtos. Há uma série de métodos de medição de movimentos oculares. O mais popular deles usa imagens de vídeo a partir das quais se extrai a posição dos olhos. Outros métodos de pesquisa utilizam bobinas ou se baseiam na electrooculograma.
Os testes de Eyetracking são caros e praticamente inacessíveis para a grande maioria das nossas organizações públicas.
Porém, a cada dia somos surpreendidos pela criatividade humana. Para nossa alegria descobrimos que já existem ferramentas gratuitas para mapear o fluxo da visão em uma página web!!!!!!
Isso mesmo, você pode saber agora mesmo qual o “fluxo da visão” das páginas do site da sua organização pública.
A maioria destas ferramentas produzem os chamados Heatmaps (mapas de calor, em tradução mais literal).
O heatmap seria um mapa de quais áreas de seu site chamam mais a atenção dos visitantes, e quais tem menor impacto. A forma gráfica que o Heatmap utiliza para descrever essa “atividade ocular” é baseada no uso de cores quentes, como vermelho (áreas que mais chama a atenção) e cores frias, como a cor azul (chamam menos a atenção).
Entre as ferramentas testadas pelo Chapa Branca, uma se destacou, a ferramenta Feng-GUI. Como já falamos, este é um serviço gratuíto de geração de heatmaps. O serviço consiste de um mecanismo de inteligência artificial que simula a visão do olho humano, e, mostra como as diferentes áreas de seu site estimulam a visualização do internauta. O objetivo é aproveitar as áreas “quentes” para incluir conteúdo estratégico e trabalhar as áreas “frias” de forma a torná-las mais “atraentes” aos olhos do seu público.
Veja abaixo o Heatmap do Chapa Branca (clique para ver a imagem ampliada):
Importante: Ao fazer o upload da imagem do seu site, recomendamos o envio quadro a quadro ao invés de enviar a captura do site integral. Devemos ter em mente que o usuário não visualiza o site todo de uma vez, mas sim em partes, descendo a barra de rolagem. Por isso envie somente o que o usuário visualiza se quiser obter um melhor resultado.
Acesse agora mesmo a ferramenta no endereço http://www.feng-gui.com/ e economize alguns milhares de dólares de dinheiro público. hehehehehehehehe
Hélio Teixeira, é publicitário, especialista em gerenciamento de identidade corporativa e apaixonado por Design Gráfico e Web Design. É consultor de Comunicação e Marketing e já prestou consultoria a grandes empresas nordestinas. No mercado publicitário atuou nas áreas de Planejamento de Mídia, Direção de Arte e Criação. Presta serviços de assessoria a instituições públicas desde o ano 2000.
Popularity: 18% [?]



Hélio que legal este artigo. Uma ferramenta muito útil para todos nós gestores de conteúdo na web. Fácil de usar e bastante prático. Já começamos a gerar os Heatmaps das nossas páginas e os primeiros resultados obtidos são bastante “reveladores”. Mais uma vez parabéns pelo excelente trabalho do Chapa e pela brilhante idéia de criar um veículo tão útil a todos nós.
Hélio, a leitura do Chapa já está se tornando um hábito em minha rotina diária. É justamente a leitura deste tipo de arquivo que me fizeram desenvolver esse hábito diário. Muito bom o artigo e sobretudo muito útil a todos aqueles que trabalham com comunicação visual na web. Show de bola mesmo. Quero parabenizar os responsáveis pelo Blog pela excelente “qualidade visual” deste veículo. Uma obra prima do bom gosto. Ficou lindo, gostosos de ver e ler. Parabéns pela iniciativa e pelo excelente trabalho.
Concordo com o Alexandre, o Chapa Branca é um verdadeiro colírio para os olhos. Já mostrei ao pessoal da agência e todos babaram com a interface. PARABÉNS!!!!
Ótimo recurso Hélio. Ótimo recurso… Obrigado pela dica.
Já conhecia a ferramenta e recomendo o uso. Já me tirou de muita enrascada, quando tive que convencer alguns clientes a seguirem meus conselhos. rsrsrsrsrsrsrs
Hélio,
Seria interessante ver os resultados obtidos com os sites das Câmaras que já estão utilizando o Portal Modelo do Interlegis. Isso serviria para melhorar o modelo e orientar as casas que ainda não o adotaram em possíveis customizações.
Abs
Silvia
[...] Chapa os artigos “Eyetracking. A ciência a serviço da comunicação visual” e “Descubra qual a região do seu site tem mais impacto visual“, onde falamos sobre a tecnologia de Eyetracking que se baseia na utilização sensores para [...]