Checkout Voos em Etapas
Um jeito mais fácil de pagar sua passagem! Com o passar dos tempos notamos a necessidade de evoluir o jeito de comprar na 123milhas. Vou te contar como estruturei uma nova proposta de checkout em etapas logo abaixo!
Client:
123milhas
Role:
UX/UI Designer
Year:
2023
Contexto inicial
A venda de passagens aéreas é o produto principal da 123milhas. Com o aumento significativo do número de vendas, foi observado que o usuário precisava de mais praticidade no momento da compra, além de opções adicionais de outros produtos ofertados pela empresa.
Principal hipótese
"Validar com nossos clientes uma nova experiência no momento da compra das passagens, concedendo mais liberdade de escolha e facilidade na hora de pagar."
Processo
Segui um processo não linear devido a ter assumido o projeto no meio do caminho após a saída de outro product designer. Isso me exigiu refazer as pesquisas enquanto avançava no projeto por conta da urgência da entrega. No diagrama abaixo mostro como dividi o processo de :
Discovery
Kick-off e Contextualização
O projeto começou com uma reunião de kick-off com o PM para entender os principais desafios do checkout da 123milhas. Os principais problemas identificados foram:
Dificuldade no preenchimento dos dados – usuários encontravam barreiras para inserir informações corretamente.
Falta de opções de pagamento – restrições que impactavam a conversão.
Falta de clareza no processo – usuários não compreendiam quais eram os próximos passos da compra.
Esses pontos geravam uma jornada frustrante e ineficiente, impactando diretamente a experiência do usuário e a taxa de conversão.
Benchmark
Antes de estruturar a solução, analisei como os principais concorrentes organizavam seus fluxos de checkout. Essa análise ajudou a entender boas práticas, diferenciais e oportunidades para otimizar a experiência na 123milhas.
User Flow
O user flow foi o primeiro passo para mapear toda a experiência dentro da plataforma – desde a busca pelo voo até a finalização da compra. Ele ajudou a visualizar os caminhos possíveis, identificar pontos críticos e prever dificuldades que os usuários poderiam enfrentar ao longo do processo.
Task Flow
Com o user flow mapeado, o task flow trouxe uma visão mais estruturada do checkout, organizando cada etapa em três momentos principais:
Dados & Personalização – inclusão de informações dos passageiros, escolha de bagagens e necessidades especiais.
Otimização de Receita – oferta de serviços adicionais, como seguro viagem.
Finalização – seleção da forma de pagamento, conferência dos dados e confirmação da compra.
Essa estrutura permitiu visualizar claramente o que poderia ser otimizado para tornar a experiência mais fluida e eficiente.
Design
Prototipação
Com o direciomento definido do user e task flows, fui desenhar o fluxo em alta fidelidade. A protótipagem foi facilitada por conta do Aurora, design system desenvolvido pela 123milhas. A seguir mostro como ficou todas as telas, nos formatos web e mobile dos cinco passos do processo de compra.
Dados dos Passageiros
Seguro de viagem
Formas de pagamento
Conferência de dados
Confirmação de compra
Testes de usabilidade
Depois do desenho, aprovei com o stakeholders o fluxo e eles aprovaram para fazer o teste de usabilidade. Defini 8 tarefas para 8 usuários (4 mobile e 4 desktop), para testar os protótipos. Segui um roteiro definido e fiz os convites de usuários compradores já cadastrados pela nossa equipe de CRM.
As principais resultados do teste de usabilidade foram:
Os modais de preenchimento de passageiros ao estarem fechados geravam confusão;
Muitos usuários tiveram dúvidas de como funcionava o reembolso garantido;
A maioria dos usuários acharam o fluxo de compra intuitivo e destacaram a facilidade de mudar os dados preenchidos a hora que quiser;
Handoff
Documentei observações sobre o comportamento dos componentes para garantir que a equipe de desenvolvimento compreenda as interações e fluxos esperados.
Impactos e resultados
Aumento na Taxa de Conversão: A simplificação do preenchimento de dados e a oferta de múltiplas opções de pagamento tornaram o processo de compra mais acessível e menos frustrante para os usuários. Essa melhoria na experiência provavelmente resultou em um aumento na taxa de conversão, com mais visitantes concluindo a compra de passagens.
Redução de Abandono de Carrinho: A clareza nas etapas do processo de checkout e a inclusão de ofertas adicionais de forma organizada ajudaram a manter os usuários engajados até a finalização da compra. Isso contribuiu para a diminuição do abandono de carrinho, já que os clientes se sentiam mais confiantes e informados durante todo o processo.
Melhoria na Satisfação do Cliente: A implementação de um fluxo de compra mais intuitivo e personalizado, aliado a testes de usabilidade que identificaram e corrigiram pontos de confusão, elevou a satisfação geral dos clientes. Usuários satisfeitos tendem a retornar e recomendar o serviço, fortalecendo a reputação da empresa no mercado.
Esses impactos demonstram como a reestruturação do fluxo de checkout não apenas otimizou a experiência do usuário, mas também trouxe benefícios tangíveis para o negócio, como aumento nas vendas e fidelização de clientes.