Estudo de caso: Aplicando processos de UX em E-commerce de moda
Neste artigo apresento os processo de UX aplicados para otimizar a experiência de compra dos consumidores do e-commerce Zinzane (https://www.zinzane.com.br/). O desafio foi oriundo de um processo seletivo o qual teve o prazo de 3 dias.
1.Descoberta: O desafio
A rede de roupas e moda Zinzane atua no mercado brasileiro há 18 anos, possuindo 126 lojas em 21 estados. A marca preza por um preço justo em seus produtos, também atuando de forma inclusiva ao atender todas as idades e tamanhos. Buscando também desenvolver ações sociais e apoio ao esporte.
O desafio proposto foi desenvolver um redesign da Homepage do e-commerce colocando em prática processos de UX para otimizar a experiência de compra dos clientes, com o objetivo de aumentar o ticket médio da rede Zinzane.
Atualmente o e-commerce Zinzane é estruturado pela plataforma VTex.
Launch date: 2020, Never Launched
Project type: E-commerce Redesign
My role: User Research, User flow, Prototype
Abordando o processo: Double Diamond (Design Thinking)
1.1 Desk Research
Durante uma pesquisa de campo foram coletados dados de mercado que irão atuar como base das hipóteses que serão levantadas e validadas ao longo do projeto.
- O mobile commerce em Moda e Acessórios cresceu 51% em 2020 (E-Commerce Brasil, 2020);
- 135 mil plataformas de e-commerce abrem durante pandemia; (Estadão, 2020)
- E-commerce no Brasil cresce 51% durante pandemia; (E-Commerce Brasil, 2020)
- Setores de e-commerce em crescimento em comparação ao início da pandemia:
- Eletrônicos: +136,72%
-Moda: +95,27%
-Casa & Móveis: +85,39%
-Cosméticos: +40,80%(79%).
1.2 Levantando hipóteses: Matriz CSD
A Matriz CSD foi utilizada para criar hipóteses que possam agregam valor à experiência do usuário durante a compra no e-commerce Zinzane.
Uma vez que a Matriz CSD foi criada com base nos dados obtidos na pesquisa de campo, foram levantadas hipóteses que evidenciam as maiores dores dos usuários para serem validadas durante a próxima etapa, a pesquisa com os usuários.
2. Definição: Pesquisa com usuários
Após levantar hipóteses durante a matriz CSD, é hora de validar quais agregam mais valor para os usuários, é hora de ir “pra rua” e levantar as hipóteses e insumos para o produto, e além de coletar dados é hora de interpretá-los e gerar análises comportamentais.
Foram entrevistados 9 usuários que não conheciam o e-commerce para mapear e analisar a jornada do usuário durante a compra de um produto no e-commerce Zinzane, iniciando a jornada na Homepage até a página "Meu carrinho."
Foi utilizado um formulário para coletar os dados, acesse aqui.
2.1 Perguntas durante entrevista
Para validar as hipóteses levantadas na etapa de Research, foi elaborado uma sequência de perguntas após solicitar um pequeno teste de usabilidade, o qual consistia em 3 passos:
1.Visitar o site: https://www.zinzane.com.br;
2.Simular a compra de um produto de seu gosto pessoal;
3.Entrar na sessão “Meu carrinho.”
Após esses 3 passos, foram realizadas as perguntas para validar as hipóteses levantadas na Matriz CSD, onde cada pergunta valida uma hipótese em específico:
1. Qual sua opinião sobre o tempo de carregamento das imagens e informações do produto?
2. Como foi sua experiência com os pop-ups (caixas de mensagem que aparecem durante a compra)
3. Você encontrou o benefício de frete grátis acima de R$280,00 reais?
4. Na página inicial, qual é a importância da sessão “Produtos mais vendidos”
5. Qual é o termo que você mais se interessa quando o assunto são as peças em promoção?
6. Por qual plataforma você acessou o site?
Por fim, uma questão em aberto para coletar novos insights e sugestões de melhoria dos usuários.
7.Você tem mais algum comentário ou sugestão de melhoria durante sua experiência de compra na loja Zinzane? Fique à vontade! :)
2.2 Dados e análise da pesquisa com usuários
Análise 1: 66,7% dos usuários relataram que o tempo de carregamento das imagens e informações dos produtos poderiam ser mais rápidos, um relato interessante durante as entrevistas foi:
"O ícone de carregamento (loader) me fez imaginar que fosse demorar ainda mais, por isso não tive uma boa primeira impressão"
Análise 2: 55,6% dos entrevistados se sentiram prejudicados pelo pop-up que aparece com grande frequência durante a jornada do usuário, 33,3% não se sentiram ajudados pelo recurso.
Análise 3: 33,3% dos usuário não encontraram a informação referente ao benefício de frete grátis e 44,4% só encontraram na tela "Meu carrinho"
Eventualmente se esta informação fosse em formato de progress bar fixado abaixo do header, os usuário teriam maior facilidade para visualizar o benefício e acompanhar a quantia restante para alcançar o benefício.
Análise 4: Na homepage do e-commerce não há uma amostra dos produtos mais vendidos, desta forma, 55,6% sentem falta desta informação e apenas 11,1% diz não ter importância e opta por investir tempo pesquisando dentro do e-commerce.
Análise 5: A sessão de produtos em promoção no e-commerce atualmente possui a nomenclatura "Últimas oportunidades" porém ao realizar a pesquisa, 55,6% dos usuários optam pelo termo "Promoção" e 44,4% acreditam que o termo "Outlet" chama mais sua atenção durante a aquisição de um produto.
Análise 6: 85,7% dos usuário fizeram uso da versão mobile da plataforma, o que indica que o e-commerce deve ser Mobile First.
2.3 Definição: Levantamento de personas
Com base nos dados coletados na etapa de Research, foram identificadas as personas que deram fit com a proposta de valor da plataforma.
O desafio durante a construção da persona foi descobrir e entender as reais necessidades do usuário, sua história (cotidiano), seus objetivos e suas maiores dificuldades.
2.4 Storytelling do contexto do usuário
Juliana Martins é uma universitária da UNIFRAN, cursando Publicidade e Propaganda curso qual ingressou em 2017, Juliana é natural de Ribeirão Preto — SP e por morar longe de casa, opta por uma vida econômica e prática. A jovem acabou amadurecendo financeiramente muito rápido, dado que é responsável por suas despesas e gastos mensais, Juliana é estagiária em uma agência de publicidade de Franca-SP.
Como todo jovem, ela é bastante vaidosa e gosta de se vestir bem, porém com o fechamento do comércio Juliana está se adaptando a fazer compras através de e-commerces. Como a jovem é prática sempre costumou frequentar fisicamente lojas de sua cidade para comprar roupas e acessórios, porém nos dias atuais ela procura plataformas online seguras, de fácil uso, boas formas de pagamento e com grandes benefícios.
Durante a pandemia, a jovem tem consumido muito conteúdo de redes sociais para fazer compras online, hoje a jovem busca plataformas práticas e seguras para suas compras.
3. Ideação: Levantamento de Hipóteses
Após validar as hipóteses geradas durante a matriz CSD durante a etapa de Definição foram validadas quais hipóteses atendiam as maiores dores dos usuários, foram destacadas hipóteses que podem ser transformadas em melhorias para o e-commerce:
Hipótese 1. Na versão mobile os pop-ups causam poluição visual durante o fluxo do usuário
Hipótese 2. Tempo de carregamento do conteúdo da página é demorado e não é priorizado sobre infos mais relevantes para compra
Hipótese 3. Usuários encontram muitos campos na tela de checkout, o que pode afetar na conversão de vendas
Hipótese 4. Cart bar com benefícios não é destacado para os usuários
Hipótese 5. Falta de sessão “Produtos mais vendidos na Home”
Hipótese 6. Termos mais populares para substituir “últimas oportunidades” pode converter mais vendas
3.1 Sitemap: fluxo dos usuários
Antes de adaptar as novas funcionalidades validadas durante a etapa anterior, foi realizado um Sitemap da versão antiga do e-commerce justamente para identificar e compreender toda a jornada do usuário.
Foram identificados os possíveis redirecionamentos para outras subpáginas do e-commerce, como é indicado abaixo:
4. Protótipo de média fidelidade
Nesta etapa é hora de " colocar no papel" todas as propostas de melhorias coletadas, seguindo o conceito de Mobile First, o objetivo é tornar a experiência de compra cada vez mais acessível aos usuários, pensando nisso, a teoria da "Zona polegar" de Steven Hoober que apresenta o mapeamento das zonas de mais fácil acesso pelos usuários de aplicativos mobile, sejam eles destros, canhotos ou ambidestros, como é apresentado na figura abaixo:
4. Protótipo: Wireframe
O protótipo de baixa fidelidade foi desenvolvido com a ferramenta Figma, com o intuito de estruturar a disposição das informações do e-commerce.
Clique aqui para visualizar o wireframe.
4.1 Protótipo: Alta fidelidade
Durante o desenvolvimento do protótipo de alta fidelidade, foram aplicadas as features levantadas pelas hipóteses validadas com os entrevistados, entre as principais novas funcionalidades e melhorias estão:
- Destaque para o campo de busca;
- Cart bar referente ao valor da compra atuando como barra de progresso, incentivando o usuário aumentar o valor de sua compra;
- Benefícios do consumidor em posição estratégica;
- Possibilidade de visualizar mais produtos por bloco;
- Os pop-ups foram removidos para diminuir a poluição visual dos usuários;
- Tela de checkout (Meu carrinho) possui menos campos, facilitando a inserção de dados do usuário.
Para mais detalhes do protótipo de alta fidelidade, clique aqui.
Aprendizados e próximos passos
Testes de usabilidade
- Realizar testes de usabilidade para validar todas as features e fazer futuras melhorias;
- Realizar testes A/B para melhorar da plataforma;
- Usar mapas de calor para analisar os padrões de comportamento do usuário;
- Utilizar como métricas: tempo de navegação, taxa de conversão, taxa de entrada e taxa de saída dos usuários.
Considerações finais
Este desafio foi essencial para compreender a importância da experiência de compras dos usuário em relação ao desempenho de um e-commerce durante uma alta demanda de mercado. O principal aprendizado que tiro deste projeto é quão fundamental é a etapa de Discover/Research para um produto que agregue as reais necessidades do usuário, sem estas etapas o produto não valor.
