Luciano e Zooey | Foto de Simone Bertuzzi

Por que criamos Landing Pages na DogHero (e qual ferramenta utilizamos)?

Um mergulho de cabeça no processo de criação de Landing Pages da DogHero

Fabio Michelan
DogHero Brasil
Published in
7 min readFeb 22, 2019

--

A DogHero é uma startup com aproximadamente 60 funcionários. Acreditamos que o esforço de cada um é extremamente importante para que possamos alcançar as nossas metas.

Não podemos perder tempo. Não podemos perder prazos. Especialmente, não podemos perder foco. Não podemos nos aventurar em iniciativas feitas sem propósito.

Ao mesmo tempo, a DogHero é uma empresa que escala muito rapidamente, e portanto demanda o desenvolvimento de novas features, sites, Landing Pages, formulários, e outras UIs com muita frequência.

Foto de Charles 🇵🇭 no Unsplash

Como conseguimos trabalhar sem que o tempo de um de nossos Programadores ou Designers tenha que ser desviado para um novo projeto a todo momento?

Sites ou páginas que de fato entram em produção, que precisam de algum recurso de back-end, ou que são páginas relacionadas ao produto principal e site da empresa, são desenvolvidos por Programadores e Designers.

Para todos os outros casos, buscamos alternativas de DIY. Nessas situações, o site não passa pelas mãos de um dev. Em tese, com os guidelines corretos, qualquer pessoa da empresa poderia desenvolver e publicar um site por conta própria.

Ferramentas como Wordpress ou Squarespace estão disponíveis para o desenvolvimento de sites completos com uma pequena curva de aprendizado. No entanto, na DogHero decidimos optar por outro caminho: utilizar ferramentas para criação de Landing Pages.

E por que decidimos isso?

1. Objetivos de negócio

As Landing Pages se aproximam mais das necessidades que temos. Seja para criar campanhas de ads, para iniciar o serviço em uma nova região, para divulgar uma nova feature, ou mesmo para se aprofundar em algum detalhe de nosso serviço, a Landing Page é mais adequada.

Landing Page específica para o lançamento do serviço de Dog Walking em Curitiba/PR

2. Foco em conversão

Na maioria das Landing Pages, o foco é a conversão. Número de cliques em um CTA, número de leads cadastrados, número de formulários preenchidos. A ideia é medir alguma ação.

Neste sentido, a Landing Page é um recurso importante para executar testes de performance sem comprometer recursos de desenvolvimento. Assim, é importante para validar hipóteses antes de produtizar ou até mesmo para criar páginas específicas para anúncios em Google, Facebook e Instagram ou para parcerias e eventos.

3. Destaque para o conteúdo

Usando uma Landing Page, garantimos ainda que o foco da comunicação será claro, sem distrações, sem periféricos. O header não tem opções de menu, e o footer é sempre limitado. Assim, a informação principal se destaca e as oportunidades de drop são reduzidas.

4. Facilidade para criar testes A/B

Por fim, outra vantagem de se trabalhar desenvolvendo Landing Pages, é a praticidade em se desenvolver variações de uma mesma página, criando testes A/B com muita facilidade, e testando essas variações de acordo com a necessidade de conversão.

O teste A/B é fundamental para se explorar alternativas de forma ágil. A ideia é gerar as opções, testar com o público real, errar rápido, aprender e iterar.

“If you want to increase your success rate, double your failure rate.”

— Thomas J. Watson, antigo Chairman e CEO da IBM

E quais são os usos que damos às Landing Pages na DogHero?

Anúncios do Google / Facebook / Instagram / etc

Em situações como essa, a Landing Page pode ser personalizada para “conversar” com o anúncio. Por exemplo, anúncios com palavras-chave sobre passeio grátis podem levar para uma Landing Page que dê destaque para um cupom. Para anúncios sobre segurança, o destino pode ser uma Landing Page com detalhes sobre o acompanhamento do passeio feito em tempo real pelo GPS, e a metodologia de passeio seguro no onboarding de passeadores.

Foto de Jay Wennington no Unsplash

Parcerias

Na DogHero estamos acostumados a trabalhar desenvolvendo parcerias com outras empresas, tanto no ramo Pet quanto de outras indústrias.

Como em casos assim há um fluxo grande de novos de clientes, procuramos tornar a experiência mais natural para todos, criando um contexto bem definido entre as marcas.

Assim, usuários que chegam até nós por algum parceiro podem ter uma Landing Page específica. Notamos que isso garante que a conversão seja maior. Por exemplo, para os e-mails que o parceiro dispara para a sua base, podemos enviar um link que leva para uma página específica com as duas marcas e dando as boas vindas à DogHero.

Campanhas

Quando fazemos ativações de rua ou campanhas para períodos específicos do ano, podemos criar Landing Pages que usem imagens e palavras relacionadas. Podemos fazer uma página sobre hospedagem de cachorros no período do Natal, e outra para o recrutamento de anfitriões, por exemplo.

Testes A/B

Para mudanças em páginas importantes, podemos rodar testes A/B usando Landing Pages para validar mudanças específicas em imagens, palavras, botões ou até mesmo no formato da página e mídia utilizada. Nesse caso, a validação pode acontecer sem nenhuma mudança no website e, se validada, a mudança pode ser incorporada ao fluxo do site.

Com essas premissas em mente, buscamos a ferramenta que se adequaria às necessidades da DogHero, e encontramos o Unbounce.

O Unbounce é um site drag and drop. Sua principal feature é validar com praticidade os testes A/B para as páginas desenvolvidas. Tudo na ferramenta é feito pensando nesta praticidade. Você cria uma página de controle, e pode criar suas variações. A URL será a mesma, e você mesmo define quantos % cada variação irá receber de acesso. Depois, define as metas de acesso, e acompanha o gráfico de conversão de cada variação.

Dashboard dos testes A/B

Entre alguns recursos que buscamos em uma ferramenta como o Unbounce, posso citar:

1. Velocidade no desenvolvimento (e nas alterações)

As interfaces de drag and drop são práticas, tornando muito fácil desenvolver um site em uma plataforma como essa. Basta incluir imagens, botões, alterar fontes, cores e textos. Outra facilidade é o suporte que essas ferramentas dão para diversos tipos de mídia. É fácil inserir imagens, vídeos, etc.

No caso do Unbounce, também é possível fazer a edição de CSS, HTML e Javascript, então acaba sendo uma alternativa customizável e flexível.

Para publicar, basta definir a URL, e clicar em um botão de Publish. Muito, muito simples!

O único porém, é que por ser tão flexível e permitir tantas edições, as ferramentas de DIY podem parecer complexas à primeira vista. Na primeira vez que usei, demorei algo em torno de dois dias para montar uma Landing Page. Na segunda, usando o mesmo template, não levei mais do que 3 horas.

2. Desenvolvimento para Desktop e Mobile

É sempre possível trabalhar com mobile first em ferramentas de criação de Landing Pages. O responsivo funciona bem, e dá pra acompanhar tudo em Preview.

O Unbounce, por exemplo, tem duas abas. Uma para exibir a versão desktop, outra para exibir a versão mobile. Ao criar a interface e inserir o conteúdo em uma delas, automaticamente a outra é atualizada. Demorei bastante até entender o funcionamento correto dessa feature, mas com um pouco de prática, você acaba economizando bastante tempo no desenvolvimento.

3. Criação de variações de uma mesma página

Ao finalizar uma página de controle, você pode duplicar esta página, gerando a primeira variação. Na variação, você pode alterar qualquer informação.

Outra vantagem do Unbounce: ele fornece uma opção de texto dinâmico para campanhas de ads. Neste caso, o texto se adapta às palavras-chaves que foram buscadas pelo usuário no Google. Uma mão na roda para escalar as campanhas, sem precisar criar dezenas de variações de uma Landing Page.

Variações de uma mesma Landing Page

4. Métricas nativas da ferramenta

As ferramentas de criação de Landing Pages costumam fornecer algumas métricas de acompanhamento. Além dos básicos visitantes e visualizações, você pode definir goals na página, como um botão de CTA, por exemplo, e a própria ferramenta irá informar a quantidade de pessoas que clicaram neste botão, informando assim a conversão de cada versão disponível.

5. Otimizações para SEO

É importante poder criar Titles, Keywords, Description e Meta Data da Landing Page, garantindo a otimização da página para recursos de busca. Rodando alguns testes, identificamos que a otimização do Unbounce é muito boa. Mais um motivo em escolhermos essa plataforma.

Entendo que alguns motivos pelos quais escolhemos seguir pelo caminho das Landing Pages pode variar de negócio para negócio, mas também acredito que muitos sejam corpartilhados por diversas empresas.

O foco no conteúdo aliado à capacidade de se trabalhar de forma ágil com testes A/B é uma combinação muito poderosa, e de fato tem funcionado muito bem para nós. E você, tem uma estratégia diferente para o uso de Landing Pages em sua empresa?

Obrigado pela leitura!

E aí, gostou do texto? Adoraríamos saber sua opinião sobre o que foi escrito por aqui. Deixe seu comentário e siga a DogHero no Medium para acompanhar as próximas publicações! 🐶

Gostaria de trabalhar com a gente? Confira nossas vagas abertas.

--

--

Fabio Michelan
DogHero Brasil

Design & Innovation Lead at Google, Founder at DesignerTrack, Mentor at ADPList and UX Certified by NN/g