O ecrã do código: o campo, a contagem decrescente, as tentativas que restam e mensagens claras

A resposta curta: o ecrã do código é onde a verificação corre bem ou se perde o cliente. Precisa de quatro coisas: um campo fácil de preencher no telemóvel, o número para onde o código foi (tapado), uma contagem decrescente honesta e mensagens que digam exactamente o que aconteceu. A API dá-lhe os dados para tudo isto em cada resposta.

O campo do código

1	Um só campo, numérico. Com inputmode="numeric" o telemóvel abre o teclado de algarismos, e com autocomplete="one-time-code" muitos telemóveis sugerem o código que acabou de chegar por SMS.

2	Do tamanho certo. Se pediu length 6, o campo aceita 6 algarismos. Se preferir seis caixas separadas, deixe colar o código inteiro de uma vez.

3	Deixe colar e não se preocupe com espaços. Na conferência os espaços não contam: «482 913» e «482913» são o mesmo código.

4	Pode conferir sozinho quando o último algarismo entra, desde que o cliente veja o que está a acontecer.

O que mostrar à volta do campo

Elemento	De onde vem	Exemplo
Para onde foi o código	O campo to, já tapado	«Enviámos um código por SMS para o número terminado em 567.»
Corrigir o número	O seu formulário	«Não é o seu número? Corrija-o.»
Tempo que falta	expires_at menos a hora actual	«O código vale mais 4:12.»
Tentativas que restam	attempts_left	«Código errado. Restam 2 tentativas.»
Pedir outro código	A espera entre reenvios que definiu	«Pode pedir outro daqui a 45 segundos.»

Uma mensagem para cada situação

Situação	O que a API diz	O que o cliente lê
Certo	valid: true	«Número confirmado.» e segue em frente
Errado, ainda há tentativas	valid: false, pending	«Código errado. Restam 2 tentativas.»
Expirado	valid: false, expired	«O código expirou. Peça um novo.»
Sem tentativas	valid: false, failed	«Esgotou as tentativas. Peça um código novo.»
Código antigo	valid: false, cancelled	«Use o código do SMS mais recente.»
Demasiados pedidos	429	«Pediu demasiados códigos. Tente daqui a pouco.»

Não esconda o botão de reenviar para sempre, nem o mostre logo. Um cliente que não vê saída abandona; um que carrega em «Reenviar» cinco vezes recebe cinco SMS e só o último vale. Mostre-o com contagem e diga sempre «use o código do SMS mais recente».

Lembre o cliente de que não responde ao SMS. Os remetentes com nome não recebem respostas, e há quem tente. Uma linha no ecrã, «Escreva aqui o código que recebeu por SMS», resolve. Os estados todos estão em estados de um código de verificação.

Quer montar um ecrã de verificação claro com a nossa API? Veja o SMS de Verificação.

Ver o SMS de Verificação

VEJA TAMBÉM

Estados de um código de verificação: pending, verified, expired, failed e cancelled

Reenviar, cancelar e substituir um código de verificação: o que acontece ao anterior

Confirmar o número de telemóvel no registo com um código por SMS, passo a passo

Ler as respostas da API de verificação: valid false, 409, 422 e 429

O código de verificação por SMS não chegou: o que conferir, do seu lado e do lado do cliente

Escrever o SMS de verificação: o lugar do código, o seu Sender ID e caber numa só parte

PRODUTO RECOMENDADO

Alojamento de sites com cPanel

Domínio e SSL incluídos, cópias diárias e o painel que já conhece. desde 5,94 €/mês (plano de 3 anos, com cupão)

Ver planos

Categorias

Categorias