Posted by on Mar 22, 2012 in Blog, conceito, design | 15 comments

Muito além do que chamamos Design Centrado no usuário, existe um Design focado em conversão, também conhecido como Conversion-centered Design, termo que já expliquei aqui. Trabalhar esse design é conhecer o conceito de Landing Pages, o que são e como devem ser trabalhadas para aumentar as conversões do usuário(compra do produto, assinatura de um serviço, cadastros e etc).

O que é uma Landing Page?

puntalo (ilustrativo)

Landing Page, como a sua tradução não-literal já diz, é a página de destino, ou seja, a página que o usuário chega através de algum lugar. Geralmente, o mercado trabalha Landing Page para o usuário que clica em um anúncio, seja texto ou um display(banner), existe ainda uma nova frente em que o usuário chega através das redes sociais. A Landing Page, diferente de um website, tem apenas um único objetivo: Levar o usuário para a conversão(explicado no primeiro parágrafo).

Como funciona uma Landing Page?

O processo de conversão geralmente acontece como um funil comercial tradicional. Não entrarei muito a fundo no que acontece antes da Landing Page para não fugir do foco, mas o processo é simples:

landing page funil

O modelo é autoexplicativo, mas ainda sim vamos explicá-lo. Um usuário comum está navegando na internet quando é impactado por um banner interessante, por impulso(função do banner) a pessoa clica no banner, deixando de ser um mero usuário de internet, passando a ser um visitante. O visitante ao clicar no banner cai na Landing Page, onde é impactado por diversas ações focadas em um único objetivo, o clique no botão.

Quando o visitante clicar no botão, ele deixou claro para a empresa que ele está totalmente interessado na compra do produto, ou se tornar um assinante, etc. Isso, o leva para um próximo passo – Interessado. O interessado só se torna um efetivo cliente quando ele chega na página de sucesso da compra ou cadastro. Simples né?

Porém, transformar um usuário de internet (pessoa comum) em um interessado é a parte mais difícil, muitas vezes por uma Landing Page confusa ou ineficiente, as vezes até mesmo muitos passos de cadastro ou de compra podem atrapalhar a conversão de uma Landing Page. Para ajudar um pouco na hora de desenvolver suas Landing Pages, seguem 12 dicas para o Design Centrado na Conversão.

1 – Seu produto não merece 1 Landing Page, ele merece várias

Existem diversas utilidades na criação de Landing Pages, uma delas é a facilidade de pequenas variações, seja de cores, diagramação ou até mesmo de abordagem. Ao invés de tratar a Landing Page como a página do seu produto, dê a ela uma estratégia mais ousada, focando-a em seu “traffic source”, ou seja, você pode criar uma landing page especifica para quem vem do twitter, uma para quem vem dos blogs, outra para facebook, pode ainda criar variações para segmentações de seus anúncios, como uma para o público feminino, uma para o masculino. Sem dúvida essas orientações para o público alvo vai lhe dar muito mais chances de conversão do que uma página genérica com um botão “comprar”.

2 – Sua palheta de cores deve atender a identidade do produto

O visitante pode até não ser designer, mas sem perceber, ele ficará desconfiado ao entrar em uma Landing Page preta para vender serviços médicos, ou uma branca/verde/azul para uma pizzaria. Aplicação de cores é importantíssimo para usabilidade assim como é para a conversão. Cuidado com templates prontos.

3 – Seja claro, objetivo e SEXY!

ninjacoder

O que você quer comprar agora? Você tem 5 segundos, CINCO SEGUNDOS para convencer seu usuário a ficar na página e se interessar. Não tente explicar como o produto funciona em seus devidos detalhes. A Função da Landing Page não é detalhar o produto e sim vendê-lo. Você já viu alguém abrindo uma caixa de remédio para dor de cabeça no meio da farmácia para ler a bula antes de decidir a compra? Então, não faça isso!

Crie um título objetivo e interessante. Cuidado com o humor que só você entende! Seja claro para o público-alvo, como a Marisa para as meninas, a Netshoes para os esportistas, a Apple para os geeks, a Harley-Davidson para os homens brutos, a FARM para mulheres descoladas, acho que já me entenderam :)

4 – Use fotos, use fotos, USE FOTOS!

Não seja pão duro, compre uma foto, contrate um fotógrafo ou tire você mesmo a foto do que você pretende vender, até mesmo se for apenas uma pessoa sorrindo comendo uma salada. Está provado que utilizar fotos aumenta consideravelmente as chances de conversão, inclusive um estudo de Paras Chopra para o ThinkVitamin, apresenta dois cases para comprovar que fotos reais são mais eficientes até mesmo que ilustração, em todos os testes realizados.

5 – Não use navegação, não use distração

Lembre-se que você tem uma única missão – vender seu produto. Navegação foi feita para websites e não para Landing Pages. Leve o seu visitante para percorrer o mais rápido possível o caminho entre TÍTULO > TEXTO > OFERTA > CALL TO ACTION (botão). Depois pense em elementos que ajudam a decidir pela compra, uma navegação não faz parte desses elementos.

6 – Dê atenção ao que importa

contraste

Saiba trabalhar com uma das 4 teorias mais importantes no Design – O Contraste. Estude muito Gestalt e fará uma excelente Landing Page. Sabendo utilizar os espaços vazios para dar mais visibilidade ao que realmente importa. O Call to Action (botão) tem que ser a coisa mais chamativa do seu layout, o que não quer dizer ofensivo, agressivo ou fora da palheta de cores. O tamanho tem que ser o suficiente para o usuário enxergá-lo em frações de segundo e não ter dúvida em nenhum momento que aquilo é um botão.

Uma das táticas mais usadas para Landing Pages é uma seta apontando para o botão, pois a seta pressiona de forma branda o usuário a tomar uma decisão. Tome cuidado para não fazer uma seta vermelha agressiva piscando como uma entrada de Drive-in.

7 – Utilize Vídeo, se possível

video

Se você tem um vídeo sobre o produto ou apresentação do serviço, não hesite em utilizá-lo. Está comprovado também em estudos de conversão que a utilização de vídeo na Landing Page aumenta a confiança do usuário e consequentemente aumenta o CR (Conversion Rate, ou Taxa de conversão).

8 – Utilize depoimentos e ou avaliações

depoimentos

Uma grande parcela de visitantes mais desconfiados só tomam a decisão quando lêem reviews de outros consumidores, ou especialistas da área (veículos, blogueiros e outros formadores de opinião) dão seu testemunho sobre o produto ou serviço.

9 – Pense na dobra

mobile iphone

Existem diversos estudos de Design que derrubam o mito que o conteúdo mais importante de um website tem que estar acima da dobra e não abaixo. Eu, inclusive já fiz diversos experimentos sobre e sempre levo esses estudos comigo, como do Boxes and arrows e esse mais analítico da Clicktale. Porém, tratando-se de Landing Page, existem pequenas regras para a dobra sim, pois 3 elementos precisam estar no primeiro contato, seguindo a regra dos 5 segundos. Assim, o título, a oferta e o botão (Call to action) devem estar antes da dobra. Caso o seu conteúdo seja extenso após a dobra, não tenha medo de repetir o botão mais para baixo, a taxa de cliques também é altíssima.

10 – Senso de urgencia

assando

É a dica/regra que eu mais gosto, quando se trata de Landing Pages. O senso de urgencia é capaz de fazer o usuário tomar uma decisão por impulso, seja pelo título impressionante, pela foto impactante do produto, botão imponente, e principalmente pela oferta que está próxima do botão. Se o seu curso tem vagas limitadas, coloque que são poucas vagas, se tem uma promoção ocorrendo, coloque do lado a data final da promoção e fala que está esgotando, se tiver um produto de brinde, informe que é para quem comprar agora. Todas essas ofertas, descontos, promoções agregam valor na decisão do clique e aumentam significativamente a taxa de conversão.

11 – Página de confirmação

Página de confirmação é a página de “Parabéns! Sua compra foi realizada com sucesso”. Tecnicamente, é nessa página que se coloca o código que vai rastrear a conversão, se o usuário chegou lá é porque o funil funcionou. Infelizmente, poucos designers esquecem uma coisa muito importante quando projetam essa interface: O usuário já se tornou seu visitante, ficou interessado e se tornou cliente, ou seja, todas as barreiras entre sua empresa e ele foram quebradas. Aproveite esse momento para sugerir produtos relacionados, ofereça um desconto pela compra que ele acabara de fazer, a chance dele aceitar é altíssima. Ah! E não se esqueça do social! Aproveite que a compra foi realizada agora e aproxima ele da sua marca, chamando para twitter, facebook e outros canais de relacionamento, afinal ele já faz parte da família, certo?

12 – Teste

O que mais converte em clique, um botão a direita ou a esquerda? Qual foto converte mais, uma mulher sorrindo comendo uma salada ou um rapaz de camisa social aberta mostrando o abdômen trabalhado? O famoso “achismo” não tem vez no Design, por isso, existem dois testes muito conhecidos focados em conversão, são eles:

Explicação da Faber Ludens sobre Teste A|B
O Teste A/B é um método de teste de websites que consiste em exibir diferentes versões de uma mesma página para diferentes visitantes, podendo, assim, comparar a performance de cada página para atingir os objetivos dos usuários. Frequentemente, a métrica escolhida para o Teste A/B é a taxa de conversão, porém, é preciso considerar também outras medidas. Uma página que tenha taxa de conversão alta, mas pouco tempo de permanência pode indicar conversões canceladas futuramente.

Para minimizar o risco das alterações prejudicarem a métrica de sucesso do site, as versões alternativas costumam ser exibidas em pequenas porcentagens das visitas. Por exemplo: a versão B do site A é mostrada a apenas 5% dos visitantes. Pode-se ter mais versões da mesma página, porém, quanto maior a variação entre elas, mais difícil será interpretar os resultados.

O ideal é que as versões tenham pequenas alterações, para isolar o máximo possível as variáveis. Como exemplo, a página B tem um link a mais do que a página A. A mudança na performance se dará pelo efeito desse link extra.

fonte: http://www.faberludens.com.br/pt-br/node/56

Teste Multivariado
Teste multivariado permite que você teste mais de duas páginas ao mesmo tempo. Você faz pequenas variações e coloca as 5, 10, 20, 30 landing pages para disputarem entre si. Através de uma análise, você descobrirá quais variações estão retornando melhor performance, ganhando inteligência e criando novas variações em cima do que dá certo, sempre em busca da melhor taxa de conversão (CR – Conversion Rate).

Em tempo

Em Dezembro de 2011, nasceu a Melt DSP, uma empresa focada em otimizar sua compra em mídia online. Segue um sobre a Melt:

melt

Olá, bem-vindo à Melt. Somos a primeira empresa DSP (Demand-Side Platform) com tecnologia Real-time Bidding na America Latina, com objetivo de ajudar anunciantes a obterem melhores resultados em seus produtos e serviços através de uma plataforma simples e amigável. Estamos integrados com as principais empresas de publicidade on-line do mundo como Admeld, Yahoo, Microsoft, Appnexus, OpenX, Pubmatic, Google, Rubicon Project e muitas outras. Através de uma inteligencia proprietária, conseguimos oferecer ao mesmo tempo volume de impressão e qualidade de anúncios em sites premium.

Em menos de 4 meses, já conseguimos clientes como Hotel Urbano, Sky, Predicta, Hi-mídia, Editora Globo, Buscapé, Mobly, Kindle e muitos outros. Será um prazer conhecer e ajudar sua empresa a otimizar seu investimento em mídia online, inclusive otimizando em tempo real suas Landing Pages, através de testes AB e multivariados.