O Boticário
Case study para melhor a organização e distruição do menu e dos itens do e-commerce da Boticário.
Cases Study
2 de nov. de 2024
Problema
Este estudo de caso tem a proposta de fazer o redesign do menu do site da marca, focando na usabilidade e praticidade, melhorando o fluxo de compra e a navegação. Já que o mesmo tem muitos itens e categorias, o que dificulta a busca do usuário aos produtos.
Contexto do problema
Com a crescente demanda por produtos para cuidados do corpo, tais site como o da Boticário vem implementando cada vez mais seções, abas, menus, submenus, categorias e subcategorias em seus sites e aplicativos. Isso se torna um problema quando temos o mesmo produto para diferentes categorias, fazendo assim que a busca por algo simples se torne uma tarefa complexa e que requer uma certa curva de aprendizagem para explorar tantas opções nos menus oferecidos ao usuário.
Porém uma simplificação geral não é possível, visto que geraria mais confusão do que esclarecimento, pois existem produtos para funções específicas que não podem ser categorizados de forma geral.
Proposta de solução
Reorganizar, renomear, excluir e adicionar algumas categorias do menu, do submenu e dos itens dentro dos submenus para tentar garantir uma experiência mais simples para achar e obter qualquer tipo de produto.
Entendendo o problema
Fluxo de compra
Para melhor entender a dor dos usuários, simulei um fluxo de compra para observar quais seriam as dificuldades que poderiam ser encontradas durante esse processo e quais pontos positivos poderiam ser destacados.
Abaixo está o fluxo para o compra de um lápis para olhos na cor marrom.
Caso deseja ver o fluxo de compra com uma qualidade maior, basta clicar aqui.
Vamos aos testes
Após analisarmos o fluxo de compra do site, buscamos pessoas que tem o costume de comprar produtos do mesmo ramo da Boticário para realizar alguns testes, sendo eles, Card Sorting e Tree Testing.
O Card Sorting para entender melhor como aquela pessoa organizaria o menu da melhor forma de acordo com a percepção dela. O Tree Testing para determinar se os caminhos atuais para se encontrar um produto, estavam muito longos ou confusos.
Foram realizados um total de 6 testes de cada tipo, sendo 2 gravados em vídeo chamada e 4 não gravados. Esses testes foram cruciais para determinar a nova organização dos menus, submenus e categorias.
Análise dos resultados
De acordo com os resultados, alguns itens faziam sentido e decidi por manter, em contrapartida, optei por excluir ou renomear outros para que o entendimento fosse mais unificado e simples.
Sitegrama
Com todos os resultados reunidos, foi feito um sitegrama para determinar o novo fluxo do site e do fluxo de compra. Para ver o sitegrama completo, basta clicar aqui.
Wireframes
Com o fluxo e o sitegrama pronto, começei a montar o wireframe para dar vida às minhas ideias, a fim de testar se tais conclusões fariam sentido. Por estar testando o organização do menu e o seu fluxo, os wireframes foram feitos em alta fidelidade pois não mudei o visual do site.
OBS: Este case foi realizado como um projeto durante a minha pós graduação em UX Design e Usabilidade no Instituto Infnet, junto com outros 5 alunos da pós graduação.
More to Discover
O Boticário
Case study para melhor a organização e distruição do menu e dos itens do e-commerce da Boticário.
Cases Study
2 de nov. de 2024
Problema
Este estudo de caso tem a proposta de fazer o redesign do menu do site da marca, focando na usabilidade e praticidade, melhorando o fluxo de compra e a navegação. Já que o mesmo tem muitos itens e categorias, o que dificulta a busca do usuário aos produtos.
Contexto do problema
Com a crescente demanda por produtos para cuidados do corpo, tais site como o da Boticário vem implementando cada vez mais seções, abas, menus, submenus, categorias e subcategorias em seus sites e aplicativos. Isso se torna um problema quando temos o mesmo produto para diferentes categorias, fazendo assim que a busca por algo simples se torne uma tarefa complexa e que requer uma certa curva de aprendizagem para explorar tantas opções nos menus oferecidos ao usuário.
Porém uma simplificação geral não é possível, visto que geraria mais confusão do que esclarecimento, pois existem produtos para funções específicas que não podem ser categorizados de forma geral.
Proposta de solução
Reorganizar, renomear, excluir e adicionar algumas categorias do menu, do submenu e dos itens dentro dos submenus para tentar garantir uma experiência mais simples para achar e obter qualquer tipo de produto.
Entendendo o problema
Fluxo de compra
Para melhor entender a dor dos usuários, simulei um fluxo de compra para observar quais seriam as dificuldades que poderiam ser encontradas durante esse processo e quais pontos positivos poderiam ser destacados.
Abaixo está o fluxo para o compra de um lápis para olhos na cor marrom.
Caso deseja ver o fluxo de compra com uma qualidade maior, basta clicar aqui.
Vamos aos testes
Após analisarmos o fluxo de compra do site, buscamos pessoas que tem o costume de comprar produtos do mesmo ramo da Boticário para realizar alguns testes, sendo eles, Card Sorting e Tree Testing.
O Card Sorting para entender melhor como aquela pessoa organizaria o menu da melhor forma de acordo com a percepção dela. O Tree Testing para determinar se os caminhos atuais para se encontrar um produto, estavam muito longos ou confusos.
Foram realizados um total de 6 testes de cada tipo, sendo 2 gravados em vídeo chamada e 4 não gravados. Esses testes foram cruciais para determinar a nova organização dos menus, submenus e categorias.
Análise dos resultados
De acordo com os resultados, alguns itens faziam sentido e decidi por manter, em contrapartida, optei por excluir ou renomear outros para que o entendimento fosse mais unificado e simples.
Sitegrama
Com todos os resultados reunidos, foi feito um sitegrama para determinar o novo fluxo do site e do fluxo de compra. Para ver o sitegrama completo, basta clicar aqui.
Wireframes
Com o fluxo e o sitegrama pronto, começei a montar o wireframe para dar vida às minhas ideias, a fim de testar se tais conclusões fariam sentido. Por estar testando o organização do menu e o seu fluxo, os wireframes foram feitos em alta fidelidade pois não mudei o visual do site.
OBS: Este case foi realizado como um projeto durante a minha pós graduação em UX Design e Usabilidade no Instituto Infnet, junto com outros 5 alunos da pós graduação.
More to Discover
O Boticário
Case study para melhor a organização e distruição do menu e dos itens do e-commerce da Boticário.
Cases Study
2 de nov. de 2024
Problema
Este estudo de caso tem a proposta de fazer o redesign do menu do site da marca, focando na usabilidade e praticidade, melhorando o fluxo de compra e a navegação. Já que o mesmo tem muitos itens e categorias, o que dificulta a busca do usuário aos produtos.
Contexto do problema
Com a crescente demanda por produtos para cuidados do corpo, tais site como o da Boticário vem implementando cada vez mais seções, abas, menus, submenus, categorias e subcategorias em seus sites e aplicativos. Isso se torna um problema quando temos o mesmo produto para diferentes categorias, fazendo assim que a busca por algo simples se torne uma tarefa complexa e que requer uma certa curva de aprendizagem para explorar tantas opções nos menus oferecidos ao usuário.
Porém uma simplificação geral não é possível, visto que geraria mais confusão do que esclarecimento, pois existem produtos para funções específicas que não podem ser categorizados de forma geral.
Proposta de solução
Reorganizar, renomear, excluir e adicionar algumas categorias do menu, do submenu e dos itens dentro dos submenus para tentar garantir uma experiência mais simples para achar e obter qualquer tipo de produto.
Entendendo o problema
Fluxo de compra
Para melhor entender a dor dos usuários, simulei um fluxo de compra para observar quais seriam as dificuldades que poderiam ser encontradas durante esse processo e quais pontos positivos poderiam ser destacados.
Abaixo está o fluxo para o compra de um lápis para olhos na cor marrom.
Caso deseja ver o fluxo de compra com uma qualidade maior, basta clicar aqui.
Vamos aos testes
Após analisarmos o fluxo de compra do site, buscamos pessoas que tem o costume de comprar produtos do mesmo ramo da Boticário para realizar alguns testes, sendo eles, Card Sorting e Tree Testing.
O Card Sorting para entender melhor como aquela pessoa organizaria o menu da melhor forma de acordo com a percepção dela. O Tree Testing para determinar se os caminhos atuais para se encontrar um produto, estavam muito longos ou confusos.
Foram realizados um total de 6 testes de cada tipo, sendo 2 gravados em vídeo chamada e 4 não gravados. Esses testes foram cruciais para determinar a nova organização dos menus, submenus e categorias.
Análise dos resultados
De acordo com os resultados, alguns itens faziam sentido e decidi por manter, em contrapartida, optei por excluir ou renomear outros para que o entendimento fosse mais unificado e simples.
Sitegrama
Com todos os resultados reunidos, foi feito um sitegrama para determinar o novo fluxo do site e do fluxo de compra. Para ver o sitegrama completo, basta clicar aqui.
Wireframes
Com o fluxo e o sitegrama pronto, começei a montar o wireframe para dar vida às minhas ideias, a fim de testar se tais conclusões fariam sentido. Por estar testando o organização do menu e o seu fluxo, os wireframes foram feitos em alta fidelidade pois não mudei o visual do site.
OBS: Este case foi realizado como um projeto durante a minha pós graduação em UX Design e Usabilidade no Instituto Infnet, junto com outros 5 alunos da pós graduação.