Design estratégico orientado por dados
Visão geral
Empresa
Grupo Asserth – More Buzz
Prazo
4 meses
Times envolvidos
Comercial, Marketing e Comunicação, Backend e Frontend
Sobre a More Buzz
Especializada em ecossistemas para negócios, oferece por meio do seu aplicativo web uma solução completa para transformar indicações de produtos e serviços em vendas. O objetivo é criar novas oportunidades de divulgação e geração de receita para empresas ao conectar divulgadores, atendimento ao cliente e consumidores em uma mesma plataforma.
Desafio
Aumentar a adoção e o engajamento dos usuários no produto.
Problema inicial
A experiência do usuário (UX) no aplicativo web apresentava problemas de arquitetura de informação e nomenclaturas que representavam um desafio para o aumento de adoção e engajamento dos usuários.
Objetivos principais
1
Reestruturar o web app para garantir uma experiência responsiva.
2
Criar um aplicativo para smartphones (Android e iOS) mantendo a mesma experiência possível da web para manter a consistência do produto.
3
Implementar uma linguagem visual e textual neutra para suportar o modelo white label.
4
Estabelecer padrões para reduzir inconsistências e acelerar o desenvolvimento.
5
Aproximar a experiência do produto ao modelo mental dos usuários e aos objetivos do negócio.
Service Blueprint
Personas
A partir do Service Blueprint, identificamos quatro perfis de usuários principais que utilizam o web app da More Buzz.
Corporativo (B2B)
Dono do ecossistema, acompanha o lucro gerado pelas vendas de seus produtos e serviços que são indicados pelos divulgadores.
Atendente
Apoia no atendimento de clientes que querem comprar produtos e serviços indicados pelos divulgadores.
Divulgador Comum
Indica produtos e serviços, mas não pode cadastrar outros divulgadores. Recebe recompensas em dinheiro apenas por suas próprias indicações.
Divulgador Pro
Indica produtos e serviços e pode cadastrar divulgadores comuns. Recebe recompensas em dinheiro por suas próprias indicações e também pelas indicações feitas por seus divulgadores.
Auditoria de UX
Hierarquia
Ausência de uma estrutura clara que dificulta a navegação e a sequência lógica de ações.
Inconsistência
Falta de padrão que torna a experiência confusa e pouco confiável.
Benchmarking
Realizei uma análise de concorrentes para compreender boas práticas e oportunidades de diferenciação. O estudo revelou três aspectos importantes relacionados à autonomia, notificações e transparência das plataformas concorrentes.
Autonomia
Concorrentes permitem configurar programas de indicação e personalizar mensagens.
Notificações
Sistemas robustos de notificação aumentam engajamento e reduzem churn.
Transparência
Indicações são atualizadas em tempo real, gerando confiança e engajamento.
Protótipo
Teste de Usabilidade
Após o protótipo da nova versão ser validado internamente, conduzi 5 testes remoto e moderado com usuários reais para avaliar a usabilidade.
Concluímos que a nova versão do produto se mostrou sólida, mas ajustes pontuais em nomenclaturas, arquitetura da informação e visibilidade de elementos-chave foram considerados essenciais para tornar a experiência mais intuitiva e alinhada ao modelo mental dos usuários.
Senti dificuldade com os status dos negócios, com o status Novo.
Achei um pouco confuso. Algumas partes não são tão fáceis de entender.
O link de captação de divulgadores poderia estar mais fácil, por exemplo na tela inicial.
Guia de Estilo
Criei um guia de estilo com os elementos visuais primários do produto. O guia estabeleceu uma base visual padronizada para a criação do design de interface, garantindo consistência e escalabilidade desde o início do planejamento de design até o desenvolvimento.
UI Kit
Utilizando os elementos visuais primários do guia de estilo, criei componentes mais complexos e reutilizáveis que aceleraram o desenvolvimento e garantiram consistência visual. Essa etapa também reforçou a escalabilidade do produto, tornando futuras evoluções mais ágeis.
Design de Interface
Com base nos wireframes, no guia de estilo e nos componentes, desenvolvi telas em alta fidelidade, protótipos navegáveis e fluxos completos. Essa entrega consolidou a visão do produto e permitiu simular a experiência final dos usuários.
Resultados
Responsividade
A experiência foi adaptada para mobile sem perder a consistência com o ambiente web.
White label
O produto foi reconstruído com uma linguagem visual e textual neutra para viabilizar o uso por outras marcas.
Consistência escalável
O guia de estilo e os componentes criaram uma base de design que facilita a manutenção e evolução futura.
Usuário no centro
Os testes revelaram necessidades e expectativas, tornando o produto mais alinhado ao modelo mental dos usuários.
Engajamento e adoção
As novas mudanças favoreceram o aumento, engajamento e adoção dos usuários no produto.
![](data:image/svg+xml,<svg display="block" role="presentation" viewBox="0 0 21 21" xmlns="http://www.w3.org/2000/svg"><g d="M 9.98 10.977 L 9.98 1.996 L 0.998 1.996 C 0.447 1.996 0 1.549 0 0.998 C 0 0.447 0.447 0 0.998 0 L 10.977 0 C 11.529 0 11.975 0.447 11.975 0.998 L 11.975 10.977 C 11.975 11.529 11.529 11.975 10.977 11.975 C 10.426 11.975 9.98 11.529 9.98 10.977 Z M 10.284 0.305 C 10.535 0.045 10.906 -0.059 11.255 0.033 C 11.604 0.124 11.876 0.396 11.967 0.745 C 12.059 1.094 11.955 1.465 11.695 1.716 L 1.716 11.695 C 1.465 11.955 1.094 12.059 0.745 11.967 C 0.396 11.876 0.124 11.604 0.033 11.255 C -0.059 10.906 0.045 10.535 0.305 10.284 Z" fill="transparent" height="12px" id="TVZCt2ODY" transform="translate(5 5)" width="12px"><path d="M 9.98 10.977 L 9.98 1.996 L 0.998 1.996 C 0.447 1.996 0 1.549 0 0.998 C 0 0.447 0.447 0 0.998 0 L 10.977 0 C 11.529 0 11.975 0.447 11.975 0.998 L 11.975 10.977 C 11.975 11.529 11.529 11.975 10.977 11.975 C 10.426 11.975 9.98 11.529 9.98 10.977 Z" fill="rgb(255, 255, 255)" height="11.975424446415929px" id="TAkCTIb4j" width="11.975424446416127px"/><path d="M 10.284 0.305 C 10.535 0.045 10.906 -0.059 11.255 0.033 C 11.604 0.124 11.876 0.396 11.967 0.745 C 12.059 1.094 11.955 1.465 11.695 1.716 L 1.716 11.695 C 1.465 11.955 1.094 12.059 0.745 11.967 C 0.396 11.876 0.124 11.604 0.033 11.255 C -0.059 10.906 0.045 10.535 0.305 10.284 Z" fill="rgb(255, 255, 255)" height="12px" id="meAnXRyQ2" width="12px"/></g></svg>)