Banco Randon

Uma empresa virando banco

Entre 2021 e 2022, a Randon decidiu ter um banco digital próprio. A Opah era responsável pelo produto, pela tecnologia e pela interface. O projeto tinha três frentes que precisavam conversar entre si: o aplicativo do cliente, a versão web do internet banking e o back-office web.

Um banco completo, não uma demonstração

Os funcionários receberiam o salário pelo banco e fariam ali as transações do dia a dia. Cadastro, conta, transferências e pagamentos precisavam funcionar como em qualquer banco digital.

Três etapas, uma prioridade por vez

Um banco digital tem muitas funcionalidades. Para não resolver tudo de uma vez, dividimos o projeto em três etapas e definimos, em cada uma, o que era prioridade de entrega. As funções essenciais para o funcionário usar o banco vinham primeiro.

Material Design 2 sobre uma base white label

Usamos o Material Design 2 como base de componentes, com padrões de interação já conhecidos pelos usuários. Todo o layout foi construído sobre um design system white label que a empresa usava com diversos clientes: a marca do Banco Randon era aplicada por cima de uma estrutura comum.

Do cadastro às transações

O fluxo foi desenhado como o de um aplicativo bancário completo. Cada etapa da jornada foi pensada em sequência, para que o funcionário conseguisse abrir a conta e usar o banco sem depender de ajuda.

Um banco que já nasce com Pix

O Pix estava começando a ser adotado no Brasil. Implantamos a jornada completa de Pix no produto, para que o banco já nascesse com o meio de pagamento que os usuários passariam a esperar.

O mesmo banco, na tela do computador

A versão web do internet banking foi desenhada em paralelo ao aplicativo, com as mesmas funções para o funcionário: saldo, extrato, transferências, pagamentos e Pix. A linguagem visual é a mesma do app, adaptada para uma tela maior, com navegação em menu lateral.

A operação por trás do banco

O back-office é um sistema web usado pelo pessoal do banco. Cada ação do funcionário no aplicativo tem um lado operacional aqui: a conta aberta no app chega à mesa de decisão para análise, as perguntas de segurança do primeiro acesso são cadastradas no quiz, e os limites de Pix e de transferências são definidos nas configurações.

Por lidar com muitos dados, o back-office usa o mesmo design system em telas de tabela, com busca, filtros e status coloridos. Ações como desativar um usuário, reprovar uma proposta ou estornar uma disputa pedem confirmação antes de serem executadas.

Revisões com a Randon dentro do Figma

As telas passaram por rodadas de revisão com a equipe da Randon. Os pontos levantados ficavam registrados no próprio arquivo, junto das telas, com a data da revisão, como em março de 2022 nos fluxos de chaves Pix e limites. Cada ajuste feito pela Opah era marcado como corrigido ao lado do comentário, o que deixava claro para os dois lados o que ainda estava pendente.

Um sistema bancário completo

O resultado foi um sistema complexo: 520 telas no Figma, sendo 279 do aplicativo e 241 da web e do back-office, distribuídas em três releases. Os funcionários da Randon ganharam um banco da própria empresa para receber o salário e fazer transações, incluindo Pix.

O banco foi ao ar. Saí da Opah antes de haver dados de uso consolidados, por isso este case não traz métricas de adoção.

O que levo desse projeto

Cliente

Randon

Empresa

Opah

Ano

2021–2022

Tipo de projeto

Produto digital: internet banking com aplicativo, versão web e back-office web

Serviços

Fluxos de navegação, UI design, aplicação de design system white label, jornada de Pix

Papel no projeto

UX/UI Designer, em parceria com outro designer do time interno

Status

Projeto real