Ideia no ar, plataforma de Marketplace end-to-end — UX/UI Design Case
O “Ideia no Ar” é uma plataforma construtora de marketplaces de Nicho que busca integrar de forma facilitada empreendedores a terem seu próprio Mercado Livre ou Magazine Luiza.
Sobre o Projeto
A Empresa Ideia no Ar é uma empresa que desenvolve soluções digitais para negócios e startups. Há 3 anos, eles criaram uma plataforma que permite a criação e gestão de marketplaces com o objetivo de ser simples e eficiente.
O objetivo da plataforma é ajudar empreendedores a criar e gerenciar seus próprios marketplaces, com recursos como cadastro de vendedores, gestão de estoque, processamento de pagamentos, entre outros. O Ideia no Ar queria criar uma experiência de usuário intuitiva e fácil de usar, para que os usuários pudessem criar e gerenciar seus próprios marketplaces sem dificuldades.
Para alcançar esse objetivo, fui contratado para dar inicio a equipe de UX/UI Design da empresa, então por todo o projeto fui o unico desginer da empresa, pensei nas soluções e construí tudo praticamente do zero e os objetivos eram melhorar a plataforma chamada V1 e construir uma completamente nova que desde a sua concepção fosse centrada no usuário e em suas necessidades, e com grande foco em grandes empresas.
Esse Case é exclusivamente sobre a criação da nova plataforma chamada V2, caso queira ver todas as melhorias que implementamos na V1 clique aqui.
Design Process
Compreender — Descoberta — Definição — Idealização — Protótipo — Iteração
Compreender
Na fase de compreender o foco foi entender tudo sobre a plataforma atual, e coletar informações para que pudéssemos fazer uma entrevista com a melhor qualidade possível.
Após ser contratado foquei em entender como uma plataforma de Marketplace funciona, e quais suas diferenças para um e-commerce comum.
Entrevistas Internas
Passei então pelo menos 2 semanas conversando com todo o time da empresa, o Project Manager sempre esteve ao meu lado me apoiando para que nenhuma ponta ficasse solta e foi muito importante como uma ponte para que a conversa técnica com os Devs fosse plenamente entendida.
Os Devs me passaram todas limitações que a plataforma V1, que era plataforma que estava em funcionamento e que seria usada como base de estudo e importantíssima para que a V2 chegasse da forma mais completa possível em seu MVP.
O time de vendas me passaram contatos importantes de Gerentes de Marketplaces da V1 e de alguns de seus melhores vendedores.
E o time que mais me trouxe clareza do projeto foi o time de suporte, eles estavam por dentro de todos os pedidos de melhorias da V1, que futuramente seriam desenvolvidos, mas aqui poderíamos já ter uma boa noção das expectativas do que a V2 teria que ja ter como base para ser bem aceita em seu MVP.
O time de Marketing junto com o CEO e o CTO, me passaram importantes informações sobre o publico alvo da V1 e como seria o publico alvo da V2.
Publico já estabelecido da V1
- Empresários de pequeno à médio porte, que querem se estabelecer na internet como autoridades em segmentos especializados de vendas online.
- Pessoas que querem vender na internet sem ter que fazer grandes estoques, e apenas gerenciar vendedores e compradores.
Publico Alvo da V2
- Empresas de Grande porte, com alta demanda de produtos, vendedores e claro vendas.
- Empresas que ja tem um E-Commerce, mas que querem escalar ele para voos ainda mais altos.
Objetivo principal da V2
- Ser a plataforma de Marketplace usada por uma das top 5 empresas do varejo na internet nos próximos 5 anos.
Descoberta
Na fase de descoberta foquei descobrir e mapear as dores de cada tipo de usuários enfrentaria por meio de entrevistas.
Expectativas
O segundo grande passo do projeto foi realizando pesquisas com os gerentes dos Marketplace, alguns vendedores e clientes em potencial desses marketplaces.
Utilizamos de entrevistas qualitativas conversando diretamente com Gerentes e Vendedores da plataforma V1 que foram ao menos 10 de cada linha. E pesquisa quantitativa em formato de formulário respondido por ao menos 80 pessoas que foram coletadas por e-mail para clientes de Marketplace da V1 e por meio de grupos de compras e vendas em redes sociais como o Facebook.
Isso foi feito para entendermos as necessidades e expectativas de cada tipo de usuários em relação a uma plataforma de criação de marketplaces. E a partir desses dados conseguimos identificar as principais dores e expectativas de cada tipo de usuário:
Gerentes de Marketplace
- A analise de dados é extremamente importante para que o gerente consiga acompanhar e conseguir recompensar seus melhores vendedores aumentando a taxa de retenção desse vendedor na plataforma..
- Melhora no design, os gerentes prezam muito pelo visual da loja e do Dashboard, pois esse é o cartão de visita de sua empresa.
- Gerenciamento individual e mais completo dos vendedores, é extremamente requisitado ja que poder ver os itens, dados e poder fazer a triagem de cada vendedor faz com que a plataforma seja mais acertiva em suas vendas.
- Buy box em página de produtos para que o comprador seja beneficiado pelo melhor preço e assim volte para o Marketplace.
Vendedores:
- Cadastro e edição de produtos facilitado que seja simples de entender.
- Integração e cadastro da loja devem ser simples e não ser cansativo.
- Poder analisar dados de vendas com mais assertividade.
Compradores:
- Barra de pesquisa deve ser prioritária e extremamente fácil de se encontrar, pois 85% dos que responderam a pesquisa dizem que ao entrar em um site já sabem o que quer comprar. Esperando assim fazer a compra rapidamente.
- Já na home a quantidade e variedade de produtos é muito importante quando a pessoa ainda não sabe o que quer comprar ainda, então mostrar os principais itens do catalogo e todas as categorias logo de cara se mostrou muito importante.
- Comprar sem precisar fazer cadastro, foi uma das solicitações mais diferentes e requisitadas, mas que ganhou muita importância por conta da facilidade e como case de sucesso da Amazon, resolvemos implementar também como opção para os gerentes que assim quiserem.
- Pagina de produto mais completa, e com mais informações possíveis.
- Formas de encontrar o melhor valor como buybox na página de produtos.
- Filtros, em lista de produtos para que o produto exato seja encontrado com mais facilidade ainda.
Definição
Nessa fase do projeto, iremos definir nossas personas que utilizaremos até o final do projeto, e o mapa de empatia de cada um deles para saber o mais importante, em quais problemas vamos nos focar para facilitar a vida dos potenciais usuários.
Personas
Com base nos parâmetros estabelecidos a partir das pesquisas, construímos 3 personas para cada tipo de usuário (gerentes, vendedores, e compradores), assim criaremos um arquétipo que possa ser utilizada para conseguirmos nos colocar nos sapatos do usuário sempre que uma nova funcionalidade seja pensada para que assim desde o inicio tudo seja centrado no usuário.
Mapa de empatia
O mapa de empatia me ajudou a sentir mais profundamente o que os potenciais usuários teriam de interesse e me ajudou a entrar nos sapatos deles para conseguirmos enxergar melhor os interesses de cada um.
Gerente/Admin de Marketplace:
Vendedor:
Comprador:
Obs: Para ver as personas e mapa de empatia com mais detalhes clique aqui para abrir o projeto no Figjam.
Idealização
Durante a idealização usei 3 métodos para tentar encontrar as melhores soluções para os problemas dos nossos usuários e são eles:
Benchmark: O que a concorrência e sites eu tem o mesmo formato fazem que podemos aderir no nosso projeto?
Definição de MVP: Quais serão os pontos chaves que serão atendidos desde o lançamento da plataforma.
Arquitetura de Informação: Entender como será o fluxo nas telas de cada um dos 3 setores do Projeto (Gerente de Marketplace/admin, Vendedor e comprador).
Benchmark
Olhar e aprender o que ja deu certo em outras plataformas foi um dos pontos mais importantes de todo o projeto, afinal muitas features que planejamos utilizar em nosso projeto ja foram testados e validados em outros sites e sistemas.
Um exemplo disso foi nosso cadastro de produto, onde utilizamos algumas funções do Mercado Livre, como o formato de relatório, o cadastro simplificado e o mais importante a Buy Box que acelera o processo de cadastro utilizando produtos que já estão cadastrados e aprovados, fazendo o usuário ter que alterar menos itens e dar menos cliques para finalizar.
MVP
Junto com o Product Manager e o CTO, criamos o MVP da plataforma com base em nas pesquisas e entrevistas com nossos clientes diretos (Gerentes de Marketplace).
Alguns dos principais itens que foram selecionados:
Gerentes:
- Cadastro de produtos completo, mas simples de se fazer.
- Moderar vendedores com listas de Aprovados, reprovados e lista de espera, com feedback de retorno para vendedores
- Analise de dados de vendas gerais do marketplace, e individuais por vendedor.
- Configurações de modelos de negocio altamente personalizável para cada tipo de empresa.
Vendedor:
- Conseguir ver um preview da plataforma antes mesmo de ter adicionado todos os dados cadastrais.
- Cadastro gameficado.
- Conseguir ver a loja de jeito simples
- Cadastro de produtos completo, mas simples de se fazer.
- Cadastro de produto sem estar ainda aprovado, para adiantar processo.
- Saque de dinheiro pela plataforma de forma rápida.
- Mais de uma conta para retirar dinheiro.
- Taxa de comissão transparente.
- Calendário para Liberação de valores.
Comprador:
- Permitir compra sem cadastro.
- Login/cadastro via redes sociais Google, Facebook ou e-mail.
- Site visualmente bonito.
- Pagina de produtos robusto e que aceite imagens e videos.
- Finalização de Compra no estilo Wizard.
Obs: esse passo teve diversos pontos de iteração onde refizemos nossos passos para não deixar nenhum ponto chave passar.
Arquitetura de Informação
Nessa documentamos todos os caminhos na plataforma por tipo de usuário.
Gerente:
Vendedor:
Design
Wireframes
Começamos o protótipo com wireframes em (poucas, mas valiosas) telas chave, criando e definindo os pontos cruciais de cada fluxo, o Figma foi importantíssimo para isso, com seus ótimos comandos e podendo compartilhar minhas telas para mostrar a outras pessoas do projeto como o CTO e o PM.
Nesta fase passei a maior parte do tempo decidindo tamanho de botões, como e onde seriam os campos, e como faze-los dar uma experiência melhor ao usuário, ocupando menos espaço, aqui defini também quais features e como aplica-las com mais detalhes futuramente no projeto.
Aqui não decidi paleta, fontes, nem foram feitos testes de uso nessa fase.
UI Design
No protótipo final de alta fidelidade, utilizei muito do azul que a cor principal do ideia no ar.
Eu tentei usar botões e ícones que não fossem apenas bonitos, mas que fizessem os usuários sempre o reconhecerem. Tive muitas inspirações em outros de diversos projetos e marketplaces ja estabelecidos como Mercado Livre, Magazine Luiza e ShareTribe e fui adaptando ao meu estilo.
Plataforma de Criação: Figma.
Testes com usuários
Qualitativo
Após o projeto estar em estado de apresentação, começamos a montar um roteiro de testes, e analisando quais recursos iriamos entregar para os nossos usuários e em qual etapa cada recurso seria apresentado.
Chamamos 10 Gerentes, 10 vendedores e 10 compradores em potencial para realizarem os testes de cada um dos setores que cada um era destinado a utilizar na plataforma, cada teste durou cerca de 1 hora e meia cada. 60 minutos de teste, passando por todos os fluxos primordiais, como cadastro na plataforma, onboarding, métricas, cadastro de produto, configuração avançada da plataforma entre outro, e 30 minutos foram reservados de entrevista para coletar os feedbacks.
Iteração
Com esses testes tivemos mais uma rodada de iteração no projeto, adicionamos por exemplo mais algumas métricas que não tinham sido pensadas, mas com os testes, adicionamos ao projeto.
Métricas de Sucesso
Os testes foram muito bem recebidos principalmente por vendedores e Gerentes de Marketplace que já estavam na antiga versão da plataforma, pois a V2 foi dita como mais robusta, bonita e fácil de se usar e localizar.
Tivemos uma melhora da satisfação em cadastro de produto com 80% respondendo que era bom de se utilizar, entre as respostas 3 respostas possíveis que era Ruim de se utilizar, Regular e Bom de se utilizar.
90% compradores disseram que o visual novo é bonito e 80% disseram que ele passa alta confiança enquanto os outros 10% disseram média confiança.
Protótipo de Navegação
Aqui você pode utilizar o protótipo que foi utilizado para se fazer os testes com usuários para definição de fluxos.
Os protótipos são robustos e bem grandes de serem explorados, a aba de configurações é a mais extensa e tem muito o que se olhar, lá vocês podem experiênciar muito do projeto.
Você é como eu e gosta de testar as coisas? Que tal navegar no protótipo utilizando os links abaixo?
Link para navegar no protótipo de Gerente do Marketplace:
Link para navegar no protótipo de Vendedor:
Link para navegar no protótipo de Comprador:
Conclusão
O que aprendi com esse projeto?
Tudo. Afinal esse de longe foi projeto mais longo, com mais iterações, com mais pesquisa, com mais contato com Devs, que tive na minha carreira, é muito diferente você fazer um projeto com 2 pessoas (Freelance), um Designer e um programador, a fazer em uma empresa com um time inteiro dependendo um do outro, foi desafiador, foi dificil, mas valeu cada segundo do meu tempo e do meu esforço.
Aprendi a trabalhar melhor em equipe, em ser proativo com soluções em tela, aprendi que o benchmark e pesquisa com usuários é a base de um projeto de sucesso.
Hoje posso dizer que apesar de ter trabalhado sozinho como designer em projeto tão grande eu evolui muito em todo esse tempo, e agredeço cada momento que tive fazendo essa plataforma ser o que é hoje.
Muito obrigado por me acompanhar até aqui!
Caso queira entrar em contato comigo meus contatos são esses:
E-mail: bruno.hfds99@gmail.com
Numero com Whats App: (11) 97488–4543