O formulário deixou de ser um questionário. Agora é uma conversa.
O antes e o depois do formulário de contacto deste site: de uma página comprida, igual para toda a gente, a quatro passos curtos que seguem o serviço escolhido, escrevem o resumo do pedido e dizem o que falta antes de enviar. Feito numa tarde.
O formulário de contacto costuma ser a parte menos desenhada de um site, e é a que está mais perto do cliente. É ali que alguém decide escrever ou fechar a página. O meu era como quase todos: uma lista de campos. Hoje deixou de ser.
Este artigo mostra o antes e o depois, mudança a mudança, e diz porque é que cada uma existe. Podes ir experimentando o formulário enquanto lês.
Antes: um questionário igual para toda a gente
Era uma página comprida, com tudo à vista: vários tipos de serviço, cinco intervalos de orçamento, nome, email, empresa, telefone, website atual, uma caixa para a mensagem, a aceitação da política de privacidade e o botão de enviar. Quem queria consultoria em IA via as mesmas perguntas de quem queria uma app.
Funcionava. Mas era um questionário: perguntava tudo, a toda a gente, pela mesma ordem.
O resumo, numa tabela
| Antes | Agora | |
|---|---|---|
| Estrutura | Uma página com todos os campos | Quatro passos curtos, com barra de progresso |
| Perguntas | As mesmas para toda a gente | Seguem o serviço escolhido |
| Orçamento | Perguntado sempre | Saltado quando o preço já é conhecido |
| O pedido | Campos soltos | Um resumo que se escreve à medida que preenches |
| Email e website | Escritos sem ajuda | Terminações sugeridas, enganos apanhados, ideias de domínio |
| Sair da página | Perdia-se o que estava escrito | O rascunho fica no teu browser |
| Erros | Apareciam no fim | O que falta está ao lado do botão |
1. Quatro passos curtos, e um que se salta
O formulário passou a ter quatro passos: o que precisas, o orçamento, a descrição e os teus dados de contacto. Uma barra mostra em que passo estás, há um botão Voltar e a tecla Enter avança. Sem JavaScript, continua a ser o formulário simples de uma página: nada deixa de funcionar.
O passo do orçamento salta-se quando não faz sentido. Quem escolhe só o website one-page vê que o preço é fixo. Quem chega do simulador de preços traz a estimativa consigo, e ela já vai no pedido.
A razão: não se pergunta o que já se sabe.
2. As perguntas seguem o serviço
Cada tipo de serviço traz uma pergunta a mais, e só essa. Para consultoria em IA: «Em que ponto estás com a IA?». Para uma app: «Onde vai funcionar a app?». Para um website: «Já tens textos e imagens?».
O texto de exemplo na caixa da descrição também muda. Quem escolhe uma app lê «O que a app faz, quem a usa e o que já tens feito.»; quem escolhe consultoria em IA lê outra coisa.
A razão: são as perguntas que eu faria de qualquer forma no primeiro email. Feitas aqui, a conversa já começa adiantada.
3. O resumo escreve-se sozinho
Ao lado dos campos há um resumo que cresce a cada resposta. Com um exemplo: «Olá Nelson, sou Ana (Café São João). Preciso de um website à medida e consultoria em IA…» O que ainda falta aparece entre parênteses, mais apagado, até ser preenchido.
Deixas de ver campos soltos e passas a ver o pedido que vais enviar, escrito como o escreverias a alguém.
A razão: quem envia deve saber o que está a enviar.
4. Ajuda onde as pessoas se enganam
No email. Depois do @, o formulário propõe as terminações mais comuns (gmail.com, hotmail.com, outlook.com, sapo.pt, icloud.com), e apanha as trocas de letras habituais: «Querias dizer ana@gmail.com?».
No website. O campo do website atual ganhou a opção «Ainda não tenho website». Quem a marca recebe ideias de domínio feitas a partir do nome da empresa, cada uma com a indicação «parece livre» ou «já registado». A consulta é real, mas não é uma garantia, e o formulário diz isso mesmo: «a confirmar antes de registar».
A razão: um email com uma letra trocada é um pedido a que não consigo responder.
5. Nada se perde, nada falha no fim
O rascunho fica guardado no teu próprio browser até enviares o pedido. Se saíres da página e voltares, está lá, com um aviso e a opção de começar de novo. A aceitação da política de privacidade não se guarda, de propósito: essa decide-se de cada vez.
Ao lado do botão de enviar está escrito o que ainda falta («Falta: um email válido.»), em vez de um erro depois de carregar. Depois de enviar, a confirmação mostra o resumo e o que acontece a seguir, e o email de resposta automática repete o que foi pedido.
Medido sem cookies, e ainda sem resultados
O formulário conta quantas pessoas chegam a cada passo. São totais diários anónimos: sem cookies e sem nada sobre quem visita. Servem para ver onde é que o formulário pode continuar a melhorar.
Resultados ainda não há. O formulário foi para o ar hoje, e por isso este artigo não tem percentagens nem taxas de conversão.
Uma tarde
Tudo isto foi pedido, construído, testado e publicado numa tarde, nos dois estilos do site (Classic e Modern) e nas duas línguas. Há uns anos, um formulário assim era um projeto: desenhar, programar à mão, testar, corrigir, e cada etapa com a sua espera.
É o que quero dizer quando escrevo na página inicial: «Um website deixou de ser estático. É um organismo vivo, que muda ao ritmo das tuas ideias.» O que perguntar, a quem e por que ordem continuou a ser decisão minha. A execução é que deixou de ser a parte demorada.
A forma mais rápida de ver a diferença é usá-lo: fala comigo.
