Pense em todas as vezes que você se inscreveu para algo em sua vida. Certamente você já baixou o Spotify, Dropbox, Netflix ou Evernote alguma vez, não é mesmo?
Cada uma dessas inscrições provavelmente foi resultado de um botão para ação (call-to-action (CTA) eficaz. E é muito importante orientar seus visitantes na jornada de compra usando CTAs estratégicos.
Pense nisso: se você não tivesse sido atraído pela chamada ou pelo design do CTA ou se não tivesse sido orientado de forma tão eloquente durante o processo de inscrição, provavelmente usaria muito menos aplicativos e sites do que agora.
Para ajudar você a identificar o que é eficaz e o que não é, listamos 3 exemplos de CTAs que são totalmente inovadores. Esses exemplos de call-to-action são divididos em três categorias
1) CTAs simples e eficazes
2) CTAs com excelentes frases de chamariz
3) CTAs que equilibram vários botões em uma página
Exemplos de call-to-action simples e eficazes:
- Evernote
Botão para ação: Sign up
“Lembrar de tudo”. Os visitantes podem entender imediatamente essa mensagem no momento em que chegam nessa página. O design no site do Evernote torna-se super simples para os usuários verem benefícios rápidos de usar o aplicativo e como se inscrever para usá-lo. Além disso, a cor verde dos botões CTA principais e secundários é o mesmo verde que o título e o logotipo do Evernote, que saltam da página.
- Dropbox
Botão para ação: Sign up for free
O Dropbox sempre adotou um design simples com muito espaço negativo. Até mesmo os gráficos em sua homepage são sutis e simples.
Graças a esse design simples e espaço negativo, o botão de frase de chamariz azul “Inscreva-se gratuitamente” destaca-se de tudo o mais na página. Como o CTA e o logotipo do Dropbox são da mesma cor, é fácil para o visitante interpretar esse CTA.
- OfficeVibe
Botão para ação: Subscribe
Aqui está um apelo à ação do OfficeVibe. Enquanto o usuário percorre um post em seu blog, um banner desliza na parte inferior da página com um apelo à ação para se inscrever em seu blog. A melhor parte? A cópia no slide-in diz que você estará recebendo dicas sobre como se tornar um gerente melhor, por exemplo, se você estiver em um post sobre como se tornar um gerente melhor. Em outras palavras, a oferta é algo que o usuário já está interessado.
Além disso, CTAs deslizantes são discretos e oferecem uma experiência mais amável, pois fornecem mais informações e ainda permitem que você continue lendo o post do blog.
- Netflix
Botão para ação: Join free for a month
Um grande medo que os usuários têm antes de se comprometer com algo? Que aquilo vai ser uma dor para cancelar a assinatura, se eles acabam não gostando. A Netflix retira esse medo pela raiz com a chamada “Cancele a qualquer momento” logo acima do botão “Inscreva-se gratuitamente por um mês”. Eu arriscaria um palpite de que essa garantia sozinha aumentou as inscrições. Além disso, você notará novamente que a cor vermelha das CTAs principais e secundárias corresponde à cor do logotipo da Netflix.
- Square
Botão para ação: Get starded
Para alcançar um design de CTA eficaz, você precisa considerar mais do que apenas o próprio botão. Também é muito importante considerar elementos como cor de fundo, imagens ao redor e texto ao redor.
Conscientes desses componentes adicionais de design, o pessoal da Square usou uma única imagem para mostrar a simplicidade do uso de seu produto, onde o CTA “Get Started” (Avançar) aguarda seu clique. Se você olhar de perto, a cor do cartão de crédito na imagem e a cor do botão CTA correspondem, o que ajuda o espectador a conectar os pontos do que esperar quando clicar.
- Prezi
Botão para ação: Give Prezi a try
O pessoal da Prezi também está no visual de design minimalista em seu site. Além do dinossauro verde e do café marrom escuro, a única outra cor que acompanha o design predominantemente preto-e-branco é um azul brilhante – o mesmo azul do logotipo principal. Esse azul brilhante é estrategicamente colocado na página inicial: o CTA principal “Give Prezi a try” e o CTA “Get Started” secundário, que levam os usuários à mesma página de preços.
- Full bundle
Botão para ação: Nosso trabalho
Full bundle é outra empresa que usa espaço negativo para fazer seu CTA principal. O call-to-action branco “Our work” destaca-se contra os cinzas escuros do fundo. A escolha do CTA também é estratégica. Como eles existem principalmente para criar presenças on-line de clientes, é importante que eles mostrem seu trabalho – e é para isso que a maioria das pessoas acessa o site.
- Panthera
Botão para ação: Join
O pessoal da Panthera está à procura de usuários que realmente se importam com gatos selvagens em todo o mundo e querem se juntar a um grupo de pessoas que se sentem da mesma maneira. Para visar essas pessoas em particular, nós amamos como eles usam linguagem que falaria para grandes amantes de gatos: ” Join the pride today”. A página em si é super simples: um formulário na página com dois campos simples e um botão pedindo às pessoas para (novamente) “Join”.
CTAs com chamadas criativas para frases de ação
- Huemor
Frase CTA: Launch (Do not press)
Se você acessou um site e viu um “Launch” CTA acompanhado da chamada “Do Not Press” … o que você faria? Sejamos honestos: você estaria morrendo de vontade de pressioná-lo. O uso da inofensiva psicologia reversa aqui é brincalhão, o que está muito de acordo com a voz da marca de Huemor.
- Aquaspresso
Frase CTA: Send me specials now!
O objetivo de um call-to-action é direcionar os visitantes do seu site para um curso de ação desejado – e os melhores CTAs fazem isso de uma forma útil para os visitantes. O pessoal da empresa de café Aquaspresso realmente acertou esse equilíbrio aqui com o CTA pop-up em sua página principal do blog.
Aqui, o curso de ação desejado é para os leitores do blog verificarem o que eles realmente estão vendendo (e esperamos que compre deles). Há muitas maneiras de se ter feito isso, incluindo a criação de um CTA que incentive as pessoas a “Confira nossos produtos mais populares!” ou algo muito direto. Mas amamos o que eles fizeram: a CTA oferece aos leitores do blog algo muito mais útil e sutil – uma oferta para “promoções de hoje” em troca do endereço de e-mail do leitor.
Acrescentando que as especiais são para hoje, é apenas um ótimo exemplo de gatilho mental de escassez, que nos faz atribuir mais valor a coisas que achamos escassas. O medo de que os especiais de hoje sejam melhores que os de amanhã pode fazer com que as pessoas queiram preenchê-lo e reivindicar sua oferta enquanto puderem.
- QuickSprout
Frase CTA: Are you doing your SEO wrong? Enter your URL to find out
Ninguém quer estar errado. É por isso que um botão de apelo à ação, como o CTA deslizante do QuickSprout no blog deles, é tão interessante. Ele pergunta ao leitor: ” Are you doing your SEO wrong? ” Bem, sou eu? Tudo o que tenho a fazer é digitar minha URL para descobrir – parece bastante fácil. É uma linguagem como essa que pode realmente atrair visitantes para clicar.
Além disso, ter o slide do CTA na postagem do meio do blog é uma ótima tática para capturar os leitores antes que eles saiam da página. Tradicionalmente, muitos blogs têm CTAs na parte inferior de cada postagem do blog, mas pesquisas mostram que a maioria dos leitores obtém apenas 60% do caminho através de um artigo.
- Grey Goose
Frase CTA: Discover a cocktail tailored to your taste
Aqui está um CTA divertida e exclusiva que pode fazer com que as pessoas cliquem. Considerando que os visitantes do site podem ter esperado para ser direcionado para páginas de produtos ou comunicados de imprensa da página inicial, um CTA para “Discover a cocktail tailored to your taste” é uma pergunta agradavelmente surpreendente. As pessoas adoram personalização, e esse tipo de CTA parece um jogo atraente. O ícone do botão Reproduzir ao lado da chamada dá uma dica de que os visitantes serão levados a um vídeo para que tenham uma ideia melhor do que esperar quando clicarem.
- Treehouse
Frase CTA: Claim your free trial
Muitos sites de empresas oferecem aos usuários a oportunidade de iniciar uma avaliação gratuita. Mas o site do CTA no Treehouse não diz apenas “Inicie um teste grátis”; diz “Reivindique seu teste grátis”.
A diferença na redação pode parecer sutil, mas pense em quanto mais pessoal é “Reivindique seu teste gratuito”. Além disso, a palavra “reivindicação” sugere que ela pode não estar disponível por muito tempo, dando aos usuários uma sensação de urgência para obter a avaliação gratuita enquanto puderem.
- OKCupid
Frase CTA: Continue
O CTA da OKCupid não parece tão impressionante à primeira vista, mas seu brilho está nos pequenos detalhes.
O botão da frase CTA, que é verde brilhante e se destaca bem em um fundo azul escuro, diz “Continuar”. A simplicidade deste termo dá esperança de que o processo de inscrição seja curto e casual. Para mim, este CTA parece mais que eu estou jogando um jogo divertido do que preencher um formulário chato ou me comprometer com algo que possa me deixar nervoso.
- Blogging.org
Frase CTA: Countdown clock
Nada como um cronômetro para fazer alguém querer agir. Depois de passar um curto período de tempo na página inicial do blogging.org, novos visitantes são recebidos com uma CTA pop-up com uma “oferta por tempo limitado”, acompanhada por um cronômetro que conta a partir de dois minutos.
Assim como no exemplo 10 da Aquaspresso, esse é um uso clássico do gatilho mental da escassez, que nos leva a atribuir mais valor a coisas que achamos escassas. Limitar o tempo que alguém tem para preencher um formulário faz com que as pessoas queiram preenchê-lo para obter sua oferta enquanto podem.
Curioso, o que acontece quando o tempo acaba? Hilário, nada acontece. O CTA pop-up permanece na página quando o cronômetro chega a zero.
- IMPACT Branding & Design
Frase CTA: What we do
Os CTAs podem se sentir realmente agressivos e vendedores se o idioma errado for usado. Eu gosto da abordagem educacional do IMPACT, onde eles desafiam os visitantes a entender o que a empresa faz antes de forçá-los a tomar qualquer outra ação. Essa CTA é especialmente intrigante para mim porque eles nem usam um verbo de ação, mas ainda conseguem atrair as pessoas a clicarem.
- EPIC
Frase CTA: Let’s start a new project together
O pessoal da agência EPIC usa sua homepage principalmente para mostrar seu trabalho. Ao chegar na página, você é recebido por vídeos animados que mostram parte do trabalho que eles fizeram para os clientes, que giram em um carrossel. Embora haja muitos outros lugares em que os usuários podem clicar em seus sites, incluindo os websites de seus clientes, a frase de chamariz principal se destaca e sempre contrasta com o vídeo que está sendo reproduzido em segundo plano.
Eu adoro o fato de contar com uma linguagem amigável e inclusiva: “Vamos começar um novo projeto juntos”, o que dá uma dica aos usuários que procuram um parceiro criativo para o qual são uma equipe especialmente grande para se trabalhar.
- Brooks Running
Frase CTA: Find out when we have more
Quantas vezes você perseguiu um produto que você ama, apenas para descobrir que ele está esgotado? Bem, como você deve saber, também não é um piquenique para o vendedor. Mas só porque você ficou sem um item não significa que você deveria parar de promovê-lo.
A Brooks Running usa uma CTA inteligente para garantir que seus clientes não saltem de seu website apenas porque seu tênis favorito está fora de estoque. Na captura de tela abaixo, você pode ver Brooks divulgando um tênis incrível com o CTA: “Descubra quando tivermos mais”. Eu amo como esse botão transforma as más notícias em uma oportunidade de reter clientes. Sem isso, os clientes de Brooks provavelmente esqueceriam o sapato e procurariam em outro lugar.
Quando você clica no botão CTA azul mostrado abaixo, Brooks direciona você para uma página com um código simples que você pode enviar uma mensagem de texto para a empresa. Este código solicita que Brooks ative automaticamente o visitante quando o sapato desejado estiver disponível novamente.
- Humboldt County
Frase CTA: Follow the magic
O site do Humboldt County é lindo por si só: você recebe um vídeo em tela cheia de imagens incrivelmente belas. Mas o que eu realmente amo é o botão de call-to-action não convencional colocado no centro da parte inferior, que apresenta um ícone de coelho e as palavras “Siga a mágica”.
Isso aumenta o tipo de sensação fantástica da filmagem, fazendo você se sentir como se estivesse prestes a entrar em um conto de fadas.
Além disso, quando você clica no CTA, o site se transforma em uma espécie de jogo de escolha de sua própria aventura, que é um caminho de chamariz divertido para os usuários e os incentiva a passar mais tempo no site.
Equilibrando vários botões de call to action
- Uber
Botões para ações: Sign up to drive | Start riding with Uber
A Uber está procurando por dois tipos muito diferentes de pessoas para se inscrever em seu site: motoristas e passageiros. Ambas as pessoas estão procurando por coisas totalmente diferentes, e ainda assim, o site as une muito bem com o grande vídeo sendo reproduzido em segundo plano mostrando os pilotos e motoristas do Uber se divertindo em locais em todo o mundo.
- Spotify
Botões para ações: Go Premium | Play free
Assim que você chega à página inicial do Spotify, fica claro que o objetivo principal é atrair clientes dispostos a pagar por uma conta premium, enquanto o CTA para os usuários se inscreverem gratuitamente é muito secundário.
Não é apenas a chamada que revela isso; é também a coloração dos botões do CTA. A CTA “Go Premium” é verde-limão, fazendo com que ela saia da página, enquanto a CTA “Play Free” é branca e combina com o restante da cópia na página. Esse contraste garante que os visitantes sejam atraídos para o CTA premium.
- Ugmonk
Botões para ações: Send me the coupons | I’m not interested
Os CTAs de saída, também conhecidos como pop-ups de intenção de saída, são diferentes dos pop-ups normais. Eles detectam o comportamento de seus usuários e só aparecem quando parecem que estão prestes a sair de seu site. Ao intervir de forma oportuna, esses pop-ups servem como uma maneira fantástica de chamar a atenção do leitor, ao mesmo tempo em que lhes oferece um motivo para ficar.
Ugmonk tem uma ótima saída CTA, oferecendo duas opções para os usuários como um apelo final antes de deixar o site. Primeiro, eles oferecem um desconto de 15% em seus produtos, seguido por duas opções: “Sim, por favor: me envie o cupom” e “Não, obrigado: eu não estou interessado”. É muito útil que cada CTA esclareça o que “sim” e “não” realmente significam, e eu também gosto que eles não usem linguagem de culpa como “não, obrigado: eu odeio a natureza”, como já vi em outros sites. Finalmente, observe que o botão “Sim, por favor” é muito mais brilhante e convidativo em cores do que a outra opção.
Botões para ações: Continue with Facebook | Sign up
Quer se inscrever no Pinterest? Você tem algumas opções: inscreva-se via Facebook ou via e-mail. Se você tem uma conta no Facebook, o Pinterest quer que você faça isso primeiro. Como eu sei? Esteticamente, eu sei porque o CTA azul do Facebook vem em primeiro lugar e é muito mais proeminente, colorido e reconhecível devido ao logotipo e cor da marca. Logicamente, eu sei, porque se você fizer login através do Facebook, o Pinterest pode obter os dados da API do Facebook e obter mais informações sobre você do que se você fizer login através do seu endereço de e-mail.
Embora esta página esteja otimizada para trazer novos membros, você notará um CTA muito sutil para as pessoas com contas do Pinterest fazerem login no canto superior direito.
- Madewell
Botões para ações: Take me there | What’s next
A Madewell sempre teve um design de destaque, levando o que poderia ser um típico site de comércio eletrônico para o próximo nível. Seu uso de CTAs em sua homepage não é uma exceção.
Quando você chega pela primeira vez na página, é recebido com a chamada “Estou procurando …” seguido por uma categoria, como “Roupas que viajam em qualquer lugar”. Abaixo desse tecxto há duas opções: “Yes, Take Me There” ou “Hmm … What’s Next?” O usuário pode escolher entre os dois CTAs para procurar roupas que são boas para viajar ou ser levado para o próximo tipo de roupa, onde eles podem jogar novamente.
Esse ramificação é uma ótima maneira de tornar seu site mais interessante para os usuários que o veem sem ter uma ideia específica de onde desejam procurar.
Botões para ações: Download on the App Store | Get it on Google Play
Como o Instagram é um aplicativo principalmente móvel, você verá dois CTAs pretos de tamanho igual: um para baixar o Instagram na App Store da Apple e outro para baixá-lo no Google Play. A razão pela qual esses CTAs são de igual calibre é porque não importa se alguém faz o download do aplicativo na App Store ou no Google Play … um download é um download, que é exatamente o que o Instagram está otimizando. Se você já tem o Instagram, também pode clicar no CTA para “Entrar”, se preferir essa opção também.
Fonte: Hubspot
