Já preencheste um formulário no telemóvel e viste os campos a não acabar? Respondes a uma pergunta, tocas em seguinte e aparece outra. E outra. Depois do quinto ou sexto ecrã sem fim à vista, desistes. Não terminas o formulário. Vais procurar um concorrente que torne isto mais fácil. Isto acontece a toda a hora com formulários de vários passos mal desenhados. Mas quando um formulário de vários passos é bem feito, passa-se outra coisa. Os utilizadores passam por ele a voar. Concluem-no mais depressa do que um formulário longo de uma só página. A taxa de conversão sobe 86 por cento em comparação com perguntar tudo numa só página.
Este capítulo explica como funcionam os formulários de vários passos, quando usá-los (e quando não), como ordenar os passos para mais pessoas os concluírem e o que separa um bom formulário assistente de um que perde utilizadores a meio. Se tens um formulário com mais de sete campos ou um percurso complexo com necessidades de dados diferentes em fases diferentes, este é o teu guia para o fazeres bem.
O que é um formulário de vários passos?
Um formulário de vários passos é um formulário dividido por vários ecrãs ou páginas. Em vez de mostrar todos os campos de uma vez, mostra um subconjunto de campos por passo. O visitante preenche o primeiro ecrã, clica em seguinte, vê o segundo ecrã e continua até terminar. Também se chama formulário passo a passo, formulário assistente ou formulário progressivo, embora estes termos signifiquem coisas ligeiramente diferentes consoante a forma como o formulário é construído.
O termo formulário assistente refere-se a um formulário em que os passos são sequenciais e obrigatórios. O passo 1 leva ao passo 2, o passo 2 leva ao passo 3, e não se salta nada. Funciona bem em processos de candidatura, fluxos de integração ou qualificação de contactos, onde cada passo se apoia no anterior. Um formulário progressivo é diferente. Mostra campos dinamicamente com base em respostas anteriores no mesmo ecrã ou carrega campos condicionalmente sem passar para outra página. Alguns formulários progressivos ramificam-se em caminhos diferentes consoante o que o visitante responde, o que quer dizer que dois visitantes podem ver passos completamente diferentes conforme as respostas.
Neste capítulo, tratamos formulários de vários passos e formulários assistente como a mesma coisa, para simplificar. O princípio essencial é que o formulário é dividido em vários ecrãs, cada um com um subconjunto de campos. O visitante avança pelos passos sequencialmente, só para a frente ou com a possibilidade de voltar atrás e editar as respostas.
Quando usar um formulário de vários passos em vez de um de uma só página?
A sabedoria convencional diz que os formulários de vários passos convertem sempre melhor. Não é bem assim. Os formulários de vários passos convertem melhor quando tens muitos dados para recolher ou um percurso de cliente complexo. Mas se tens um formulário simples que cabe num só ecrã sem deslizar, dividi-lo em passos costuma matar as conversões em vez de as melhorar.
Usa um formulário de vários passos se o teu formulário tem mais de sete campos. Se tens sete campos ou menos e cabem todos num ecrã sem deslizar, mantém-no numa só página. O custo extra de vários passos (carregamentos de página, complexidade, preocupações com o progresso) não compensa o ganho marginal. Mas se tens dez, quinze ou vinte campos, um formulário de vários passos é quase sempre melhor. O caso de uma empresa de corretagem mostra-o claramente. Um formulário de geração de contactos financeiros que passou de uma só página com muitas perguntas para quatro passos focados aumentou a conversão de onze por cento para quarenta e seis por cento. Esse é o poder dos formulários de vários passos, mas só funciona quando o formulário é longo o suficiente para justificar os passos.
Usa um formulário de vários passos se o teu formulário recolhe tipos diferentes de informação em fases diferentes. Um formulário de candidatura pode pedir informação básica (nome, email), depois detalhes da situação (a que te candidatas, porquê), depois detalhes sensíveis (referências, historial salarial). Dividir isto em passos agrupa as perguntas relacionadas, o que parece mais natural do que misturá-las numa só página.
Evita formulários de vários passos se o teu público tem intenção alta e está pronto a agir. Um potencial cliente que já decidiu comprar o teu produto e quer avançar depressa vai ressentir-se de um formulário de compra em três passos. Quer concluir a compra da forma mais rápida possível. É por isso que as transações B2B de valor alto usam muitas vezes formulários de uma só página. O cliente sabe o que quer e não precisa de o formulário o conduzir pela mão passo a passo.
Evita formulários de vários passos em ações simples e transacionais. Uma inscrição em newsletter não precisa de passos. Uma reposição de palavra-passe não precisa de passos. Um formulário de "contacta-nos" com quatro campos não precisa de passos. Se o formulário é direto e todos os campos cabem num ecrã, um só passo é melhor. Não acrescentes passos só porque podes.
Quantos passos deve ter um formulário de vários passos?
A resposta não é um número mágico. O número certo de passos depende de um princípio. Cada passo deve representar uma tarefa cognitiva distinta, não um agrupamento arbitrário de campos. Não dividas um formulário em passos só para reduzir o número de campos visíveis. Divide quando o visitante precisa de mudar de contexto mentalmente.
Na maioria dos formulários, entre três e cinco passos é o ideal. Com dois passos, mais vale usar uma só página. Sete ou mais passos causam cansaço de conclusão. Os utilizadores começam a perguntar-se quantos ecrãs mais têm de passar. Quanto mais longo o caminho, mais pessoas abandonam. Fica entre três e cinco, a não ser que o teu formulário tenha uma estrutura muito específica que exija mais.
O que conta como um passo? Um passo é uma tarefa cognitiva. Um passo em que recolhes quem a pessoa é (informação básica, contactos, função) é uma tarefa. Um passo em que ficas a conhecer o problema é uma tarefa. Um passo em que descreve a solução atual é uma tarefa. Um passo em que indica o orçamento e o prazo é uma tarefa. Cada um destes é um contexto mental distinto, e por isso dividi-los em passos separados parece natural em vez de esmagador.
Porque é que a lógica condicional importa nos formulários de vários passos
Nem todos os visitantes precisam de ver todos os passos. Um visitante que pede um empréstimo não precisa das mesmas perguntas de um visitante que pede uma demonstração. Um visitante que compra um plano básico não precisa dos mesmos passos de quem compra um plano empresarial. É aqui que a lógica condicional se torna crítica. A lógica condicional deixa-te mostrar passos diferentes consoante o que o visitante responde. Reduz o número total de passos que vê e faz o formulário parecer personalizado em vez de genérico.
Sem lógica condicional, obrigas toda a gente a seguir o mesmo caminho. Um visitante que responde não a uma pergunta não precisa da seguinte, mas continua a ter de ver e saltar os cinco campos seguintes. Esse atrito acumula-se. Com lógica condicional, levas essa pessoa diretamente ao passo relevante. O formulário adapta-se às necessidades dela. É por isso que a lógica condicional não é só uma funcionalidade simpática. É essencial em qualquer formulário de vários passos com caminhos ramificados ou casos de uso diferentes.
O princípio essencial da lógica condicional é a clareza. Se levas um visitante do passo dois diretamente para o passo cinco, ele precisa de perceber porquê e o que aconteceu. Se a lógica está partida ou confusa, os visitantes abandonam porque se sentem perdidos. Não sabem se erraram a resposta a uma pergunta ou se o formulário está avariado. Testa sempre bem os ramos condicionais antes do lançamento. Garante que cada caminho de resposta possível leva ao passo certo.
Como estruturar e ordenar os passos de um formulário de vários passos?
A ordem em que apresentas a informação importa muito mais do que o número de passos. Há um princípio psicológico em jogo. Quando alguém investe esforço no teu formulário ao preencher um passo, tem mais probabilidade de continuar para o passo seguinte. Quanto mais tempo fica contigo, mais provável é que conclua. Por isso o primeiro passo não é só um passo. É o ponto de compromisso em que os utilizadores decidem se continuam ou abandonam o formulário inteiro.
Primeiro passo: começa com perguntas fáceis e não sensíveis
O primeiro passo de um formulário de vários passos deve ter a menor barreira de entrada possível. Pede o nome, o email ou uma pergunta simples de preferência. Não comeces por pedir o telefone, o orçamento, referências ou qualquer coisa que exija confiança ou reflexão profunda. O visitante vê o primeiro passo e decide num instante. Se parece fácil e rápido, conclui-o. Se parece invasivo ou complexo, vai-se embora.
A psicologia aqui chama-se efeito de progresso dotado. Quando alguém começa o teu formulário, já investiu. Fez a escolha de interagir contigo. O passo seguinte parece menos assustador porque já investiu no passo um. É por isso que o teu primeiro passo tem de ser o mais fácil. Faz as pessoas sentir que estão a progredir de imediato. Depois de concluir o passo um, 90 por cento das pessoas que começaram avançam para o passo dois. Depois de concluir o passo dois, 85 por cento continuam para o passo três. Mas se o passo um é difícil e complexo, nunca chegas ao passo dois.
Passos do meio: agrupa informação relacionada, adia as perguntas sensíveis
Os passos do meio são onde recolhes a maior parte dos dados. É aqui que perguntas sobre o problema do cliente, a situação, a solução atual e as limitações. Agrupa campos relacionados. Um passo pode cobrir a situação e os pontos de dor. Outro cobre o prazo e o orçamento. Um terceiro cobre a equipa e o processo de decisão.
Aqui está o princípio essencial. Não peças informação sensível nos primeiros passos, mesmo que seja relevante. Adia as perguntas de orçamento, os números de telefone e tudo o que exija divulgação pessoal para o passo três ou quatro. Porquê? Porque no passo três o visitante já investiu. Já preencheu dois passos de informação. O custo irrecuperável cria um compromisso psicológico. Está mais disposto a responder a perguntas sensíveis porque abandonar agora parece desperdiçar o trabalho que já fez. Este princípio chama-se efeito de pele em jogo. Quanto mais investido está um visitante, mais disposto fica a dar informação que normalmente hesitaria em partilhar.
Último passo: confirmação, pagamento e detalhes sensíveis
O último passo deve incluir tudo o que conclui a transação ou fixa o compromisso. Se estás a recolher pagamento, é aqui que vai o campo de pagamento. Se precisas de uma assinatura ou consentimento, este é o último passo. Se tens perguntas sensíveis sobre orçamento ou dados pessoais que evitaste nos passos anteriores, é aqui que entram. No último passo, o visitante já completou a maior parte do formulário. Está comprometido. Tem muito mais probabilidade de responder às perguntas e concluir todo o processo.
O último passo também pode incluir um ecrã de confirmação que mostra ao visitante o que preencheu. Deixa-o rever as respostas antes do envio final. Isto melhora a exatidão e cria confiança de que a informação está correta. Também serve de sinal de progresso. Vê um ecrã de confirmação e sabe que o formulário está quase no fim. Este fecho psicológico aumenta as taxas de conclusão.
Indicadores de progresso e navegação
Sem indicador de progresso, os visitantes não sabem quanto vai demorar o formulário. Começam, preenchem um passo, clicam em seguinte e perguntam-se se há mais dez passos pela frente. A incerteza causa abandono. Alguns visitantes simplesmente desistem porque não querem comprometer-se com um número desconhecido de passos. Um indicador de progresso resolve isto mostrando onde estão e quantos passos faltam.
Há três estilos comuns. Passos numerados mostram passo dois de quatro em texto ou como indicadores de passos no topo. Barras de percentagem mostram um preenchimento visual que cresce à medida que o visitante avança. Indicadores de pontos mostram qual passo está ativo, com uma linha ou ligação visual entre eles. Qualquer um funciona, mas a investigação mostra que os passos numerados e as barras de percentagem são ligeiramente mais eficazes do que os pontos, porque comunicam o total com clareza. Quando alguém vê passo um de quatro, sabe que faltam três. Quando vê uma barra preenchida a dois por cento, não tem a mesma clareza.
O próprio indicador de progresso tem um efeito psicológico. Mostrar o progresso num formulário aumenta mesmo a conclusão. Um formulário que mostra que estás a quarenta por cento recebe mais conclusões do que um formulário sem indicador, mesmo que o esforço total seja idêntico. É outra vez o efeito de progresso dotado. Os visitantes sentem que estão a progredir, o que os motiva a continuar.
Inclui sempre um botão de voltar que deixe os visitantes editar as respostas anteriores. Um visitante pode perceber que respondeu mal a uma pergunta ou querer mudar uma resposta anterior. Se o forças a avançar sem poder voltar atrás, sente-se preso. Utilizadores presos abandonam. Os utilizadores que podem navegar livremente têm mais probabilidade de concluir porque sentem que têm o controlo. O botão de voltar também melhora a qualidade dos dados. Se um visitante pode voltar atrás e corrigir erros, recolhes informação mais exata.
Estratégia de campos dentro de cada passo
Agora que vimos a estrutura geral dos passos, vamos olhar de perto para os campos dentro de cada passo. Quantos campos vão em cada ecrã? Que disposição funciona melhor? Como tratas a validação e as mensagens de erro?
Limita cada passo a três a cinco campos no máximo. Não é uma regra rígida, mas é uma orientação prática. Um passo com um ou dois campos parece quase não progredir. Um passo com oito campos parece esmagador. Aponta para três a quatro campos por passo em média. Isto dá-te espaço suficiente para recolher informação útil sem fazer nenhum passo parecer um fardo.
Usa uma disposição de coluna única em todos os campos. Nunca uses disposições de várias colunas dentro de um passo. Parece óbvio, mas muitas equipas tentam pôr mais campos no ecrã com duas ou três colunas. O que acontece na prática é que os utilizadores saltam campos porque o fluxo visual se quebra. Um utilizador que lê uma página para baixo segue esse padrão natural de cima para baixo. Quando os campos estão dispostos em colunas, os utilizadores perdem campos. Um instituto de investigação de usabilidade testou isto extensivamente. Os formulários de coluna única têm uma conclusão bastante mais alta do que os de várias colunas com exatamente os mesmos campos.
Põe as etiquetas por cima dos campos, nunca ao lado. Quando as etiquetas ficam à esquerda de um campo, ocupam espaço horizontal e empurram os campos para baixo na página. Quando as etiquetas ficam por cima dos campos, estão logo ali quando o utilizador foca o campo. Mais importante ainda, as etiquetas que ficam dentro do campo como texto de exemplo desaparecem quando o utilizador clica no campo. As etiquetas por cima dos campos continuam visíveis, para o utilizador nunca esquecer o que está a preencher.
Valida os campos depois de o utilizador sair do campo, nunca enquanto escreve. Quando validas durante a escrita, os utilizadores ficam frustrados. Veem mensagens de erro antes de terminarem de introduzir os dados. Parece que o formulário os está a julgar ou a criticar. Valida depois de passarem ao campo seguinte. Isto dá-lhes tempo para terminar e dá-te oportunidade de verificar o trabalho sem interromper o fluxo. Um visitante que introduz um número de telefone não precisa de ver um erro enquanto ainda escreve. Deixa-o terminar e depois verifica se é válido.
Minimiza os campos de texto livre. Os campos de texto livre obrigam as pessoas a escrever parágrafos. Reduzem bastante a conclusão porque escrever demora e custa esforço. Limita o teu formulário a no máximo dois campos de texto livre no total. Para tudo o resto, usa listas pendentes, botões de opção, caixas de seleção ou escalas de classificação. Uma lista pendente a perguntar em que setor trabalhas é mais rápida do que pedir a alguém que escreva o setor. Um botão de opção a perguntar a dimensão da empresa (pequena, média, grande, empresarial) é mais rápido do que pedir que escrevam a dimensão. Usa campos estruturados sempre que possível.
Erros comuns que matam as conclusões dos formulários de vários passos
Podes seguir todos os princípios deste capítulo na perfeição e mesmo assim matar as tuas taxas de conclusão se cometeres um destes erros.
Não peças informação sensível cedo demais. Se o teu primeiro passo pede o telefone ou a receita anual, vais perder visitantes antes de estarem investidos o suficiente para confiar em ti com detalhes sensíveis. Guarda isso para o passo três ou mais tarde.
Nunca removas o botão de voltar. Alguns formulários só permitem navegação para a frente. Não faças isso. Os utilizadores ficam bloqueados, sentem-se presos e abandonam. Um formulário com navegação para trás supera sempre um sem ela.
Não valides enquanto os utilizadores escrevem. Isto cria feedback constante e frustração. Espera até passarem ao campo seguinte.
Não uses indicadores de progresso que desaparecem ou mudam inesperadamente. Se a tua barra de progresso mostra passo dois de cinco e de repente passa a passo dois de seis, os visitantes perdem a confiança. Sentem que o formulário está a esconder informação. Mantém o número total de passos constante em todo o formulário.
Não uses disposições de campos em várias colunas. Vais perder conclusões de campos porque os utilizadores saltam campos que não veem no fluxo natural de leitura.
Não deixes de guardar o progresso entre passos. Se um visitante preenche três passos e depois sai da página, o trabalho dele deve ficar guardado. Se voltar ao formulário, os dados já introduzidos devem continuar lá. Quando os dados se perdem, os visitantes têm de voltar a introduzir tudo ou abandonam. Isto mata as conversões. Alguns criadores de formulários usam o armazenamento local para guardar o progresso, para que, se um visitante fechar o navegador e voltar mais tarde, os dados continuem lá. É um grande impulsionador da conclusão.
Não uses lógica condicional avariada que encaminha as pessoas para os passos errados. Se um visitante responde à pergunta três com a opção A e a tua lógica devia saltá-lo para o passo cinco mas mostra-lhe o passo seis, vai abandonar. Testa sempre se a tua ramificação condicional funciona corretamente antes do lançamento.
Como a WEMASY ajuda a criar formulários de vários passos
O criador de formulários da WEMASY deixa-te criar formulários de vários passos com lógica condicional, acompanhamento automático do progresso e análise integrada. Constrói um formulário de geração de contactos em cinco passos e vê qual passo tem mais desistência. Encaminha visitantes diferentes para passos diferentes com base nas respostas. Guarda o progresso do visitante para que, se fechar o navegador e voltar mais tarde, os dados estejam intactos. Todos os envios de formulários chegam ao teu painel, onde podes ver respostas, exportar dados e ligar os envios ao teu CRM. Também podes acompanhar métricas de desempenho do formulário, como taxas de conclusão por passo, tempo gasto por página e pontos de abandono. Para um contexto mais profundo sobre como os formulários geram resultados para o negócio e se encaixam na estratégia geral do teu website, lê o nosso guia sobre formulários de website e a sua importância.