Design & Experiência do Usuário

Conceber a UX do checkout: princípios para reduzir o abandono do carrinho

O checkout é a etapa do funil de comércio eletrónico em que a intenção de compra é mais elevada, mas os problemas técnicos e de UX se traduzem diretamente em perda de receita.

O que contém este artigo?

O checkout é a etapa do funil de comércio eletrónico em que a intenção de compra é mais elevada, mas os problemas técnicos e de UX se traduzem diretamente em perda de receita.

Um bom checkout recolhe a informação necessária com o mínimo de incerteza, mostra o estado da transação e permite retomar o processo após um erro.

Reduzir os campos obrigatórios

Questione a necessidade de cada campo. Separe os dados de marketing dos realmente necessários para concluir a encomenda.

Avaliar a compra sem conta

Se uma conta trouxer valor ao cliente, a sua criação pode ser sugerida após o pagamento. Exigir registo antes da compra pode criar uma barreira.

Facilitar a entrada de endereços

O preenchimento automático, o tipo de teclado adequado e rótulos claros dos campos podem melhorar a experiência móvel.

Explicar Opções de Entrega

Mostre claramente os custos e a data de entrega e opções como a recolha em loja, pois podem alterar a decisão de compra.

Formulário de pagamento

Tipos de entrada adequados e formatação automática nos campos do número do cartão, validade e código de segurança podem reduzir erros.

Preservar os dados introduzidos após um erro

Obrigar a preencher todo o formulário de novo após um único erro de validação é um problema grave de UX.

Resumo da encomenda

Permita verificar claramente produtos, quantidades, morada de entrega e montante total antes do pagamento.

Checkout em dispositivos móveis

Teste em dispositivos reais o botão de pagamento fixo, o comportamento do teclado, a posição de deslocamento e o preenchimento automático.

Fundamentar decisões de UX em dados

Neste trabalho de UX, os campos obrigatórios, a compra sem conta e a introdução da morada não devem ser tratados apenas como preferências de design. Identifique o problema do utilizador a que responde cada decisão crítica de interface e a métrica comportamental que a validará. Mudar a cor de um botão, por si só, não é uma melhoria de UX; reconhecer uma tarefa mais facilmente, concluí-la mais depressa ou cometer menos erros são resultados mensuráveis.

Combine dados quantitativos com investigação qualitativa. A análise do funil ou de eventos pode mostrar em que etapa os utilizadores abandonam o processo; as entrevistas e os testes de usabilidade ajudam a perceber porquê. Medir as mesmas métricas após uma alteração transforma uma suposição numa decisão de produto verificável. Cada item do backlog de UX deve, por isso, reunir o problema, a hipótese, o utilizador-alvo, a métrica de sucesso e os critérios de aceitação, e não apenas o nome de um ecrã ou componente.

Lista de verificação de implementação e medição

  • A tarefa crítica do utilizador está definida?
  • Existem dados de referência sobre o comportamento atual?
  • Os cenários em dispositivos móveis e computadores foram testados separadamente?
  • Os estados de erro e os ecrãs sem dados foram concebidos?
  • Foram realizados controlos de acessibilidade?
  • Foi definida uma métrica de sucesso para avaliar a alteração?
  • O feedback dos utilizadores foi associado ao backlog do produto?

O desempenho e o comportamento técnico nos percursos críticos fazem parte da UX. Respostas lentas da API, estados de carregamento pouco claros após o envio de um formulário, perda de dados ou um teclado móvel que oculta um campo prejudicam a experiência real, mesmo que não apareçam no ficheiro de design. As equipas de frontend, backend, análise de dados e design devem avaliar o mesmo cenário de ponta a ponta.

Ciclo de investigação, hipótese e iteração

Uma alteração de UX deve começar com uma hipótese tão clara quanto possível. Em vez de «o utilizador não gosta deste ecrã», formule um problema testável, por exemplo: «as incertezas sobre os campos obrigatórios reduzem a taxa de conclusão de tarefas». Dados analíticos, entrevistas, pedidos de apoio, testes de usabilidade ou problemas operacionais observados podem fundamentar a hipótese. Assim, a equipa procura demonstrar o problema antes de assumir uma solução.

Defina depois o comportamento pretendido para a compra sem conta e a introdução da morada. Conforme o contexto, utilize a taxa de conclusão de tarefas, o tempo, a taxa de erro, a progressão no funil, o abandono de formulários ou o número de correções dos utilizadores. Após publicar o novo design, compare as mesmas métricas com os valores de referência anteriores. Se os resultados não evoluírem como esperado, reavalie a hipótese em vez de defender a decisão de design.

Para uma otimização de UX sustentável, os resultados da investigação não devem ficar em apresentações pontuais. Reunir o problema, as evidências, a solução proposta, o segmento de utilizadores, a métrica de sucesso e o resultado no mesmo item do backlog permite perceber que decisões funcionam ao longo do tempo. Assim, a UX deixa de ser apenas uma revisão estética e torna-se um ciclo mensurável de desenvolvimento de produto.

A abordagem UX/UI da B10 Digital Agency

A B10 Digital Agency trata a experiência do utilizador como uma disciplina de desenvolvimento de produto que combina investigação, percursos de utilização, análise de dados, prototipagem, viabilidade técnica e medição, e não apenas como estética de interface.

Perguntas frequentes

O checkout numa só página é sempre melhor?

Não. Conforme a complexidade, um checkout bem concebido em várias etapas pode ser mais claro.

Deve eliminar-se a criação obrigatória de conta?

Deve ser testado de acordo com o modelo de negócio e o comportamento do utilizador.

Onde a mensagem de erro deve ser exibida?

Mostre a mensagem perto do campo com erro e explique como corrigi-lo.

Como se mede a otimização do checkout?

Acompanhe em conjunto o início do checkout, a passagem entre etapas, o sucesso do pagamento e as taxas de abandono.

Artigos relacionados

Tornar a experiência do utilizador mensurável

Conheça o serviço UX/UI da B10 Digital Agency para melhorar os percursos de utilização em produtos web, móveis e empresariais através de investigação, prototipagem e dados comportamentais.

Conhecer o serviço de design e experiência do utilizador →

Fontes e documentos relacionados

Estes documentos servem de referência para os métodos e regras abordados neste artigo.

B10 Digital Agency

Conceber a UX do checkout: princípios para reduzir o abandono do carrinho