Desafio

Reformular o  App Camicado realizando  re-design abrangente de todas as telas do aplicativo através de um novo Style Guide. Aprimorando significativamente a acessibilidade e a hierarquia de informações. Além de tornar o design mais coeso e esteticamente agradável, melhorar a usabilidade como um todo, simplificar fluxos, criar novas funcionalidades e aumentar o volume de vendas. Sempre mantendo um equilíbrio entre a visão de negócios, as necessidades reais dos usuários e as limitações tecnológicas.

Processo adotado

O processo proposto fundamentou-se no modelo Feedback Loop, onde as modificações eram implementadas nas telas e nos fluxos de maneira gradual. A abordagem consistia em compreender quais dessas alterações resultavam em maior engajamento, aumento nas vendas, entre outros indicadores, realizando ajustes adicionais conforme necessário. 

O intuito era sempre construir a partir de informações obtidas de indicadores, necessidades do usuário e do negócio, e a partir do produto lançado, mensurar oque foi lançado, gerar dados consolidados, aprender com oque foi construído e repetir o circulo implementando novas melhorias. 

Construção

Utilizei  3 telas iniciais como ponto de partida para a implementação de uma nova proposta visual. Essas telas foram selecionadas por sua importância e prioridade em acordo com os stakeholders.  A abordagem levou em consideração múltiplos aspectos, incluindo a identidade visual fornecida pelo departamento de marketing, benchmarking baseados em outros aplicativos de referência, boas práticas de acessibilidade e, com discernimento, as tendências de design que estavam ganhando destaque.

Re-design de telas​

O desafio primordial consistia em aprimorar esteticamente a interface, melhor a usabilidade e tornar as telas mais simples no intuito reduzir a carga cognitiva, tudo isso sem impor a necessidade de re-aprendizado aos usuários atuais do aplicativo.

Aplicações em fluxo

Além do re-design (visual), aproveitei para melhorar a experiência como um todo, sempre alinhado com os objetivos de negócio da empresa, e com restante do time, abordamos cada fluxo de maneira individualizada.

Caso: Fluxo de Cadastro

Ao examinarmos os dados relacionados ao fluxo de cadastro, refletimos sobre como reduzir a taxa de abandono. Uma das hipóteses levantadas foi a seguinte: “A quantidade de telas pode levar o usuário a acreditar que o cadastro é excessivamente longo”. Optamos por reduzir o número de telas e introduzindo uma indicação clara sobre conclusão do cadastro no botão de ação. Essa modificação resultou em uma significativa redução na taxa de abandono.

Caso: Fluxo de check-out 

No processo de check-out, decidimos manter o número de telas inalterado, uma vez que consideramos a quantidade e a distribuição satisfatórios. Concentramos então, na otimização da hierarquia das informações, na organização eficiente dos componentes nas telas e no uso criterioso e adequado das cores, sempre com o objetivo de potencializar a taxa de conversão.

Exemplos de teste A/B

Com o objetivo de otimizar a taxa de conversão, foram realizados diversos testes A/B ao longo do tempo. O primeiro desses testes foi conduzido pouco antes da minha integração à equipe de UX/UI.

Conduzimos este teste para determinar a cor mais eficaz para nossos botões primários.

Realizamos um teste no intuito de avaliar se a posição do desconto impactava na taxa de conversão.

Style Guide & Componentes

Aqui apresento alguns dos estilos e componentes criados para o layout das telas do aplicativo.

Este site utiliza cookies para melhorar sua experiência. Ao avançar, concorda com sua utilização.