Hackathon Live Commerce — Amanda Siqueira
Case study · UX / Product · 2023

Hackathon Live Commerce

Repensando a jornada de compra dentro de uma transmissão ao vivo na Live-co, plataforma de live commerce e live shopping — reduzindo fricção e evitando a perda de vendas no momento da decisão.

Função
Product Designer
Formato
Dupla com PM
Duração
~9 horas
Resultado
Solução vencedora
Capa do case Hackathon Live Commerce
O contexto

No final de 2023, participei de um Hackathon de Produto com o desafio de desenvolver soluções para a Live-co. A dinâmica reuniu duplas de Product Designers e Product Managers que trabalharam juntas por cerca de nove horas para resolver um problema real do produto.

Foi uma experiência intensa e profundamente enriquecedora em termos de aprendizado e colaboração. Sair vitoriosa apenas concretizou o desafio como um grande marco na minha jornada como designer.

O problema

Uma jornada de compra fragmentada.

Durante uma live na plataforma, os produtos aparecem na tela e o usuário seleciona os itens de interesse — mas, para concluir a compra, acaba sendo redirecionado a um site externo. Esse desvio quebra a continuidade da experiência justamente no momento mais sensível: a decisão de compra.

O objetivo

Manter o usuário dentro da experiência.

Três metas guiaram cada decisão de design ao longo do hackathon.

Reduzir a fricção

Diminuir os passos e os desvios entre ver o produto e concluir a compra.

Evitar perdas de vendas

Reter o usuário no fluxo e impedir abandonos causados pela quebra de contexto.

Garantir a satisfação

Entregar uma experiência fluida e agradável do começo ao fim da jornada.

A investigação

Rápida, mas precisa.

Com o tempo curto do hackathon, focamos em entender as raízes do problema — provavelmente ligadas à arquitetura e às limitações tecnológicas da plataforma. Análises e conversas com especialistas técnicos revelaram quatro pontos de atenção.

01

A plataforma não possui uma solução integrada para processar transações diretamente.

02

Foi desenvolvida inicialmente em tecnologia low-code, o que pode ter limitado o processo de compras.

03

Uma integração nativa para concluir a compra seria complexa e exigiria recursos técnicos relevantes.

04

Problemas de UI/UX afetam a experiência já na fase inicial da decisão de compra.

Soluções propostas

Três frentes para unir live e compra.

Solução 01

Catálogo na pré-compra

Otimizamos o cenário de pré-compra, que por si só já tinha muitos passos. O catálogo de produtos passa a ficar inteiramente disponível na tela principal da live, permitindo acessar qualquer item para compra em um único toque.

Configurar o produto, adicioná-lo ao carrinho e prosseguir foram unificados em uma só janela — encurtando radicalmente a jornada.

Catálogo na telaCompra em 1 toqueJanela unificada
Solucao Catalogo na Pre Compra
Solução 02

Picture-in-picture

Para o cenário de multitarefa — acompanhar a live enquanto finaliza a compra — trouxemos o picture-in-picture. O vídeo continua visível na tela, sem alternar entre abas ou janelas.

O usuário pode minimizar e maximizar o vídeo, movê-lo pela tela e deixá-lo com ou sem som — tudo isso sem atrapalhar a finalização da compra.

Vídeo sempre visívelMover & redimensionarSom opcional
Solucao Picture in Picture
Solução 03

Checkout via Webview

Adotamos o webview para trazer agilidade e impedir a fragmentação do caminho do usuário. O checkout passa a ser exibido integrado à interface da aplicação, mantendo a pessoa no mesmo contexto — sem novas janelas ou abas.

A abordagem permite incorporar o conteúdo web de forma suave dentro do app, aproveitando a funcionalidade existente sem precisar reimplementá-la nativamente.

Mesmo contextoSem novas abasReaproveita o web
Solucao Checkout via Webview
O resultado

Ao unir catálogo, picture-in-picture e webview, devolvemos ao usuário uma jornada contínua — da live ao pagamento, sem nunca sair da experiência.

Lugar no hackathon
1
Toque até a compra
~9h
Da descoberta à entrega