Node payA Rede Social de Pagamentos Instantâneos para a Nova Geração

Duração Novembro 2022 – Maio 2023
Papel UX/UI Designer
Ferramentas Figma, FigJam, Design Tokens, Mobile Prototypes
Serviços UX Strategy, App Mobile, Social Banking
Node pay Banner Principal - Rede Social de Pagamentos Instantâneos e P2P para Jovens
Contexto

Visão Geral do Projeto

Como UX/UI Designer no projeto Node pay, liderei a concepção e arquitetura de uma plataforma de pagamentos mobile disruptiva desenvolvida sob medida para adolescentes e jovens (Geração Z). O projeto nasceu da constatação de que os aplicativos bancários convencionais foram projetados com mentalidade burocrática e ultrapassada, exigindo navegação em menus complexos, memorização de chaves Pix gigantescas e trocas repetitivas de dados bancários entre amigos.

O Node pay transforma a experiência financeira ao integrar o envio de dinheiro diretamente com a lista de contatos nativa do smartphone e um feed social dinâmico. Pagar um amigo, rachar a conta da pizzaria no fim de semana ou solicitar R$ 20 para um lanche torna-se um ato instantâneo, divertido e fluido — realizado em apenas 2 toques com legendas, emojis e reações personalizadas.

Unindo máxima praticidade com uma estética moderna e recursos de autonomia financeira (como caixinhas de metas gamificadas e cartão virtual estilizado), o Node pay elimina o atrito dos pagamentos entre amigos e introduz a educação financeira de forma natural e sem termos técnicos engessados.

Declaração do problema

O Desafio e Objetivos

O Desafio

Adolescentes e jovens acham os aplicativos de bancos tradicionais extremamente chatos, burocráticos e lentos (média de 45 a 60 segundos por transferência). Além disso, solicitar o racha de despesas em rolês (cinema, festas, lanches) é socialmente constrangedor por falta de uma ferramenta direta e integrada aos contatos do celular.

O Objetivo

Projetar uma experiência social de pagamentos P2P que reduza o tempo de transferência para menos de 5 segundos, permita divisão automática de rolês entre amigos com notificações inteligentes e incentive o hábito de economizar através de metas visuais dinâmicas (+80% de adesão em caixinhas de economia).

Metodologia

Design Process

Para garantir que a solução atendesse aos altos padrões de praticidade e estilo exigidos pelos jovens, estruturei o processo de design guiado pela metodologia de Design Thinking dividida em 5 etapas iterativas: Empathize, Define, Ideate, Prototype e Test.

Esquema do Processo de Design Thinking (Empathize, Define, Ideate, Prototype, Test)
Empatia

Análise Competitiva de Mercado

Analisei as principais soluções de contas digitais tradicionais e aplicativos de finanças focados em jovens no Brasil e no exterior:

Bancos Digitais Tradicionais
Player Consolidado
Pontos Fortes
  • Ampla variedade de produtos financeiros avançados
  • Alta confiança de segurança e infraestrutura robusta
Pontos Fracos
  • Telas poluídas com ofertas de crédito e investimentos irelevantes para jovens
  • Fluxo de Pix burocrático e zero integração social por contatos
Digital Bank No Social Feed
Apps P2P Globais (Venmo / CashApp)
Referência Internacional
Pontos Fortes
  • Feed social forte com comentários e emojis nas transações
  • Popularidade maciça entre o público jovem universitário
Pontos Fracos
  • Sem integração com o ecossistema brasileiro de Pix e boletos
  • Interface envelhecida com pouca gamificação para guarda de dinheiro
Social P2P No Pix Sync
Fintechs de Mesada Juvenil
Foco Teen Restrito
Pontos Fortes
  • Controle parental simples para transferência de mesada
  • Cartão de débito físico com personalização de nome
Pontos Fracos
  • Sensação infantilizada que afasta jovens a partir dos 16 anos
  • Sem recursos de divisão de contas em grupo e interações entre contatos
Allowance Kiddie UI
Pagamentos por Mensageiros
Conveniência Direta
Pontos Fortes
  • Acesso direto aos contatos já salvos na agenda
  • Facilidade de envio dentro da conversa de texto
Pontos Fracos
  • Falta de gestão financeira, saldo acumulado e extrato categorizado
  • Baixa adesão de lojistas e ausência de metas de economia
Chat Pay No Financial Hub
Pesquisa de usuário

Entrevistas e Achados Chave

Realizei pesquisas qualitativas e quantitativas com mais de 35 jovens entre 15 e 23 anos para entender como lidam com dinheiro no dia a dia com amigos:

88%

Pedir chave Pix ou CPF a amigos destrói o ritmo do rolê

88% dos entrevistados relataram preguiça ou constrangimento em ficar pedindo chave Pix, abrindo o app do banco, colando a chave e confirmando o nome completo. Querem apenas clicar no amigo da agenda de contatos e enviar. E para resolver isso, integramos nativamente a lista de contatos do celular com o Node pay, permitindo pagar qualquer amigo em 2 toques sem precisar saber a chave Pix dele.

92%

Alguém sempre acaba pagando a conta inteira e é esquecido

92% dos jovens disseram que ao ir a uma pizzaria ou evento em grupo, um paga o total na maquininha e depois tem que ficar cobrando um por um no grupo do WhatsApp, gerando atritos desnecessários. E para resolver isso, criamos o recurso "Divisão de Rolê", que divide o valor total automaticamente entre os contatos selecionados, enviando uma solicitação de 1-clique para cada um e mostrando o status em tempo real.

76%

Guardar dinheiro no saldo comum resulta em gastos involuntários

76% dos jovens não conseguem guardar dinheiro se ele ficar visível no saldo da conta corrente, mas adoram ter "caixinhas" dedicadas para shows, viagens ou compras de jogos com barra de progresso visual. E para resolver isso, projetamos Caixinhas de Economia Gamificadas com arredondamento de troco automático, avatares visuais da conquista e trava opcional para evitar saques por impulso.

Arquétipos de usuários

Personas de Usuário

Lucas Silveira
Lucas Silveira
17 anos, Estudante de Ensino Médio e Gamer
São Paulo, SP
"Quero mandar dinheiro para os meus amigos na hora sem ter que ficar digitando chaves Pix imensas, e conseguir guardar uma grana pro meu novo fone sem complicação."
Sobre

Lucas recebe mesada dos pais e faz bicos com edição de vídeos curtos. Ele está sempre com os amigos na escola ou jogando online e prefere fazer tudo direto pelo celular com a máxima velocidade possível.

Objetivos Principais
  • Transferir dinheiro instantaneamente para contatos em 2 toques
  • Criar caixinhas de economia visual para comprar periféricos de jogos
  • Ter um cartão virtual moderno com nome estilizado no celular
Dores e Frustrações
  • Irritação com a lentidão dos apps bancários que os pais usam
  • Perder tempo pedindo chave Pix toda vez que quer pagar um lanche
Motivações
Pagamento por Contatos
Velocidade Extrema
Caixinhas Gamificadas
Beatriz Lima
Beatriz Lima
20 anos, Universitária e Estagiária
Porto Alegre, RS
"Preciso de uma forma fácil de rachar a conta dos rolês de fim de semana com o grupo da faculdade sem ter que ficar cobrando ninguém manualmente."
Sobre

Beatriz cursa Comunicação, estagia em uma agência e tem uma vida social agitada. Adora organizar saídas e viagens com amigos, mas odeia a burocracia de fazer planilhas ou ficar cobrando Pix no grupo.

Objetivos Principais
  • Dividir despesas de saídas em grupo de forma automática em 1-clique
  • Ver quem já pagou sua parte no rolê em tempo real
  • Organizar o orçamento mensal de forma visual e simples
Dores e Frustrações
  • Constrangimento em cobrar amigos que esquecem de pagar a parte da conta
  • Falta de visibilidade clara de quanto gastou em saídas no mês
Motivações
Divisão de Rolê Automática
Notificações sem Constrangimento
Design Moderno e Clean
Estrutura de ideação

POV e Como Podemos (HMW)

POV 01 · Envio de Dinheiro Social

Jovens conectados precisam de uma forma instantânea e divertida de transferir dinheiro para amigos sem digitar chaves Pix extensas ou abrir menus bancários burocráticos.

HMW 01 (-80% Tempo de Transferência)

Como podemos transformar a transferência de dinheiro em um fluxo de 2 toques integrado à agenda de contatos com reações e legendas personalizadas?

POV 02 · Divisão de Despesas em Grupo

Grupos de amigos precisam rachar contas de eventos e lanches em tempo real sem expor ninguém a constrangimentos sociais ou esquecimentos.

HMW 02 (100% Taxa de Cobrança sem Atrito)

Como podemos criar uma experiência de 'Divisão de Rolê' com cálculo automático por pessoa e lembretes amigáveis de 1-clique?

POV 03 · Autonomia e Economia Gamificada

Adolescentes precisam de incentivos visuais e metas claras para conseguir poupar parte de sua mesada ou ganhos para seus próprios objetivos de consumo.

HMW 03 (+75% Engajamento em Metas)

Como podemos desenhar caixinhas de investimento simples com ilustrações dinâmicas, metas em tempo real e arredondamento automático de troco?

Alinhamento estratégico

Matriz de Objetivos do Projeto

Objetivos de Negócio

  • Gerar efeito de rede viral orgânico através do convite e adição de contatos da agenda
  • Alcançar 88% de retenção de usuários ativos mensais (MAU) pela frequência de uso em rolês
  • Consolidar a marca Node pay como a primeira escolha financeira da Geração Z no Brasil

Objetivos do Usuário

  • Realizar transferências P2P em menos de 5 segundos sem digitar chaves burocráticas
  • Dividir contas de eventos com amigos de forma transparente e sem cobranças chaves
  • Personalizar cartões virtuais e acompanhar o progresso de suas caixinhas de sonhos

Considerações Técnicas

  • Utilizar a tipografia Urbanist para tipografia contemporânea de alto contraste em telas OLED
  • Garantir sincronização bidirecional de contatos com encriptação de ponta a ponta (E2E)
  • Integração ultrarrápida com API de Pix do Banco Central para liquidação instantânea
Arquitetura

User Flow

Mapeei a arquitetura de informação do Node pay com foco no fluxo principal: a partir do feed de contatos, o usuário escolhe entre Envio Direto (2 toques), Divisão de Rolê em Grupo ou Depósito em Caixinha de Economia.

User Flow Diagram Node Pay Social Banking
Layouts

Wireframes

Os wireframes priorizaram a redução máxima de elementos em tela, eliminando banners de propagandas e mantendo apenas a busca rápida de contatos, os atalhos de envio por chip e a visualização clara de saldo e caixinhas.

Wireframes Visão Geral de Telas e Fluxos Node pay
Wireframes Fluxo e Sequência de Telas Node pay
Wireframes Telas Detalhadas Node pay
Design System

Identidade Visual

Desenvolvi a identidade do Node pay combinando o tom vibrante Electric Blue (confiança e inovação) com Deep Violet (tecnologia e sofisticação) e Dark Slate (superfície moderna de alto contraste), criando um ecossistema visual fluido e acessível.

Paleta de Cores e Tokens

#effa85 Neon Yellow
100 200 300 400 500 600 700 800 900
#b5d6d3 Soft Sage
100 200 300 400 500 600 700 800 900
#b9adca Pastel Lavender
100 200 300 400 500 600 700 800 900
#7e7b87 Slate Gray
100 200 300 400 500 600 700 800 900
#1f1f21 Preto / Neutro
100 200 300 400 500 600 700 800 900
#10B981 Success
100 200 300 400 500 600 700 800 900
#F59E0B Warning
100 200 300 400 500 600 700 800 900
#EF4444 Error
100 200 300 400 500 600 700 800 900
Tipografia oficial
Urbanist (Fonte Oficial do Projeto)
A tipografia oficial do Node pay é a Urbanist (projetada por Corey Hu). Trata-se de uma fonte sem serifa geométrica contemporânea com traços limpos e legibilidade impecável em telas mobile escuras, garantindo que valores numéricos e nomes de contatos sejam destacados com clareza instantânea.
Headline 1
Font Urbanist
Weight Bold (700)
Size 64px
Letter spacing -1.5px
Headline 2
Font Urbanist
Weight SemiBold (600)
Size 48px
Letter spacing -1px
Headline 3
Font Urbanist
Weight SemiBold (600)
Size 32px
Letter spacing -0.5px
Headline 4
Font Urbanist
Weight Medium (500)
Size 24px
Letter spacing 0px
Paragraph — O rápido mocho-galego voa sobre o vale à noite, explorando a interface.
Font Urbanist
Weight Regular (400)
Size 16px
Letter spacing 0px
Small / Caption — Saldos, Chaves Pix e Transações Social Feed
Font Urbanist
Weight SemiBold (600)
Size 13px
Letter spacing 0.5px

Espaçamento

4px | Detalhes space-1
8px | Padding apertado space-2
12px | Padding interno space-3
16px | Padding padrão space-4
24px | Relacionados space-5
32px | Card space-6
48px | Blocos space-7
64px | Seções space-8
96px | Espaços Seções space-9
128px | Espaços Hero space-10

Raio de Borda

4px | Tags e Chips radius-xs
8px | Inputs e Campos radius-sm
12px | Botões, Cards, Tooltips e Dropdowns radius-md
16px | Cards Principais e Modais radius-lg
24px | Containers grandes e destaques radius-xl
999px | Badges circulares e pills radius-full
Design visual e protótipo

Protótipos das Telas

As telas finais refletem a máxima simplificação do ecossistema de pagamentos sociais para a Geração Z:

Dashboard Principal e Feed de Contatos Node pay

Dashboard Principal do Node pay – Visão direta do saldo disponível, atalhos rápidos para contatos frequentes, feed social de transferências e acesso a caixinhas de economia em 1 toque.

Fluxo de Transferência P2P por Contatos

Envio por Contatos – Seleção de amigo na lista telefônica, valor rápido (chips R$10, R$20, R$50), adição de legenda com emoji e confirmação via biometria.

Recurso Divisão de Rolê em Grupo

Divisão de Rolê – Cálculo automático de racha de despesas entre múltiplos contatos com envio instantâneo de cobrança amigável.

Caixinhas de Economia Gamificadas

Caixinhas Gamificadas – Poupança visual com metas para shows, games e compras, alimentadas por arredondamento automático de troco.

Cartão Virtual Personalizado e Estilizado

Cartão Virtual Neon – Personalização de cores, avatares e controle dinâmico de limites em tempo real.

Validação de métricas

Impacto Real

O Node pay foi testado com grupos de jovens de 15 a 22 anos em cenários reais de pagamentos e divisão de despesas, obtendo métricas de eficiência sem precedentes:

-80%
Tempo de Envio de Dinheiro
De 45s nos bancos convencionais para <5s por contatos
94%
Adesão de Amigos ao Racha
Liquidação de cobranças de rolê no mesmo dia
+75%
Engajamento em Poupança
Aumento de metas concluídas em Caixinhas
"Nunca mais precisei pedir chave Pix pra ninguém na escola. Só abro o Node pay, clico na foto do meu amigo da agenda, coloco R$ 15 do lanche e pronto! É inacreditavelmente rápido."
"O recurso de rachar a conta da pizzaria mudou tudo. Todo mundo recebe a notificação no celular na hora e paga sem que eu precise ficar mandando mensagem chata no grupo da faculdade."
Visão de futuro

Impacto Futuro

O Node pay provou que é possível transformar finanças pessoais em um hábito fluido, social e descomplicado para jovens. O mapa de evolução do produto contempla 4 inovações fundamentais:

01

Pagamento Pix por Aproximação (NFC Wallet)

Integração nativa com Apple Pay e Google Wallet para pagamentos presenciais em maquininhas sem precisar desbloquear o app.

02

Cashback e Recompensas em Parceiros de Rolê

Programa de cashback automático em cinemas, redes de fast-food, lojas de games e eventos culturais.

03

Controle Parental Transparente e Educativo

Painel onde os pais podem agendar mesadas e definir alertas de segurança sem invadir a privacidade social do filho.

04

Desafios de Economia em Grupo e Conquistas

Caixinhas coletivas onde amigos economizam juntos para viagens de formatura ou festivais com insígnias comemorativas.

Node pay - Visão Geral do Ecossistema Social Banking

Explore o Protótipo Interativo

Navegue pelos fluxos de envio por contatos, divisão de rolê e caixinhas gamificadas no Figma.

Ver Protótipo no Figma