CATEGORIAS

22 Designs Criativos para Landing Pages – Otimização e Melhorias

Depois da minha postagem sobre exemplos de landing pages (Sua Landing Page É Péssima! Veja 10 Exemplos Que Não São), pessoas me pediram alguns exemplos de empresas menores. Aqui na Unbounce temos uma pilha gigante de pequenas e médias empresas que estão criando landing pages todo dia, então eu vasculhei a comunidade e pedi para algumas pessoas compartilharem seu trabalho.

22 landing page examples - unbounce landing page design showcase
22 exemplos landing page criadas por clientes da Unbounce

Abaixo você encontrará 22 exemplos de landing pages que englobam captura de lead (geração de lista de e-mails), pré-lançamento de produtos/páginas beta, comércio eletrônico “compre agora” ou páginas click-through e até mesmo alguns microsites – e fico feliz em dizer que todas foram construídas utilizando a plataforma de criação de Landing Pages da Unbounce. Como de costume, eu apresentei uma mini crítica para explicar por que gosto delas e, algumas ideias que poderiam ser aplicadas para melhorar, otimizar e testar as páginas, buscando melhores conversões.

Diga o que você pensa – faça sua crítica profissional nos comentários.

Muitas dessas empresas são novas ou pequenas, acredito que seria interessante para elas se nossa comunidade ajudasse com sua própria análise nos comentários abaixo. Especialistas em conversão, design, usabilidade, redatores e profissionais de marketing – talvez vocês possam se tornar conhecidos ao dar uma ajudinha, não?!?!?

Obs.: Caso faça um comentário, utilize a # da página que está criticando, para facilitar a referência.

Uma discussão sobre melhorias e otimização de conversão

Meu objetivo aqui é fornecer sugestões que possam ajudá-los a resolver problemas similares em suas páginas. Mas, acima de tudo, gostaria de apresentar um pouco da diversidade que está sendo desenvolvida no marketing online.

Elas não são perfeitas (e que página é?), mas todas apresentam algo interessante e digno de ser discutido (#ficaADica ─ deixa sua opinião nos comentários, por favor!).

Vejamos algumas tendências…

Landing Pages do tipo Click-through

Páginas do tipo click-through são exatamente o que parecem. Uma página intermediária com o propósito de persuadir visitantes a clicarem para entrar na próxima página. Elas costumam ser chamadas de páginas de salto (jump pages).

Comércio Eletrônico Click-Through

Um uso comum das páginas click-through é o de oferecer informações direcionadas aos clientes em potencial para a finalização da compra. A conversão do E-commerce é a compra de um item (talvez um livro, um aplicativo para celular) que ocorrerá no pagamento ou no carrinho de compras que geralmente é a próxima página depois da landing page click-through. Por isso consideramos que o objetivo de uma página de comércio eletrônico click-through é convencer os visitantes a “clicar no botão” para comprar seu item ─ o que os levará a uma página de transação comercial.

Para ter sucesso, landing pages de comércio eletrônico precisam ter as informações necessárias que permitirão que o cliente faça uma decisão de compra bem informada.

Conteúdos chaves incluem:

  • Imagens do produto e vídeos apresentados dentro do contexto do uso;
  • Descrições das Características;
  • Depoimentos;
  • Apresentação clara do preço;
  • Ofertas especiais (descontos);
  • Sensibilidade ao tempo ─ para criar urgência da compra (prazo para desconto);
  • Indicadores de confiança: emblemas, certificações e garantias de devolução do dinheiro.

Estes são alguns itens que observarei junto a técnicas clássicas de design que me referi em “Layout para Conversão – 8 Técnicas de Design Visual para Atrair Atenção em sua Landing Page“.

1. Kit de Ferramentas de Design para Aplicativos Móveis

Detalhes

Fonte: A Clever Twist – iPhone & iPad Design and Development

O que eu gosto

Em primeiro lugar, é um belo design (não esperava menos de Jen Gordon) – aliás, ele quem criou o template de landing page para aplicativos de IPhone para a Unbounce.

Vamos desmontar a página e ver sua estrutura funcional:

  • Um título emotivo: O título principal descreve um objetivo final que vai ao encontro do desejo das pessoas.
  • Interação para Conversão: Você perceberá em diversos lugares que Jen colocou widgets de chat ao vivo ─ principalmente bem ao lado do CTA, para ser capaz de responder perguntas caso o visitante esteja incerto sobre sua decisão de compra. (Nota para Jen: adoraria saber se você teve alguma conversa interessante com algum cliente utilizando isso).
  • Tem um vídeo: Há um vídeo bonitinho que descreve em detalhes o que você está comprando e como usar.
  • Vem com um e-Book: Isso é um ótimo adicional para aqueles que não sabem criar um aplicativo, mas gostariam de desenvolver um.
  • Depoimentos relevantes: Os depoimentos são direcionados a ambos os mercados-alvo (desenvolvedores e designers). Inteligente.
  • Divisão clara em 3 partes: A sessão superior é a de uma landing page propriamente dita, mas você pode navegar (descer a página) para mais detalhes sobre o que receberá nesse kit. Isso é importante já que o item custa mais do que alguns trocados. A sessão final adiciona um ótimo toque humano, mostrando uma bela foto de um designer e sua família, e uma lista de aplicativos anteriores para mostrar credibilidade.
  • Preço: Este é um dos elementos mais importantes. Um desconto gera, psicologicamente, duas coisas:
    1. $199 expressa um maior valor e melhor qualidade de seu produto;
    2. O desconto fará com que as pessoas sintam que estão fazendo um bom negócio.
  • Opções de Pagamentos: O método de pagamento é mostrado claramente ao lado do preço, o que responde imediatamente a uma questão comum que todo comércio eletrônico costuma trazer à tona.

Coisas que eu mudaria ou colocaria a teste

Eu já trabalhei um pouco com Jen nessa página, mas apontarei algumas coisas que poderiam levar as conversões para o melhor caminho.

  • Branding (Marca) do Produto: Faixas pretas no topo da página podem ser facilmente ignoradas (elas se misturam ao navegador e o contraste da página faz com que se comece a ler abaixo delas). Então, eu recomendo dar mais atenção à própria marca (e possivelmente um logo) do produto em si. Na minha mente eu quero saber, inicialmente, do que estão falando e, então, ler sobre os benefícios em segundo lugar.
  • Um grande botão de [Play]: Eu adicionaria um desses ao vídeo para garantir que as pessoas saibam que é um vídeo e se sintam atraídas a assisti-lo.
  • Urgência do Desconto: Tente colocar uma afirmação de limite de tempo (até 5 de Março) ou um limite numérico (os primeiros 200), etc., para fornecer uma sensação de urgência.

2. Franklin Mint – Boneca Kate Middleton

Detalhes

Fonte: The Franklin Mint

Do que eu gosto

  • Oportunidade: Sempre é uma boa aproveitar tendências ou eventos no momento em que ocorrem. Dica: É por isso que a habilidade de criar uma landing page de maneira fácil e rápida é uma ótima ideia – você pode tirar proveito de acontecimentos importantes.
  • Dica Direcional: A seta gigante aponta para a zona de interação/compra.
  • Vídeo: Vídeos podem melhorar a taxa de conversão de uma página. Além disso, também adicionam uma conexão emocional e humana aos produtos que estão à venda.
  • Chamariz: Eles incluíram uma oferta “em breve” (“coming soon”) que pode fazer com que o cliente coloque a página entre suas favoritas e volte depois.
  • Cor do CTA consistente: Uma regra simples, mantenha seus botões de CTA da mesma cor (ainda fazem o contrário, por algum motivo que eu não sei o qual), isso faz com que as pessoas saibam no que podem/devem clicar. Usabilidade básica.
  • Venda cruzada secundária: Esta não é uma estratégia que geralmente apoio, pois landing pages costumam funcionar melhor quando focadas em apenas uma coisa. No entanto, cada situação é única e, nesse caso sabemos que público que compraria esse tipo de item são obcecados pela família real e, particularmente, por Dianna (ainda mais sendo ela, mãe de William).
  • Edição Limitada: Aumenta a sensação de urgência e gera a sensação de que o produto é ainda mais especial. Ainda mais para aqueles que buscam obter a primeira edição.

Coisas que eu mudaria ou colocaria a teste

  • Remova rotas de fuga (leaking): Vou recorrer a esse velho conselho porque eu realmente não consigo achar muitos problemas nessa página. O site no topo direito é um link (não precisa ser), e isso poderia fazer com que os visitantes saiam da página ─ assim como a navegação no rodapé. Porque isso é ruim? Eles serão levados ao site principal, no qual podem ficar sobrecarregados pela quantidade de informação e sair ─ ou podem comprar outra coisa. Tornando o que poderia ter sido uma campanha de sucesso em um fracasso da perspectiva de conversão e métricas (ou seja, outra pessoa ou coisa receberá os créditos de venda por seus esforços de marketing).
  • Contraste da Dica Direcional: Eu tentaria destacar a seta aumentando o contraste. Isso poderia ser feito mudando a cor para diferenciá-la do resto da página, colocando um contorno em branco para torná-la mais óbvia ou quebrando o layout visual (ou seja, estendendo o lado esquerdo da seta para fora dos limites da página à esquerda). Esta mudança visual captura o olhar e o leva à parte mais importante da página.

3. Unshaken – O Livro

Detalhes

Fonte: Dan Woolley (author)

Do que eu gosto

  • Vídeo emocionante: Um conteúdo cativante sempre aumentará o envolvimento das pessoas. E quanto mais alguém ouve o que você tem a dizer, maiores são as chances de que compre o que você está vendendo.
  • Usos sugeridos: Este pode não ser o tipo de livro que você normalmente compraria, mas o autor inteligentemente indica que ele seria um ótimo presente para outras pessoas.
  • Depoimentos: Depoimentos e associações com pessoas e programas famosos são incluídos para fornecer credibilidade instantânea.
  • Título simples: Descreve o drama do que aconteceu e do que se trata o livro. Muito simples.

Coisas que eu mudaria ou colocaria a teste

  • Depoimentos: Eu colocaria uma foto de Bear Grylls (o apresentador do programa “À Prova de Tudo”) para uma maior validação (e para amenizar com uma quebra na página já que possui muito texto). Eu também incluiria as logomarcas do Today Show e CNN, além de uma foto do Larry King, para mostrar que este é um livro importante que teve uma grande cobertura da mídia. (E não um projeto pessoal publicado com uma impressão ruim).
  • Preço: O preço está riscado, sugerindo que há um desconto, caso compre agora. Isso deveria ser mais chamativo e posicionado ao lado do botão ─ neste momento ele está esquecido próximo à pequena capa do livro.
  • Caridade: Uma parte dos lucros irá para o Haiti. Torne essa afirmação mais óbvia ─ neste momento ela é apenas uma nota de rodapé, mas deveria receber mais atenção.
  • Estilo dos Depoimentos: Melhore um pouco o layout e design da página fazendo com que os depoimentos pareçam depoimentos de verdade. Escreva-os em itálico para diferenciá-los do texto comum da página. Lembre-se, isto não terá muito impacto por si só, mas mudanças pequenas poderiam tornar a página mais poderosa.
  • Deixe claro que isso é um livro: A imagem do livro está um pouco apagada na página, e é importante que as pessoas descubram imediatamente qual é o objeto sendo discutido.
  • Acima da dobra: tente colocar o CTA e talvez o livro e seus detalhes (preço) acima da dobra da página – veja a Amazon.com como referência para se inspirar.

4. Pact – Roupas íntimas com um propósito

Detalhes

Fonte: Wear Pact

Do que eu gosto

  • Roupas íntimas que brilham no escuro: Como não gostar?
  • Contexto de uso: Eles, claramente, utilizam a regra do “não fale, mostre” aqui (vídeo das pessoas utilizando o produto) ─ isso faturou todos os pontos de “contexto de uso”.
  • Foco no vídeo: É uma página muito simples, com apenas duas opções. Assista a esse vídeo ou saia. Existem outras formas de garantir que mais pessoas assistam ao vídeo, falarei delas abaixo.

Coisas que eu mudaria ou colocaria a teste

  • Do que se trata? O título é orientado demais para a marca. Ele não diz nada sobre o que está sendo vendido. Isso poderia ser resolvido mudando o título de “FIREFLIES” para “FIREFLIES – Roupas íntimas que brilham no escuro!” (essa afirmação sozinha já aumentará, em muito, os níveis de interesse).
  • Caridade: Umas das melhores coisas sobre a Wear Pact é que eles doam uma parte de seus lucros para uma causa válida e atual (ao invés de ficarem atrelados a apenas uma causa). Mas isso recebe apenas uma menção terciária no parágrafo de texto sob o vídeo. Quebre a informação em porções, destaque o fato de que uma parte da renda vai para o Haiti e utilize o logotipo ou o selo da organização envolvida na doação.
  • O vídeo inicia automaticamente: Eca. em geral, eu odeio. Mas isso é uma questão a ser testada ─ portanto, configure algumas variantes com o início automático ligado e veja como isso afeta as conversões. Nunca se sabe. Teste A/B aqui.

5. O Filme The Lion

Detalhes

Fonte: The Lion Movie

Do que eu gosto

  • As Johnson Box !: Estas linhas pontilhadas em vermelho são uma das técnicas de design de marketing mais antigas (originando-se das correspondências de mala direta) e, embora seja algo mais retrógrado, “old school”, este ainda é um meio eficaz de atrair atenção para a sua chamada para ação e, talvez, direcionando-a para a demografia que poderia comprar isso como um presente (em relação a idade).
  • Desconto para compras em grande quantidade: Um truque velho, mas perfeito para esse cenário. Caso compre ingressos extras (o que você fará, afinal, quem assiste a “filmes família” sozinho?), você receberá um desconto na compra.
  • Obviedade do produto: A foto de um DVD e o ingresso para o cinema são auto-explicativos.
  • Quantidade coerente de conteúdo: Dado o custo relativamente baixo dos itens e a familiaridade de todos com filmes e DVDs ─ a quantidade de conteúdo na página é adequadamente curta.
  • Urgência implícita: Cinemas têm assentos limitados, o que aumenta o desejo para comprar com antecedência.
  • Desconto no preço: Funciona nos infomerciais (apesar de sabermos o que está sendo feito conosco) ─ então, incluir um desconto é um bom motivador.

Coisas que eu mudaria ou colocaria a teste

  • Onde está o vídeo?! Esta é a página perfeita para se utilizar o vídeo como recurso de venda. Mostre um trailer desse filme para gerar curiosidade.
  • O ingresso adicional também vem com um DVD? Não está claro se receberei apenas o ingresso ou ambos pelos $10 adicionais no valor do ingresso. O texto da esquerda para a direita está confuso ─ garanta que um esteja de acordo com o outro, para que as pessoas saibam o que esperar.

6. Course Park

Detalhes

Fonte: Course Park

Do que eu gosto

  • Foco: A página é focada em apenas um dos cursos, o que ajudará a alcançar uma melhor correspondência da mensagem com o anúncio e melhorará seu índice de qualidade para PPC.
  • Botão CTA auto-explicativo: Sem perguntas sobre onde clicar ou quanto isso custa.
  • Garantia de devolução do dinheiro: Aumenta a confiança e remove o medo do comprador ─ esse é o ingrediente-chave para landing pages de e-commerce (comércio eletrônico) serem bem sucedidas.
  • E uma garota bonita: O que eu posso dizer, veja por você mesmo…

Coisas que eu mudaria ou colocaria a teste

  • Formato do Curso: Não consigo dizer, ao ler a landing page, qual será o formato do curso: CD, DVD, online, ao vivo (a foto indica que esse seria o caso)? Talvez mostrar uma foto de como a pessoa irá acessar o curso, permitirá que as pessoas saibam o que está sendo oferecido.
  • Exemplos contextuais: Eu realmente gostaria de ver um vídeo ou captura de tela dos materiais do curso sendo utilizados. Rosetta Stone faz um trabalho adequado nesta página (embora ainda existem diversas coisas que eu mudaria), ao mostrar um laptop para o curso online e dizer que as caixas contêm CD-ROM’s interativos. Também há um vídeo na parte de cima.
  • Descrição secundária do CTA: Ainda que o CTA tenha pontos positivos fortes (mencionados acima), ele deveria descrever o que você comprará (formato). Por exemplo, “Compre Agora Por $9.99 (com 5 DVDs interativos)”, etc.

7. Centro de Aprendizado da Japan Times

É difícil dizer muita coisa sobre esse site porque não sei ler japonês, mas achei que seria válido incluí-lo. O que achei um pouco confuso foi a mistura de Inglês e japonês no título e na marca.

Detalhes

Fonte: Japan Times Learning Network

Do que eu gosto

  • Macgyver: Sem saber nada de japonês, eu consegui avançar pelo formulário na página seguinte, o que leva à tela de pagamento por cartão de crédito. Por isso está na sessão de comércio eletrônico do post. E eu estou impressionado comigo mesmo, de verdade.
  • Ela é em japonês: É muito legal ver páginas criadas na Unbounce que não sejam em Inglês.
  • Depoimentos: Caso seja isso o que eles são, o fato de incluir fotos ajuda a quebrar uma página com textos pesados.
  • Repetição do CTA: É essencial repetir a sua chamada para ação em pontos estratégicos de páginas longas (ou seja, na parte superior, no meio e no final).

Coisas que eu mudaria ou colocaria a teste

  • Contraste do CTA: A chamada para ação está um pouco escondida. Eu gostaria que todo o botão (não apenas a seta) fosse tratado na cor verde para fazer com que se destaque da página. Ou, idealmente, uma cor que não combinasse com os marcadores e subtítulos no resto da página. Atualmente, não está claro quais elementos são interativos.

Click-Through de Mídia Social

Características de oAuth na mídia social tais como Facebook ou Twitter Connect possibilitam que você extraia mais do conceito Single Sign On (SSO), no qual a barreira para entrar é reduzida, permitindo que as pessoas utilizem credenciais de contas já existentes para acessar seu serviço.

8a. Conexão com o Facebook do Halo Reach na Gameground

Detalhes

Fonte: Gameground

Do que eu gosto

  • Conheça seu público: A principal ideia do Gameground é conectar socialmente sua experiência de jogo, portanto utilizar um login do Facebook é uma ótima maneira de se relacionar com público alvo.
  • Fale sua língua: As descrições da missão provavelmente podem ser reconhecidas por jogadores do jogo ─ o que os deixará animados com os pontos de recompensa que podem ganhar.
  • Tocando na mentalidade de arcade: Este “curtir” é para o conceito ─ ele parece implicar a existência de tabelas de recordes (como as de antigos jogos de arcade).

Coisas que eu mudaria ou colocaria a teste

  • Necessita uma afirmação mais clara sobre o que a página faz: Depois de ler toda a página, eu realmente não entendi. Como ela conecta e melhora sua experiência com o jogo?
  • Exemplos de recompensas: Para que serve os pontos de recompensa? Mostre-me algo que eu possa querer e estarei mais inclinado a testar o produto.
  • Deixe os títulos mais claros: “Complete missões e descubra o que há de novo em Halo Reach” (“Complete missions and discover what’s next in Halo Reach”) – implica que eu poderia receber bônus especiais e secretos dentro do jogo. Isso é verdade? Acredito que um pouco mais de detalhes poderia ajudar aqui.
  • Tabelas e classificação: Diz que você pode superar as pontuações mais altas e comparar com seus amigos. Como? Haverá uma tabela de pontuação online (Facebook)? Mostrar um screenshot disso em contexto ou explicar como você poderá se exibir para os seus amigos seria ótimo.

8b. Um caminho diferente de design

A melhor parte desse exemplo é que temos uma página B que a GameGround utiliza em um teste A/B. Esta versão produziu uma taxa de conversão 60% maior ultrapassando todo o funil de objetivo de conversão. Serei completamente sincero, embora eu tenha adicionado todas essas imagens antes de começar a escrever, estou acessando uma a uma, e eu não havia pensando nessa versão B até agora, então será interessante ver se quaisquer mudanças feitas correlacionam com meus comentários acima. :)

Detalhes

Fonte: Gameground

Do que eu gosto

  • Imagem de impacto (hero shot): Este design tem uma imagem de destaque que “grita” Halo.
  • Gestão da marca (branding): A barra superior agora inclui uma percepção mais forte da empresa (GameGround) e a frase “agora com suporte para Halo Reach” implica que eles fazem a mesma coisa com outros jogos.
  • Botão CTA Simplificado: O botão agora está focado completamente no Facebook, o que o torna mais forte.
  • Explicação melhor do conceito: Há uma percepção, um pouco mais clara, de que você pode destravar níveis/coisas novas no jogo ─ embora ainda não explique como.
  • Competição: A tabela de pontuação, “the leaderboards”, (ao menos eu havia previsto essa) dá a sensação de competição entre você e seus amigos.
  • Design claro: O design está muito mais simples que a outra landing page.

Coisas que eu mudaria ou colocaria a teste

  • Quantidade de CTAs: Existe apenas uma coisa clara a se fazer, que parece boa inicialmente (clique no botão do Facebook). Mas as três caixas na parte debaixo da página recebem pontos negativos, pois todas direcionam para o mesmo link que a página do CTA do Facebook. Gostaria que eles lançassem pequenas janelas de diálogo modal (estilo Lightbox) que respondessem algumas perguntas das pessoas sobre as características principais sem removê-las da página ou direcioná-las a um conteúdo que não estão esperando.

Click-Through de Serviço de Registro

A principal diferença entre esse tipo de página e uma página de comércio eletrônico é que a página de destino é uma página de registro ─ normalmente para um produto ou serviço online. Empresas de software como serviço (SaaS) B2B, com um modelo de assinatura mensal, são um exemplo.

Elementos importantes para incluir em uma landing page de registro do tipo Click-Trought são:

  • Capturas de tela apresentando o aplicativo online;
  • Logotipos de outras empresas que utilizam o serviço;
  • Diagramas Ilustrativos que demonstram como os softwares resolvem os problemas do cliente-alvo;
  • Indicadores de ausência de risco (teste gratuito) e uma barreira de entrada pequena (rapidez de inscrição);
  • Afirmações claras sobre benefícios;
  • Demonstrações em vídeo do tipo Elevator Pitch (discurso de abordagem de vendas de 30 a 60 segundos).

9. UberVU

Detalhes

Fonte: UberVU

Do que eu gosto

  • Contexto de uso: Ao apresentar a imagem em um computador, ele mostra como o app pode ser utilizado.
  • Títulos quase claros: A área do título é boa mas você é obrigado a ler todas as 4 linhas para entender a ideia. Sendo que as duas últimas linhas são as mais importantes.
  • Ele conta uma história: Assim que o segundo título entra, você sente que está realmente acompanhando o título para uma explicação. Esta é uma parte fundamental para um bom redator. Além disso, cada sessão termina com uma nota positiva para resumir a ideia.
  • Indicadores de confiança: Listou uma enorme quantidade de marcas de clientes apresentados em uma cor neutra, de maneira a não interferir com o poder da chamada para a ação.
  • CTA forte e descritivo: O CTA é dominante na página e facilmente passaria no teste dos 2 metros (fique a 2 metros de distância e tente descobrir o ponto de interação mais importante e o que acontecerá se clicar nele).
  • Design limpo com diversos espaços em branco: Torna a busca por conteúdo realmente rápida e facilita a leitura. Este tipo de design deixa a página com um aspecto mais profissional, lembrando em muitas maneiras o estilo da Apple.

Coisas que eu mudaria ou colocaria a teste

  • Vídeo: Ao invés de ser obrigado a encarar uma versão de demonstração – eu gostaria de ver uma agora mesmo. Colocar um bom vídeo de introdução de 1 a 3 minutos na imagem do IMac seria uma ótima maneira de melhorar o relacionamento. Você também poderia fazer um discurso de vendas estendido sobre porque deveriam pedir uma demo completa.
  • Riscos/barreiras: Uma pequena menção abaixo do CTA para qualificar o processo seria útil ─ posso assistir a demonstração agora ou somente depois de preencher um formulário gigantesco? Qual a dificuldade de começar a utilizar seu software, existe uma garantia de devolução do dinheiro ou uma versão de teste gratuita?

10. 99designs

Detalhes

Fonte: 99designs.com

Do que eu gosto

  • Afirmação do benefício muito clara: O título (e subtítulo) diz o que a 99designs faz e quanto isso custa. Este seria um ótimo exemplo para utilizar como referência.
  • Diagrama em fluxo: Não é realmente um diagrama, mas ao usar números e setas, eles o direcionam ao processo para que você entenda como ele funciona e o que deve esperar.
  • Amostras de trabalho: Uma seleção de belos logotipos destaca a confiança junto à sua promessa como marca.
  • CTA Descritivo: Ao invés do terrível botão de “inscreva-se” (“submit”), eles encontraram um CTA perfeitamente escrito ─ “comece um projeto de design do logotipo” (“Start a logo design project”), isso tem muitos efeitos. Em primeiro lugar, permite que você saiba que está na direção certa para criar seu logotipo, e também lhe informa sutilmente que há algumas etapas envolvidas (ao utiliza a palavra comece [start]).
  • Prova social (social proof): Há uma menção no fim da página que afirma “una-se hoje a 40.000 clientes satisfeitos” (“Join over 40,000 satisfied customers today”) o que gera confiança na habilidade da 99designs de entregar um trabalho consistente.
  • Garantia: A confiança é aprimorada pela promessa de 100% de devolução do dinheiro, posicionada próximo ao botão CTA.

Coisas que eu mudaria ou colocaria a teste

  • Ampliação da prova social: Eu tentaria levar a afirmação de 40.000 clientes no topo da página – talvez até como uma anotação sob o CTA.
  • Adicionar um pouco de contraste: Algumas áreas em contraste mais forte com o fundo ajudariam a unir o conteúdo ao layout e torná-lo mais agradável.

11. Tropo – Os Especialistas em SMS

Detalhes

Fonte: Tropo

Do que eu gosto

  • Proposta de valor clara e ousada: Está bem claro o que a Tropo faz. Eles permitem que você habilite seus apps para que eles possam enviar mensagens de SMS para o telefone das pessoas.
  • Confiança: Diversos indicadores de confiança são utilizados aqui: entrega garantida, uma lista de todos os principais usuários, logotipos dos principais clientes e o suporte da maior plataforma de SMS do mundo.
  • Diagrama de fluxo: Há um diagrama simples com 3 etapas para ajudá-lo a visualizar como funciona.
  • Rapidez de implementação: “Comece a desenvolver em 60 segundos ou menos” (“Start developing in 60-seconds or less”) incentiva as pessoas tentarem. Isso provavelmente se refere apenas a configurar sua conta, mas já é metade da batalha.

Coisas que eu mudaria ou colocaria a teste

  • Ordem do cabeçalho das imagens: Eu tentaria colocar o CTA no lado direito do diagrama de fluxo. De maneira que seus olhos possam seguir naturalmente da esquerda para a direita, descobrindo o que eles fazem e terminando na chamada para ação. Da forma que está, parece que estão lhe pedindo para começar antes que você tenha a chance de entender como funciona.
  • Inconsistência do CTA: Eu gostaria que o CTA de baixo mantivesse a cor e a aparência do CTA no topo. Atualmente há tantas cores flutuando pela página que não fica imediatamente claro onde você deveria clicar.

12. Watch Mouse

Detalhes

Fonte: WatchMouse

Do que eu gosto

  • O rato tem olhos gigantes: O que passa a confiança de que ele está prestando atenção. :)
  • O CTA domina a página: Há apenas uma coisa a se fazer e ela surge grande e orgulhosa acima da dobra.
  • Simplicidade: Uma página de registro baseada em click-through precisa comunicar uma ideia de maneira simples e rápida ─ esta página foi feita para comunicar rapidamente (embora ela precise de algum trabalho em certos aspectos específicos de comunicação, veja na sessão “Coisas que eu mudaria ou colocaria a teste” abaixo).
  • Adesões: Incluir os logotipos de clientes renomados aumenta a confiança e acrescenta a ideia de que “se esses caras estão usando, então, talvez eu deva prestar atenção”.

Coisas que eu mudaria ou colocaria a teste

  • Ordem do texto do CTA: Eu inverteria a hierarquia de informações no CTA para dizer [O que você irá fazer] seguido por [Uma afirmação de confiança] para produzir algo como “configure sua página pública de status em minutos (30 dias de teste gratuitos)”.
  • O que é uma página pública de status? Tenho de admitir que não tenho 100% de certeza do que são essas páginas e para que elas servem. Portanto, eu gostaria de deixar bem claro o que são com um exemplo visual na parte superior da página.
  • As capturas de tela estão difíceis de ler: É bom que haja algumas capturas de tela de exemplos de páginas de status incluídas, mas elas são difíceis de ler. Eu sugiro focar em uma única imagem maior ou torná-las interativas, de maneira que pudessem ampliar a visualização.
  • Explique o porquê: O título afirma “Utilize uma página de status pública”. Seria bom se explicassem explicitamente porque é uma boa ideia e dessem exemplos de empresas que as utilizam com sucesso (e para quais tipos de informações eles as utilizam).
  • Aumente o contraste: O banner do título principal tem uma cor parecida com a do CTA. Eu mudaria uma das duas para que o CTA tenha um destaque ainda maior.

13. Asking Canadians

Detalhes

Fonte: Asking Canadians

Do que eu gosto

  • Comunicação visual poderosa: A imagem multicultural (e a escolha de idioma) combina muito bem com o idioma que dá suporte a sua comunidade.
  • Explicação simples dos benefícios.
  • Separação Visual: A oferta e os benefícios estão separados claramente pelo uso de uma área fechada cinza. Isso faz a quantidade de conteúdo de texto parecer menos ameaçadora quando você chega à página.

Coisas que eu mudaria ou colocaria a teste

  • CTA consistente: Existem dois botões “Inscreva-se Agora” (“Join Now”) na página, e cada um tem um design diferente. Eu preferiria ver um estilo único de design nos botões. Não há nenhum problema em ter textos diferentes nos botões, mas eles deveriam ter estilos idênticos.
  • Lembrete do Valor: A chamada para ação poderia ser ampliada com um lembrete do que você pode conseguir ao se inscrever. Um CTA de linha dupla forneceria clareza. Ex.: Inscreva-se no Painel de Pesquisa (e concorra a $1.000 em prêmios).
  • Elementos interativos: O “$1,000 worth of:” no subtítulo tem um design que lembra um botão e atrai a maior parte da atenção da página. Ainda que seja importante destacar o benefício primário da inscrição, ele pode ser feito de maneira menos interativa.
  • Emprego das palavras: Considere mover a palavra “ganhe” (“win”) do fim do subtítulo para a primeira palavra da próxima linha ─ para produzir “Ganhe $1.000 em”. Uma mudança sutil que soa de maneira mais poderosa.
  • Posição do texto: Os benefícios listados na segunda metade da página poderiam ser mencionados mais vezes (sobre o que são) ao separar a frase “Aqui está o que você pode conseguir” (“Here’s what you will get”) em sua própria linha acima dos três parágrafos. Para obter uma clareza ainda maior, as palavras podiam ser mudadas para dizer algo como “Aqui está o que você pode ganhar por se inscrever no Asking Canadians:”.

Landing Pages com Formulários

Muitas landing pages incluem formulários: seja para coletar os dados dos usuários ou para processar suas exigências com o propósito de buscar um segundo nível de informação (buscar, reservar). No marketing, o uso mais comum de um formulário é o primeiro, e ele é conhecido como geração de leads (lead gen) ou captura de leads.

Geração de Leads

Como indica o nome, landing pages de geração de leads são utilizadas para gerar uma lista de leads de clientes (normalmente na forma de um endereço de e-mail ou um número de telefone) para o vendedor.

Páginas de geração de leads eficazes seguem algumas diretrizes específicas:

  • Formulários curtos: Não peça mais informação do que você necessita.
  • Dê para receber: Você deve dar algo (o prêmio) para que isso ajude a persuadir seu visitante a fornecer seus dados pessoais.
  • Equilibre o tamanho do prêmio com o esforço necessário: Uma troca de informações sempre deve ser justa. As pessoas relutam em fornecer suas informações, então faça com que isso valha a pena. Quanto maior for o prêmio que oferecer, mais informações você poderá pedir.
  • Utilize o contraste para separar visualmente a área de ação: Seu formulário de geração de leads é a área interativa fundamental da página ─ utilize regras de design visual para fazer com que se destaque.
  • Cuidado com a dobra: Por mais que eu odeie usar esse termo antigo, ele ainda tem impacto em algumas pessoas. A regra padrão é manter seu botão de formulário (seu CTA) acima da dobra. Isso é impossível com formulários extensos, então você precisará empregar dicas visuais para apontar o caminho. Leia “COMO FAZER: Manter seu CTA Acima da Dobra em uma Landing Page de Geração de Leads” para obter mais informações.

14. A Experiência Martell

Detalhes

Fonte: Martell Home Builders

Do que eu gosto

  • Dicas Direcionais: Toda a página foi desenvolvida com dicas direcionais apontando para o formulário de e-mail. Há três no total: a foto aponta para baixo, as setas de “inscreva-se agora” (“sign up now”) apontam para a direita e, de maneira sutil, o telhado no logotipo no fim da página aponta para cima. Um trabalho muito bem feito.
  • Escolha do método de contato: A partir dos testes que já fiz, pude perceber que sempre há uma parcela de clientes que não gostará do método de contato oferecido – é certeza. Portanto, oferecer um e-mail e um número de telefone dá opções a eles.
  • Confiança: Fornecer um número telefônico permite que os visitantes saibam que há pessoas reais por trás da empresa.
  • Fotografia Feliz: Existe uma linha muito tênue entre fotografias bregas e uma imagem que realmente funcione na minha mente. Qualquer pessoa que já tenha mudado pode se identificar com sentimento de estar em uma nova casa (e o estresse associado). A imagem cria uma sensação de uma experiência feliz e sem problemas.

Coisas que eu mudaria ou colocaria a teste

  • Comprando uma nova casa onde? O anuncio nesta página provavelmente foca locais geográficos específicos, mas ainda assim produz um elemento de dúvida quando o local não é incluído.
  • O que eu ganho? Depois de ler o CTA eu consigo descobrir que vou receber um guia de 99 dias. Mas não há dica visual na página que indique que vou receber esse guia até que eu já tenha decidido que estou pronto para experimentar. Eu sugiro tentar um título secundário expandido, talvez algo assim: “Utilize seu Guia gratuito de 99 dias para comprar uma Nova Casa ─ e comece a mudar-se para seu novo lar”. Desta maneira, é definida a expectativa de que você estará oferecendo ajuda na forma de um guia.
  • O que tem nele? Se você está dando alguma coisa (e deseja que as pessoas queiram isso), forneça uma prévia (as primeiras 10 páginas ou o primeiro capítulo) para que possam ver a qualidade do material e entender os benefícios de fazer negócios com você.
  • Pequena alteração no texto: Ao invés de “Inscreva-se agora” ( “Sign up now”), eu tentaria algo com menos comprometimento como “pegue agora mesmo seu guia “.
  • Contraste de cores do CTA: Neste momento eu normalmente diria que aquele botão deveria ser de uma cor diferente do resto da página para que se destaque, mas há exceções para toda regra. Dado que toda paleta de cores consiste de apenas 4 cores, eu sinto que seria difícil encontrar algo diferente que não arruinasse a estética relaxante da página, então vou deixar isso como está.
  • Afirmação de confiança: A afirmação de confiança anti-spam no rodapé sobre não divulgar seu e-mail poderia ser conectada com maior proximidade ao formulário de e-mail. Seja através de um asterisco (*) no texto dentro do formulário para indicar às pessoas que elas deveriam ler a afirmação abaixo, ou mover o texto para a área diretamente sob o formulário.

15. Overtis

Detalhes

Fonte: Designed by Matizmo

Do que eu gosto

  • Design limpo e de contraste: Separar o conteúdo da área de ação (com a caixa cinza ao redor) permite que você saiba o que deve ler e o que deve fazer.
  • Dica Direcional: A seta preta indica o caminho até a área de ação.
  • Estilo dos tópicos: A leitura dos tópicos é fácil, já que a introdução para cada um (assim como o que você está lendo agora) começa com uma afirmação em negrito.

Coisas que eu mudaria ou colocaria a teste

  • Dados: Estou inferindo, pelo conteúdo da página, que o whitepaper ( material de apoio oferecido) me fornecerá algumas estatísticas sobre fraude no varejo do Reino Unido. Pegue a parte mais interessante disso e coloque na landing page para aumentar o nível de persuasão. Isso também fará com que as pessoas se sintam mais inclinadas a comentar ou compartilhar a página ─ ajudando a ganhar uma exposição boca a boca valiosa. Lembre-se de que mesmo que façam o download do material, podem não lê-lo agora (ou nunca); portanto, é interessante destacar algum dado interessante e curioso para despertar interesse no assunto que será fornecido para compartilharem durante o cafezinho.
  • Não se Inscreva!!! Leitores assíduos saberão que eu odeio botões que dizem “Inscreva-se” (“Submit”). É uma regra simples. Afirme exatamente o que acontece quando você clica no botão. Neste caso poderia ser “pegue agora mesmo seu whitepaper gratuito”.
  • Torne o título mais descritivo: O título, da maneira como está, não diz muito. Os detalhes importantes estão espalhados no meio do título, na pequena afirmação em vermelho sobre ele e no conteúdo abaixo. Mas uma boa parcela de seus visitantes já terá ido embora antes de fazer o esforço de ler tudo. Eu gostaria de ver um título mais específico como: “Aprenda a aumentar sua renda vencendo a fraude do varejo”. A palavra “aprenda” indica que você vai ensiná-los, “aumentar sua renda” fornece o incentivo e “vencendo a fraude do varejo” foca em um problema de seus visitantes.
  • Forneça uma prévia: Mostre confiança que vale a pena ler seu conteúdo, ofereça uma amostra gratuita. Experimentar antes de comprar é uma técnica testada e confirmada que pode ser utilizada aqui, ao oferecer um pedaço do whitepaper para aguçar o apetite.
  • Contraste do CTA: Eu deixei a última página passar, portanto vou voltar a essa ideia agora. Com um design tão simples, um CTA colorido e destacado sobressairia na página. Experimente.

16. Scoop St. Deals

Detalhes

Fonte: Scoop St.

Do que eu gosto

  • Absurdamente simples: Caso queira ofertas em Nova Iorque, forneça seu e-mail. Simples assim.
  • Afirmação de confiança: Parece óbvio quando está bem ali (bem posicionado, próximo ao formulário) – mas caso a afirmação de evitar spams fosse retirada, o formulário perderia valiosos pontos de confiança.
  • CTA claro: Ele se destaca da página visualmente. Em relação ao texto no botão, ele diz exatamente o que você vai receber (ofertas de hoje). Perfeito.

Coisas que eu mudaria ou colocaria a teste

  • Hierarquia de Informação: A faixa amarela no topo contém uma prova social realmente poderosa (30.000 pessoas em Nova Iorque apenas confiaram a nós seus e-mails [30,000 people in New York alone have trusted us with their email]), ainda assim, está escondida no que poderia ser uma área de mensagens do navegador. Eu tentaria colocá-la sob o cabeçalho azul com o logotipo.
  • Frequência dos e-mails: O CTA permite que você saiba o que verá nas ofertas de hoje, mas… de quanto em quanto tempo você receberá os e-mails da página? Diariamente? (provavelmente) Isso deveria ser dito em algum lugar da página.
  • Mudança radical no design: Outra ideia trazida à tona pela minha insônia seria alavancar a prova social de uma maneira mais visual. Imagine uma imagem suspensa de uma loja de esquina que apresentasse uma oferta (uma grande placa de OFERTAS na janela), e uma fila de 30.000 pessoas feita em photoshop na rua para pegar a oferta. Isso representaria duas coisas: o fato de ter alcançado uma quantidade crítica que o torna confiável, mas também que você consegue evitar a fila com a oferta online. Essa é só uma ideia.

Geração de Leads Pré-lançamento

A página de “em breve” tem tido um renascimento ultimamente. Já se foram as páginas “em construção” dos anos 90, e em seu lugar entraram convites beta privados, prévias e ferramentas de compartilhamento viral para poder entrar. Tudo isso se refere à geração de leads. Reunir, antes do lançamento, uma lista de clientes em potencial interessados, faz com que você tenha para quem vender quando abrir as portas.

17. Band Demand

Detalhes

Fonte: Band Demand

Do que eu gosto

  • Design arrojado relevante: Fica claro, a partir do momento que você vê a página, que ela é sobre música, e é sobre música local (Austin neste caso). Páginas localizadas tendem a deixar isso bem claro para evitar pistas falsas. Aqui não há dúvida de que a página fala de música em Austin.
  • Dicas direcionais: O vermelho vivo leva seus olhos à imagem de inscrição (dica: coloque informações importantes aqui) e a seta aponta para o formulário.
  • Dispositivos para compartilhamento social: Música é um conteúdo profundamente social, assim como as informações relacionadas a ela, portanto é ótimo que haja um widget de compartilhamento social na página.

Coisas que eu mudaria ou colocaria a teste

  • Mensagem: A marca e as mensagens parecem estar em conflito (o nome me faz pensar em um movimento de crowdsourcing para encorajar bandas a virem para o seu local) enquanto a mensagem diz que a página trata de notícias e descontos. Para deixar claro, isso é de se esperar quando você está refinando uma página de pré-lançamento, já que parte do propósito da página (e de testá-la) é aprimorar sua mensagem até que esteja bem clara, pronta para o lançamento real.
  • O que acontecerá em breve? Band Demand acontecerá em breve? Ou a parte do serviço em Austin que acontecerá em breve? Eu estou errado sobre a classificação desta página caso seja o segundo caso, o que é implicado pelo grande selo de “em breve” (“coming soon”) sobre a palavra Austin.
  • Aumente o brilho do texto do formulário: O texto no formulário é muito difícil de ser lido ─ ele precisa ficar mais claro para que se torne mais óbvio.
  • E-mail ou correio: Eu acho que tiraria o envelope por ele indicar correio físico, e melhoraria o contraste da seta.
  • Experimente widgets sociais diferentes para a prova social: Ao invés do widget genérico “Compartilhar” (“Share This”), eu consideraria usar os botões de compartilhamento do facebook e Twitter que apresentam um contador de compartilhamentos quando são utilizados. Isso fornece uma sensação de prova social que pode aumentar a confiança. A maioria dos widgets como esse permite mostrar ou esconder a contagem. Minha recomendação seria esconder o contador até que o número seja mais impactante e, então, mostrá-lo.
  • Tente diferentes posições do widget para aumentar o uso: Em um formulário de geração de leads como esse, você normalmente consegue mais interação com seu botão de compartilhamento ao colocá-los na página de confirmação. Leia essa postagem em “Estratégias de conversão de postagens para Geração de Leads (Post-conversion Strategies for Lead Gen)” para obter mais detalhes.

18. Clever Scale

Detalhes

Fonte: Clever Scale

Do que eu gosto

  • Simplicidade: Isso é o que fazemos, aqui está uma captura de tela. Forneça seu e-mail e receba notícias.
  • Diversos mecanismos de engagement: Na fase de pré-lançamento é importante construir leads de diversas maneiras (e pessoas diferentes têm preferências diferentes). Desta maneira ao adicionar Twitter, RSS e (acredito) RSS E-mail, abre-se um leque de opções aos visitante.
  • Prévia: A captura de tela fornece um teaser do que está por vir, para motivar as pessoas a se inscreverem.
  • Palavras descritivas no CTA!!! É a afirmação mais simples possível “receba notícias” (“get notified”), mas ao menos descreve o que faz. Eles ganham mais 1 ponto por não escreverem “inscreva-se”.

Coisas que eu mudaria ou colocaria a teste

  • Captura de tela maior: Permita que as pessoas cliquem na tela para obter uma imagem maior.
  • Adicione alguns tópicos sobre características do produto: A captura de tela faz alusão a um painel de análise (analytics dashboard) – isto poderia ser descrito junto a alguns benefícios dos serviços e da empresa por trás dele.
  • Ofereça um whitepaper ou relatório: O armazenamento em nuvem (e seus benefícios) pode não ser familiar a todos os visitantes desta página (a não ser que ela seja bem direcionada a CTOs), portanto oferecer um relatório gratuito sobre o porquê do armazenamento em nível ser um avanço, forneceria às pessoas um benefício real e melhoraria sua posição como um líder de ideias ou especialista na área. O que, também aumentaria a conversão.

19. Contact Complete

Detalhes

Fonte: Contact Complete

Do que eu gosto

  • O link para o blog: Normalmente não gosto de navegações adicionais na landing page (especialmente navegação global), mas como mencionei no começo desta seção, páginas de “pré-lançamento” estão em evolução, e neste estágio pode ser benéfico permitir esse mecanismo de relacionamento secundário. O blog fará duas coisas: fornecerá conteúdo adicional que pode ajudar as pessoas a acreditarem em seu conceito de negócios e estender seus métodos de contato através de uma potencial assinatura de RSS.
  • Afirmação de valor explícita: É dito a você (de maneira muito boa no contexto do formulário) que ao fornecer seu e-mail, você pode se tornar um beta tester exclusivo.
  • Tópicos claros: Tópicos são muito mais fáceis de perceber (a informação que vai disparar seu impulso particular de conversão) do que parágrafos ou textos, e eu gosto da forma como o negrito foi usado na introdução de cada tópico, para ênfase.

Coisas que eu mudaria ou colocaria a teste

  • Diagrama ou foto? A foto do vendedor (caso seja isso que ele é) é a coisa mais impactante na página, ainda assim ela não diz nada sobre o que faz a empresa. Em circunstâncias como essa, eu acredito que na maioria das vezes uma representação em diagrama sobre como o sistema funciona vale mil palavras (e os textos nessa página são um pouco pesados). Este exemplo da WebTrends tem um layout muito similar, mas conta melhor a história.
  • Contraste da área de ação: Destaque a área de ação (o formulário) ao delimitá-la em uma caixa colorida. Isso não apenas atrai o olhar, mas também relaxa o seu cérebro ao dizer que é para este local que você precisa ir depois de ter terminado de ler o conteúdo da página.
  • Torne os exemplos mais claros: Eu realmente não compreendo o conteúdo no canto inferior direito. Como e porque as pessoas estão compartilhando essa informação e o que exatamente eles estão compartilhando (poderia gerar preocupações com a privacidade)?
  • Título da Área de Ação: Acredito que a afirmação sobre se tornar um beta tester exclusivo é um título mais forte para a área de formulário do que “Em breve diretório industrial gratuito” (“The free industry directory is coming”), portanto eu usaria isso como título acima do formulário.
  • Vá (Go)? Não. Faça com que o botão descreva o que vai acontecer quando clicar nele. Eu tentaria “se torne um beta tester exclusivo” (o que poderia se encaixar em um botão maior na próxima linha, ao invés de ficar espremido no final).

Reservas Online

Formulários de reservas online normalmente se diferem do clássico de geração de leads porque você não precisa fornecer informações pessoais até que decida reservar ou não. (Existem exceções a essa regras, mas eu penso que qualquer um que peça seu e-mail antes de mostrar a disponibilidade de quartos, está pedindo muito).

20. Hotéis de Esqui em Mammoth Lakes

Detalhes

Fonte: Mammoth Lakes Ski Accommodation

Do que eu gosto

  • Métodos de contato alternativos: Muitas pessoas ainda preferem fazer suas reservas de viagem pelo telefone (tanto por motivo de segurança do cartão de crédito ou por motivos pessoais). Esta página obviamente reconhece esse fator ao colocar um número de telefone na parte superior ─ “temos pessoas reais esperando para falar com você”, aumentando a confiança.
  • Contexto de uso: A fotografia torna muito óbvio o porquê você ficaria lá ─ pela bela paisagem de montanha e pelo esqui.
  • Proposta de valor clara: O título deixa claro que eles estão oferecendo taxas com desconto.
  • Urgência sutil: A afirmação ─ “Reserve agora e economize” (“Book Now and Save”) implica, sutilmente, que você pode fazer um melhor negócio caso reserve naquele momento.
  • O formulário exige apenas o essencial: Eles pedem as datas de chegada e partida e o número de pessoas pronto, não são exigidos nem e-mail nem dados pessoais (o que poderia afastar algumas pessoas).
  • Chamada para Ação relevante: “Confira agora a disponibilidade” é um texto perfeito de CTA. 10/10.
  • Depoimentos: Não houve muitos depoimentos nos exemplos anteriores, mas eles são críticos em páginas relacionadas a viagens. Depoimentos (caso sejam confiáveis ─ confira abaixo) podem aumentar em muito suas oportunidades de conversão.

Coisas que eu mudaria ou colocaria a teste

  • Métodos alternativos para depoimentos: Como mencionei acima, depoimentos são essenciais para conversões relacionadas a viagens. Quanto mais confiáveis (e verificáveis) forem, melhor. Duas ideias vêm a minha mente agora:
    1. Criar um Link (em uma nova janela), ou mostrar o conteúdo (com links para verificação) de um site de avaliações de viagens como o TripAdvisor.com ─ caso seja um bom lugar para ficar, haverá boas avaliações lá e a transparência aumentará suas vendas de maneira significante.
    2. Mostrar um feed de comentários positivos sobre o local ou a empresa.

Microsites

Microsites são essencialmente o meio do caminho entre landing pages e um website. Eles normalmente têm cerca de 3-10 páginas (aproximadamente) e o que os torna diferentes de um pequeno website é que eles ainda são construídos para uma promoção específica. Eles têm sido comuns para itens de preço elevado há muito tempo (carros são o principal exemplo). Quando comparados a uma landing page singular, eles fornecem uma experiência mais extensa com formas de interação diferentes (incluindo navegação, exploração e caminhos mais longos de conversão).

21. Vinotrac

Detalhes

Este está mais próximo a um site completo do que um microsite porém eu o coloquei aqui para apresentar o que mesmo assim está sendo construído com a ferramenta Unbounce. Mas, é difícil criticá-lo nas mesmas bases das landing pages que estudamos acima.

Fonte: VinoTrac

Do que eu gosto

  • Um site completo! Para começar gostaria de dizer que a Unbounce não foi criada para construir microsites (neste momento estamos focados em landing pages) ─ então, é bem legal que o pessoal da Vinotrac tenha construído o site completo com nossa ferramenta.
  • Redução de barreiras: O CTA inclui a afirmação “não exigimos cartão de crédito” (“no credit card required”). Neste caso, é sempre bom mencionar em sua chamada para ação, pois explica para as pessoas que não há barreiras financeiras durante o processo de cadastro.
  • O design é focado em proposta de valor: Foi dado bastante espaço para o título, isso ajuda a destacá-lo como a primeira coisa que você vê quando a página carrega. Uma captura de imagem de alta qualidade é apresentada, permitindo que você veja em detalhes uma boa parte do que se trata o aplicativo.
  • Contraste do CTA: Os botões laranja realmente se destacam em relação ao design da página, atraindo seus olhos para eles ao utilizar cores e contrastes.
  • Layout de conteúdo simples: O conteúdo da página é bem agrupado e espaçado para facilitar uma leitura rápida e fácil.

Coisas que eu mudaria ou colocaria a teste

  • Comunicação do título principal: Se observar o título sozinho, você terá dificuldades para descobrir ao que ele se refere. O cabeçalho inferior ajuda um pouco, mas meu conselho seria testar o título por si só (apenas mostre para as pessoas em um pedaço de papel e pergunte o que elas entenderam) até que esteja 100% claro.
  • Sem instalações: O conteúdo na seção inferior esquerda (“Nada para instalar ou se preocupar” [“Nothing to install or worry about”]) foca demasiadamente no benefício de um software online em contraposição ao próprio aplicativo da Vinotrac ─ eu utilizaria esse espaço valioso para destacar as características principais de benefícios do meu produto.

22. Audio Cubes

Detalhes

Fonte: Audio Cubes

Do que eu gosto

  • Contexto de uso 1: O design visual imita a experiência de luminosidade ao utilizar o produto ao vivo. Preparar o clima é uma maneira importante de se conectar com as expectativas e desejos de seus visitantes.
  • Contexto de uso 2: Dois vídeos são utilizados como comunicadores primários para mostrar o produto sendo utilizado.
  • CTA Claro: A chamada para a ação em amarelo brilhante se destaca claramente contra o fundo escuro e de cor única na página.

Coisas que eu mudaria ou colocaria a teste

  • Separação dos elementos interativos: Os links de navegação têm a mesma cor do título, logotipo e tópicos. Sempre que possível, tente separar os elementos interativos do conteúdo.
  • Compre agora (quanto custa?): Não parece haver informações o bastante para dar suporte a uma decisão de compra completa. Isso poderia ser auxiliado ao incluir o preço no CTA ou próximo a ele. Não tenha medo de ser transparente. Se o seu produto é caro, permitir que as pessoas saibam disso fornecerá uma ideia de qualidade, não tenha medo da verdade.
  • Premiações e Depoimentos: Duas premiações são listadas no fim da página, vinculadas a alguns depoimentos. Um destaque maior poderia ser dado a essas áreas adicionando um título (por exemplo, “Depoimentos e Premiações”) ─ lembre-se, as pessoas são impacientes e se puder tornar áreas diferentes de conteúdo mais compreensíveis, elas irão absorver mais informação nos poucos segundos que passam ali na sua página (elas nem precisam ler o conteúdo ─ apenas saber que o produto foi premiado já faz diferença).
  • Confiança e garantia: A página “Onde Comprar” (“Where to Buy”) tem detalhes sobre a garantia de devolução do dinheiro, mas quem não visitar a página perderá essa informação vital. Para aqueles que clicam no botão “Compre Agora” (“Buy Now”) por pura exploração (talvez para descobrir o preço) ─ você poderia reapresentar os detalhes de garantia na página de compra.

Tendências em Landing Pages

Você encontrou alguma das seguintes tendências? Percebeu mais alguma coisa?

  • Texto do CTA: Ainda existem pessoas demais utilizando a palavra “Inscreva-se” (“Submit”) em seus botões. Que vergonha! :)
  • Vídeo: Apenas 5 dos 22 exemplos utilizam vídeos (tsc, tsc). Interessante apontar que a maioria deles está em páginas de comércio eletrônico click-through.
  • Extensão da página: Landing pages longas costumavam ser apenas usadas com objetivo de vendas por meio de formulários, mas estou vendo mais e mais páginas longas que são produzidas profissionalmente onde essencialmente dividem os microsites em uma única página.
  • Microsites: Quão importante são sites de páginas múltiplas para suas necessidades de marketing? Sinta-se à vontade para desmentir/argumentar qualquer coisa que eu tenha dito, adoro discutir sobre esse assunto…

O que você acha?

Por favor, entre nos comentários e compartilhe suas ideias sobre como essas landing pages poderiam ser melhoradas ainda mais.

— Por Oli Gardner, Adaptação de Andréa Amaral


Baixe a lista com as 50 dicas matadoras

Otimize suas landing pages com as 50 dicas matadoras da Unbounce.
Ao cadastrar seu email aqui voc autoriza a Unbounce enviar notcias e dicas sobre estratgias digitais do Blog da Unbounce Brasil, landing pages e otimizao de converso (caso voc no esteja cadastrado ainda!)
Sobre Oli Gardner
Oli Gardner é um dos co-fundadores da Unbounce. Oli já viu mais landing pages do que qualquer pessoa no mundo! Formador de opinião é também Palestrante do Conversion Centered Design. Siga o Oli no Twitter
» Mais publicações por
Comentários