Todos os cases

Case 01 / 11

Agrow

Duas páginas de vendas no ar e nenhuma vendendo. Os dados do Clarity mostraram o que cada uma acertava.

Cliente
aGrow, sistema de gestão para lojas agropecuárias, Uberlândia (MG)
Meu papel
Análise de dados no Microsoft Clarity, UX e UI da versão C
Ferramentas
Microsoft Clarity (painel e API) e medição de desempenho
Dois celulares sobre fundo verde-acinzentado: atrás, desfocada, a primeira tela da versão A; na frente, nítida, a versão C com oferta, preço e o botão Ver planos e contratar

Problema e solução

Problema

A aGrow tinha duas landing pages dividindo o tráfego pago, a A e a B. Chegavam visitas, a contratação não acontecia, e ninguém sabia qual manter nem por que nenhuma vendia.

Solução

Li as duas no Microsoft Clarity: a A tinha o conteúdo, a B tinha o desempenho. A versão C junta as duas e põe oferta, preço e botão antes da rolagem.

(01)

As duas páginas

Duas páginas no ar, nenhuma resposta.

A home, versão A, tinha 13 blocos e 49 perguntas no FAQ. A /b, versão B, tinha 10 blocos e 37 perguntas. Os anúncios da Meta e do Google dividiam o tráfego entre as duas.

As duas páginasAs duas páginas, o mesmo tráfego e a pergunta do cliente: qual das duas fica?
As duas páginasAs duas páginas, o mesmo tráfego e a pergunta do cliente: qual das duas fica?

(02)

Análise no Clarity

A tinha o conteúdo. B tinha o desempenho.

Antes de mexer na tela, cruzei no Microsoft Clarity o tempo ativo, os cliques, os erros, o mapa de calor e a velocidade no celular. Depois exportei três dias pela API para ver quem chegava e onde parava.

PlacarO placar do Clarity: A tem o conteúdo, B tem a velocidade, nenhuma vende.
PlacarO placar do Clarity: A tem o conteúdo, B tem a velocidade, nenhuma vende.
EvidênciasOs prints do Clarity, versão por versão, e o que eu li em cada um.
EvidênciasOs prints do Clarity, versão por versão, e o que eu li em cada um.
PúblicoQuem mais chega é quem menos desce: por isso o preço subiu para o topo.
PúblicoQuem mais chega é quem menos desce: por isso o preço subiu para o topo.
BotãoO erro que o Clarity registrava era o botão principal falhando para metade das visitas.
BotãoO erro que o Clarity registrava era o botão principal falhando para metade das visitas.
HeroA primeira tela da versão C: oferta, preço, painel e botão antes da rolagem; depois a prova e os quatro controles.

(03)

Versão C

Tudo o que decide chega antes da rolagem.

Nem A nem B: o conteúdo da A rodando na velocidade da B. Cada um dos sete blocos responde a uma pergunta do lojista e a um dado da análise.

DecisãoCinco critérios tirados da análise. Só a C atende a todos.
DecisãoCinco critérios tirados da análise. Só a C atende a todos.
A versão C inteira no computador, do topo ao rodapé: oferta com preço e painel, prova, o que o sistema resolve, planos, como começar, dúvidas, fechamento e rodapé
  1. 01 · Oferta e produto rodando AB

    “Isso é para mim? Existe mesmo?”

    Quase metade das visitas abria dentro do app da Meta, lia 22,8 s e descia só 14,8% da página. Oferta, prova e ação precisam caber na primeira tela.

    • Título com a oferta e o preço no subtítulo: a partir de R$ 499/mês.
    • Botão com link comum para os planos. O da A rolava por script e quebrava dentro do app: 15,2% das sessões no Facebook e 9,3% no Instagram tinham erro.
    • Réplica do painel do sistema no lugar da ilustração genérica.
    • 174 KB no primeiro acesso pelo celular, contra 432 KB na A. Teto de 1,2 MB.
  2. 02 · Prova imediata A

    “Quem já usa, e há quanto tempo?”

    Na A, os depoimentos ficavam a 7.370 px, em 62% da página, e 61% das sessões não passavam de 10%. Quase ninguém chegava à prova.

    • Do 8º para o 2º bloco, logo depois da oferta.
    • 18 anos ao lado de lojas agropecuárias e três depoimentos com foto, conferidos pelo cliente.
  3. 03 · O que ele resolve ANovo

    “O que exatamente ele faz?”

    Os quatro pilares (vendas, estoque, financeiro e fiscal) vêm da A, que segurava 36 s de tempo ativo contra 9 na B. O público do agro é pragmático: ver o sistema vale mais que ler sobre ele.

    • Vídeo de 1min35 com legenda, que só baixa no clique.
    • No celular, o vídeo vem antes dos pilares.
  4. 04 · Planos e preços AB

    “Quanto custa e o que vem depois?”

    Na A, os planos começavam a 5.261 px e, pela rolagem medida, só 3,1% das sessões da Meta chegavam lá (estimativa). Na C, começam a 34,5% da página.

    • Do 7º para o 4º bloco.
    • No celular, uma barra fixa acompanha a leitura: “A partir de R$ 499/mês”.
    • Sem taxa de implantação, sem fidelidade.
  5. 05 · Como você começa A

    “Quanto trabalho isso vai me dar?”

    Os três passos vêm da A. Trocar de sistema assusta quem tem loja aberta: o bloco responde ao medo de parar a operação.

    • “Sem parar a loja, sem equipe de TI e sem projeto de meses.”
    • Crie sua conta · Traga o que já existe · Comece a faturar.
    • Importação por planilhas do Excel, texto do próprio cliente.
  6. 06 · FAQ curado ANovo

    “E se der errado?”

    A A tinha 49 perguntas em quatro abas; a B, 37. Ficou só o que passa no critério: esta pergunta, sem resposta, impede a contratação?

    • 8 perguntas: 6 na proposta, 8 depois da revisão do cliente.
    • Acordeão nativo, que abre sem script e aparece na busca da página.
    • Nova: “Dá para trazer os dados do sistema que eu uso hoje?”
  7. 07 · Fechamento A

    “Ok, e agora?”

    Para quem leu tudo: o botão volta com o preço e a condição de saída, sem pedir um formulário.

    • “Ver planos e contratar” · a partir de R$ 499/mês · cancele quando quiser.
  8. 08 · Rodapé e aviso de cookies Novo

    “E o aviso de cookies?”

    No mapa de calor da B, os toques da primeira tela iam para o aviso, que cobria o fim da tela.

    • Faixa discreta no rodapé, com recusar e aceitar no mesmo peso.
    • Contato, CNPJ e políticas no fim, fora do caminho de quem decide.

A versão C no ar, capturada no computador, com os blocos medidos na própria página. Alturas em px no celular, em 390 px.

EstruturaAs três versões inteiras no celular, na mesma escala. A linha marca 14,8% da altura de cada página, a rolagem média de quem chega pelo app da Meta.

(04)

Resultado

Mais curta, mais leve e com o preço à vista.

Medido nas próprias páginas, com o mesmo método.

−44%de altura no celular11.896 para 6.631 px
−60%de peso no primeiro carregamento432 para 174 KB
4ºbloco para os planos, que ficavam no 7ºPreço também no topo
8perguntas no FAQ, contra 49 na versão AValidadas pelo cliente

Antes · A e B

Depois · C

Título genérico: Controle sua loja agropecuária

Oferta concreta, com preço e botão na primeira tela

Botão que dependia de script e quebrava dentro dos apps

Link comum, que funciona em qualquer navegador

Preço no meio de quase 12 mil pixels

Preço no subtítulo, numa barra fixa e no 4º bloco

Depoimentos no 8º bloco

Depoimentos com foto no 2º bloco

Aviso de cookies levando os toques da primeira tela

Aviso discreto no rodapé

Como medir a C

Metas definidas na entrega: planos vistos por 45% de quem vem do app, 25% de play no vídeo e o conteúdo principal em até 2 s no celular.