Aplicativo White Label

Este aplicativo é uma solução abrangente para gerenciar vários tipos de cartões, desde benefícios do empregador, como assistência médica, alimentação e entretenimento, até cartões de crédito e débito padrão. O principal objetivo do aplicativo é fornecer uma interface simples e amigável para os usuários gerenciarem seus cartões com eficiência.

Aplicativo White Label

Cliente:

Mob4pay

Tecnologias:

react-native
react-native
expo
expo
redux
redux
styled-components
styled-components

Ano:

2022

Sobre o Projeto

Hoje em dia, inúmeras soluções utilizam cartões para diversos fins, como benefícios oferecidos pelos empregadores, como saúde, alimentação e entretenimento, além do uso comum de cartões de crédito e débito. Independentemente do uso pretendido do cartão, este aplicativo tem como objetivo fornecer uma forma simples e amigável de gerenciá-lo. Ele permite que você acompanhe o saldo, seus dados pessoais e quaisquer outras funcionalidades associadas ao seu cartão. Além disso, este aplicativo é white-label, o que significa que ele pode ser personalizado como o aplicativo da sua própria empresa, com seu logotipo e cores.

Tecnologias e Desenvolvimento

  • React Native
  • Expo
  • Redux
  • Styled Components
  • I18n

Eu desenvolvi a interface de usuário completa desta aplicação, seguindo um design compartilhado no Figma, e integrei-a com a API. A interface do usuário abrange o processo de onboarding, que inclui funcionalidades de login e registro. O processo de registro possui um fluxo específico, com um formulário passo a passo que solicita os últimos quatro números do cartão, validação por código SMS, um questionário de 4 etapas para confirmar que o usuário é o titular do cartão e uma seção para definir a senha. Após o login, as páginas privadas apresentam uma página inicial onde os usuários podem acessar seus principais dados pessoais, saldo da conta e opções de navegação. Além disso, há uma página de faturas onde os usuários podem revisar suas transações categorizadas por mês e ano.

Capturas de Tela



Primeira tela do aplicativo. Opção de login ou solicitação do cartão.
Fig. 1 - Primeira página. Funil para direcionar os usuários para o fluxo de login ou solicitar o cartão.
Página inicial
Fig. 2 - Página inicial para usuários logados.

Telas de integração
Fig. 3 - Página de login com campo de nome de