Plataforma de cashback — experiência mobile

Designer de UI para a Experiência Mobile dedicada da MinaCash, plataforma de recompensas financeiras e cashback. Designer único responsável pela página exclusiva Mobile com 46 nós (nó 87:22642 no arquivo Figma wpp9WlwEfw21dmgfwaaAOp), adaptando uma aplicação web existente em Bubble e desktop para uma interface otimizada para smartphones. Desenvolvi os fluxos de onboarding com busca automática de CEP (buscarCEP), gestão de conta e segurança com modal de troca de senha e a sequência de resgate de cashback via Pix instantâneo com estados de confirmação nos viewports de iPhone SE e iPhone 13 mini.

Atuação na agência Sagitta concluída em 27 de maio de 2024. O cliente havia inicialmente construído e lançado um MVP no Bubble antes de contratar a Sagitta para profissionalizar e expandir a plataforma. Viviane Batista (Vivi) desenhou as telas web anteriores de CRM desktop e gestão de licenciados (90 filhos na página Desktop, em período anterior à entrada de Juan). Juan foi alocado especificamente para liderar a experiência mobile do produto.

Adaptação mobile versus simples compressão responsiva

📱46

nós na página exclusiva de Mobile

📐2

tamanhos de tela desafiadores atendidos (iPhone SE e 13 mini)

🔄3

fluxos principais (Onboarding, Segurança da Conta e Saque Pix)

🎯100%

adaptação mobile dedicada, não esmagamento de layout desktop

Um erro frequente no design de software é tratar o mobile como uma simples versão estreitada do desktop — comprimindo tabelas extensas, menus hambúrguer improvisados e modais gigantescos em telas pequenas. A MinaCash possuía um CRM desktop complexo, com extratos financeiros densos e gestão de licenciados desenhados por Viviane Batista. Quando os usuários finais demandaram consultar saldos e resgatar recompensas pelo celular, comprimir o desktop era inviável. Minha missão foi criar uma experiência mobile autônoma, calibrada para a interação natural com uma mão.

Arquitetura de telas nos 46 nós da prancheta Mobile

Na página exclusiva de Mobile (nó 87:22642), projetei 46 telas e estados de interação, priorizando a resolução de 375pt da série iPhone SE (telas 19 a 47) e iPhone 13 mini (telas 1 e 2):

• Onboarding Fluido e Preenchimento Automático de CEP — Simplifiquei o fluxo de cadastro em etapas verticais únicas (Telas iniciais, Cadastro), integrando consulta de CEP (buscarCEP e button_cep) para preencher bairro, cidade e estado automaticamente, reduzindo o atrito de digitação no teclado do celular.
• Gestão de Conta e Segurança — Desenvolvi o painel Minha Conta e um modal dedicado para alteração de senha (Pop-up Alterar Senha), permitindo atualização rápida de credenciais sem perda do contexto de navegação.
• Motor de Resgate de Cashback via Pix — Estruturei o fluxo completo de saque, no qual o usuário informa sua chave Pix, visualiza a simulação imediata do repasse e confirma a operação em modal seguro (Pop-up Pix e Pop-up Confirmação Pix), eliminando dúvidas antes da transferência.
• Áreas de Toque Ergonômicas — Transformei registros em tabelas em cards verticais com tags de status destacadas, ações primárias posicionadas na zona do polegar e modais ancorados na base da tela.

A disciplina de projetar sob a restrição do iPhone SE

Desenhar para telas largas de iPhone Pro Max de 430px permite acomodar elementos com facilidade. Projetar para o espaço compacto de 375x667px do iPhone SE exige rigor técnico: cada pixel de altura é crucial quando o teclado virtual ocupa metade da tela. Ao balizar a experiência da MinaCash por esse formato mais enxuto, assegurei que caixas de confirmação, campos de texto e botões de ação permanecessem sempre visíveis e confortáveis para o usuário.

O que este projeto é e o que não é

• Não é a totalidade do produto MinaCash. Não desenhei o sistema desktop, o painel de licenciados ou o CRM de parceiros; essas telas foram criadas por Viviane Batista antes da minha atuação.
• Não é o build original em Bubble. O cliente já havia criado e colocado no ar a versão inicial antes de contratar a agência.
• Não é simples design responsivo. Trata-se de uma adaptação dedicada concebida diretamente para uso em smartphones em uma prancheta exclusiva.
• Não é discovery ou pesquisa com usuários. Os requisitos foram estruturados por Ramon.
• Não possui métricas financeiras. Nenhum dado sobre volume de cashback ou quantidade de usuários ativos consta nos registros.

O impacto de um design mobile especializado

A MinaCash demonstra como softwares concebidos originalmente para computador podem ser convertidos com sucesso para a palma da mão sem perda de usabilidade. Ao reorganizar fluxos de cadastro, segurança e transferências Pix em uma interface ergonômica, o projeto entregou um canal mobile direto, rápido e confiável para a utilização de cashback.

Evidência

A experiência do aplicativo mobile foi implementada e lançada em produção no endereço minacash.com.br, operando com o design mobile desenhado por Juan. Não existem métricas de volume financeiro ou de cashback. Este estudo de caso documenta a adaptação mobile de plataformas SaaS, design ergonômico para telas compactas e UX para transações instantâneas.