Evolução de Carteira para Banco
Em 2022, a Pagstar iniciou o processo de se transformar em um banco digital, o que exigia conformidade com as regulamentações do Banco Central.
O objetivo foi criar um manual de experiência do usuário para submissão ao Banco Central, com uma interface confiável e alinhada às normas regulatórias, garantindo que o produto fosse atrativo e funcional para o público certo.
Meu Papel
UX/UI Designer
Minhas Responsabilidades no Projeto
Trabalhei com mais dois designers, assumindo responsabilidades como: entender as regulamentações, identificar as mudanças necessárias para adequar o app às exigências do Banco Central e colaborar na prototipagem de novas telas e fluxos. Também fui responsável pela diagramação do documento oficial a ser submetido ao Banco Central.
Redesign
Wireframes
Design de fluxos
Pesquisa
Documentação
Desafios
Transformar o app da Pagstar em um banco digital envolveu vários desafios, incluindo a adaptação às regulamentações do Banco Central. Entre os principais:
Limitações Técnicas
A necessidade de adaptar o design para facilitar a implementação, com o uso de componentes reutilizáveis e evitando complexidades que pudessem dificultar a execução pelos desenvolvedores.
Curto Prazo
O projeto foi desenvolvido em tempo limitado, sem a possibilidade de realizar testes externos com usuários e validar hipóteses antes da submissão.
Redesign Completo
Reformulamos a interface da carteira digital, reposicionando a marca de forma mais séria e confiável, além de melhorar a usabilidade e acessibilidade.
Impactos e Resultados
O design alinhou o desenvolvimento com as exigências do Banco Central, garantindo a aprovação do processo de transformação do app em banco. Simplificamos fluxos essenciais como a tela inicial e extratos, criamos uma área para serviços como o PIX além de criar a base para o reposicionamento da marca. As mudanças no design seguiram para o desenvolvimento, mas não foram finalizadas, pois a empresa foi adquirida por outra que já possuía o sistema pronto.
Fluxo Resumido
Processos
Pesquisa e Discovery
Para entender as mudanças necessárias, conduzi workshops para analisar a documentação do Banco Central e projetos aprovados. Também realizamos uma análise comparativa com apps bancários, a fim de identificar ajustes necessários. A comunicação e colaboração interna entre a equipe de design foi fundamental para elaboramos as soluções propostas com qualidade.
Interface e Identidade Visual
Analisamos os perfis de usuários desejáveis e os atuais, o que orientou as alterações na identidade visual. As mudanças incluíram a atualização das cores, o tom de voz da marca, ilustrações e imagens, com o objetivo de reposicionar a marca de forma mais séria, madura e confiável. Para isso, escurecemos os tons e simplificamos as ilustrações utilizadas nas comunicações internas do app.
Amostra Gráfica da Marca - Anterior
Amostra Gráfica da Marca - Proposto
Acessibilidade
Realizamos testes de acessibilidade nas cores utilizadas nos feedbacks do app e percebemos que elas apresentavam baixo contraste, o que poderia confundir usuários com daltonismo, por exemplo.
As cores precisavam de mais contraste entre si para facilitar a identificação rápida dos feedbacks de erro ou sucesso. Além disso, era necessário garantir uma melhor acessibilidade geral para que funcionassem bem com a fonte branca sobre o fundo colorido (padrão do app).
Comparação de Cores do Estudo de Acessibilidade
A paleta de cores foi ajustada para uma solução mais acessível, mantendo a estética agradável, usando a ferramenta davidmathlogic.com como referência.
Fluxo resumido
Prototipagem e Fluxos
Em conjunto, desenvolvi protótipos de alta fidelidade, focados na facilidade de implementação e reutilização de componentes. Também criei novos fluxos de usuário, que serviriam como guia para apresentações, refinamentos e para o entendimento geral das mudanças pelo time técnico e stakeholders.
Documentação
Após a apresentação e aprovação dos fluxos pela PO e CTO, colaborei com a equipe de design e o consultor responsável para consolidar um manual de experiência do usuário. O documento seguiu um padrão estipulado pelo BACEN e detalhou os fluxos principais, demonstrando como o sistema cumpria as normas regulatórias. O documento foi então submetido ao Banco Central e aprovado.
Amostra da Documentação
Aprendizados
Este projeto reforçou a importância do alinhamento constante entre as equipes e demonstrou que o design vai além da criação de interfaces. A colaboração e as iterações com o time de design foram essenciais para alcançarmos, juntos, a aprovação pelo Banco Central e garantirmos que as necessidades dos stakeholders e as bases de usabilidade fossem atendidas.
O que poderia ter sido diferente
A produção de uma documentação mais técninca e voltada para desenvolvedores frontend oderia ter reduzindo dúvidas técnicas durante o processo de implementação e agilizado o processo.
Próximos passos
Validar as novas funcionalidades com entrevistas com usuários e testes de usabilidade, refinando fluxos, confirmando hipóteses e identificando oportunidades de melhoria centradas na experiência do usuário.