Bizuu UI Redesign
UI
Exercício de UI
2024
Esse projeto foi desenvolvido como forma de estudo, buscando praticar alguns fundamentos de UI e também algumas ferramentas do Figma.
Limitações
Como eu não tenho acesso a qual biblioteca de ícones é utilizada no aplicativo, optei por usar a biblioteca de ícones do Material Design
Também não consegui identificar qual a fonte utilizada no app, sendo assim optei por utilizar uma Google Font que fosse similar. A fonte escolhida foi a Inter
Enquanto realizava esse exercício, notei que as cores das redes sociais mudaram. Por isso há uma diferença entre a cor presente no print atual e a cor da proposta.
Atual
Proposta
Atual
1
Ação prioritária longe da “thumb zone”
Nem sempre o usuário vai optar por escolher alguma sugestão da home, sendo assim é provável que ele vá preferir buscar diretamente pelo item desejado.
2
Scroll “quase” infinito
Atualmente no app cada categoria na página inicial tem diversos itens num scroll vertical, o que dificulta a descoberta de outros itens.
1
2
1
2
Proposta
1
2
3
1
2
3
1
Carrossel
Sendo um scroll horizontal, a visualização de outras categorias e descoberta de novos itens fica facilitada
Oportunidade
2
Lojas em destaque
Sendo uma boa oportunidade para o APP, decidi implementar lojas destacadas, mostrando alguns itens da loja num carrossel em destaque
3
Inseri a ação de pesquisa na navbar
1
2
1
2
3
1
Ação prioritária longe da “thumb zone”
Nem sempre o usuário vai optar por escolher alguma sugestão da home, sendo assim é provável que ele vá preferir buscar diretamente pelo item desejado.
2
Scroll “quase” infinito
Atualmente no app cada categoria na página inicial tem diversos itens num scroll vertical, o que dificulta a descoberta de outros itens.
1
Carrossel
Sendo um scroll horizontal, a visualização de outras categorias e descoberta de novos itens fica facilitada
Oportunidade
2
Lojas em destaque
Sendo uma boa oportunidade para o APP, decidi implementar lojas destacadas, mostrando alguns itens da loja num carrossel em destaque
3
Inseri a ação de pesquisa na navbar
Atual
1
Problemas de legibilidade
Algumas fontes estão muito pequenas, o que dificulta a legibilidade
2
Item difícil de clicar
Enquanto usava o aplicativo, tive dificuldades de clicar nesse botãozinho
1
2
1
2
Proposta
1
2
3
1
2
3
Desejável
1
Favoritar promoções
Como possível usuário do app, acredito que seria interessante a opção de favoritar uma promoção
2
Ver o produto
Também acredito que seria interessante ter alguma opção de ver o item em alta qualidade, supondo que eu não conheça conheça o estabelecimento
3
Card clicável
Resolvendo o problema da dificuldade de clicar nos detalhes da loja, transformei o item em um card. Acredito que isso solucionaria o problema, facilitando quem deseja ver em detalhes outros itens daquele estabelecimento
Atual
1
Ação prioritária distante
O botão de comprar mais está numa região não muito confortável de se usar, além de ser muito pequeno e difícil de clicar
2
Difícil legibilidade
O tamanho da fonte dificulta a leitura
3
Possível ação indesejada
O botão de voltar ao início está muito próximo da ação principal
1
2
3
1
2
3
Proposta
2
1
2
1
1
Evitando erros
Buscando evitar cliques acidentais, coloquei o botão de limpar carrinho bem afastado da ação principal de comprar o item
2
Hierarquia de informação
Trazendo uma sequência lógica nos dados mostrados, optei por incluir o botão de adicionar mais itens próximo a lista de itens selecionados
Atual
Proposta
1
1
1
Mesclando telas
Optei por unir a página de categorias com a página de pesquisa, assim trazendo uma sequência lógica e já esperada pelo usuário.
Atual
Proposta
1
2
1
2
3
1
Problemas de legibilidade
Algumas fontes estão muito pequenas, o que dificulta a legibilidade
2
Item difícil de clicar
Enquanto usava o aplicativo, tive dificuldades de clicar nesse botãozinho
Desejável
1
Favoritar promoções
Como possível usuário do app, acredito que seria interessante a opção de favoritar uma promoção
2
Ver o produto
Também acredito que seria interessante ter alguma opção de ver o item em alta qualidade, supondo que eu não conheça conheça o estabelecimento
3
Card clicável
Resolvendo o problema da dificuldade de clicar nos detalhes da loja, transformei o item em um card. Acredito que isso solucionaria o problema, facilitando quem deseja ver em detalhes outros itens daquele estabelecimento
Atual
Proposta
1
2
3
2
1
1
Ação prioritária distante
O botão de comprar mais está numa região não muito confortável de se usar, além de ser muito pequeno e difícil de clicar
2
Difícil legibilidade
O tamanho da fonte dificulta a leitura
3
Possível ação indesejada
O botão de voltar ao início está muito próximo da ação principal
1
Evitando erros
Buscando evitar cliques acidentais, coloquei o botão de limpar carrinho bem afastado da ação principal de comprar o item
2
Hierarquia de informação
Trazendo uma sequência lógica nos dados mostrados, optei por incluir o botão de adicionar mais itens próximo a lista de itens selecionados
Atual
Proposta
1
1
Mesclando telas
Optei por unir a página de categorias com a página de pesquisa, assim trazendo uma sequência lógica e já esperada pelo usuário.