Em desenvolvimento: esta página ainda não está pronta. Volte em breve para conferir as novidades!
UX/UI Design Mobile & Desktop FinTech MEI Figma HTML/CSS

SuaMEI: Simplificação da gestão financeira para mais de 2.500 microempreendedores brasileiros

Atuei como Junior UX/UI Designer em um contrato PJ entre 2020 e 2022. Estruturei a experiência de uma plataforma financeira voltada para um público com pouco contato com sistemas de gestão. O resultado foi uma interface modular e acessível, com acompanhamento desde o wireframe até o handoff e a implementação com HTML e CSS.

Participei de todo o ciclo de desenvolvimento do produto, incluindo pesquisa, concepção, ideação, prototipagem e testes de usabilidade. A solução multiplataforma construída no Figma resolve problemas de irregularidade fiscal do MEI, uma dificuldade central do empreendedorismo informal no Brasil.

Empresa SuaMEI Papel Junior UX/UI Designer (Contrato PJ) Período 2020 a 2022 (2 anos) Impacto 2.500+ MEIs atendidos
SuaMEI — tela de login da plataforma desktop SuaMEI — dashboard de Visão Geral com indicadores financeiros
250+ Empresas Atendidas

Empresas contratantes gerenciando prestadores de serviço PJ de forma segura e documentada.

2.500+ MEIs Regularizados

Microempreendedores com CNPJ ativo, impostos em dia e contratos formalizados pela plataforma.

R$8.1Mi+ Em Notas Emitidas

Volume financeiro transitado pela plataforma. O sistema conferiu rastreabilidade e reduziu passivos fiscais.

7 em 10 MEIs Irregulares (Sebrae)

O dado norteou a missão de design para mitigar a informalidade no mercado de trabalho.

O Cenário

A gestão financeira diante da informalidade fiscal

O ecossistema de contratação que motivou a criação da SuaMEI e orientou as decisões de design do projeto.

Antes da pandemia e da reforma trabalhista de 2017, um grande volume de empresas brasileiras já contratava prestadores de serviço como PJ. Grande parte dessas contratações ocorria de forma inadequada. Isso gerava passivos fiscais e trabalhistas para ambos os lados.

Dados do Sebrae e do IBGE indicam que a maioria dos CNPJs MEIs encontra-se em situação irregular, inapta ou cancelada. Muitas vezes o próprio empreendedor desconhece essa condição. A gestão desses PJs acabava sobrecarregando os executivos responsáveis pelo crescimento dos negócios.

A SuaMEI foi criada em 2020 para suprir essa lacuna. A plataforma centraliza os processos de abertura de CNPJ, elaboração de contratos, alvarás, pagamento de impostos e emissão de notas fiscais.

Figma Wireframe Ideação Prototipagem Design System Teste de Usabilidade HTML/CSS
SuaMEI — dashboard de Visão Geral com cobranças, faturamento previsto e gráficos de finanças
Visão Geral: O ponto de entrada da plataforma consolida cobranças, faturamento e saúde financeira em um único painel.
O Desafio

Design para usuários iniciantes em sistemas financeiros

O público-alvo, formado por autônomos e freelancers, necessita gerir o próprio negócio de maneira autônoma com ferramentas objetivas.

Projetar para microempreendedores exige conciliar a complexidade da legislação MEI com a simplicidade de uso. Como o acesso ocorre majoritariamente pelo celular em meio à rotina de trabalho, as telas precisam de clareza imediata.

O objetivo principal foi transformar obrigações fiscais e fluxos de pagamento em processos compreensíveis para que o usuário entenda os dados da empresa e tome decisões seguras.

  • Irregularidade fiscal oculta: Muitos usuários desconheciam dívidas com o DAS ou pendências na emissão de notas fiscais.
  • Baixa literacia financeira: Termos técnicos causavam confusão e abandono durante a navegação.
  • Gestão descentralizada: Informações espalhadas por portais do governo e bancos dificultavam o controle.
  • Falta de conta digital MEI: A mistura de finanças pessoais e empresariais foi uma dificuldade frequente nos testes.
  • Contexto mobile-first: Acessos realizados por smartphones em conexões instáveis.
A Solução e Arquitetura de UI

Interface estruturada e navegação contextual

A arquitetura visual orienta a navegação do produto. Os pilares da interface focam na redução da carga cognitiva durante tarefas críticas.

Clean UI para Dados Densos

Uso de fundo branco e tipografia legível com o laranja institucional para destaques pontuais. A neutralidade visual prioriza dados e extratos.

Sidebar de Navegação

Padrão para plataformas SaaS financeiras que localiza o usuário e facilita a transição entre os módulos.

Design System Figma

Biblioteca de componentes estruturada com tokens documentados. O handoff incluiu especificações detalhadas e acompanhamento direto na implementação.

Prototipagem e Testes

Validação de protótipos com usuários reais na fase de ideação, com iterações baseadas em dados de uso.

SuaMEI — módulo Financeiro com listagem de todas as movimentações, receitas e despesas
Módulo Financeiro — visão consolidada de todas as movimentações com categorização por tags e filtros temporais.
Pilar 1: Módulo Financeiro

Organização de receitas, despesas e fluxo de caixa

O módulo financeiro estrutura três visões: Todas as Movimentações, Receitas e Despesas, todas com filtros por categoria e período.

Os testes de usabilidade indicaram a necessidade de separar Receitas e Despesas em rotas distintas, pois os usuários priorizavam visualizar as entradas do mês rapidamente. O uso de ícones coloridos e tags de categoria auxiliou a identificação das transações.

SuaMEI — sub-módulo de Receitas com extrato, data, origem e valor de cada entrada
Receitas: Entradas com extrato, categoria, data de recebimento e valor.
SuaMEI — sub-módulo de Despesas com histórico de saídas categorizadas
Despesas: Saídas organizadas com ícone de categoria e valor para identificação rápida.
Pilar 2: Conta Digital

Conta PJ integrada com TED, PIX, boletos e extratos

A pesquisa com usuários apontou a mistura de finanças como uma dor recorrente. A Conta Digital fornece um ambiente isolado com saldo e operações completas.

O fluxo de pagamento recebeu atenção no ciclo de testes. O usuário insere o código de barras, revisa os dados e confirma com senha. As etapas minimizam erros operacionais e a tela de confirmação exige atenção consciente antes da conclusão.

A tela inicial para novos usuários apresenta ilustrações e orientações simples para estimular o uso de recursos bancários.

SuaMEI — Conta Digital com extrato de depósitos, transferências TED e PIX e pagamentos de boleto
Conta Digital: Extrato completo com histórico de operações e saldo visível.
SuaMEI — modal de Confirmar Pagamento com campo de senha e botão de confirmação
Confirmar Pagamento: Revisão de dados e inserção de senha para validar transações.
Pilar 3: Gestão da Empresa

Acompanhamento de impostos, Notas Fiscais e regularidade do CNPJ

O módulo centraliza o monitoramento da saúde do CNPJ, incluindo contratos, parcelas de impostos, notas fiscais e emissão do Certificado MEI.

Um grid de cards apresenta indicadores visuais para identificação de pendências. Contratos vencidos e impostos atrasados ganham prioridade na hierarquia visual da tela.

O documento de arrecadação do Simples Nacional aparece integrado na interface. O detalhamento de tributos e o botão de pagamento agilizam a rotina sem redirecionamentos para o portal do governo.

SuaMEI — painel da Empresa com grid de cards de contratos vigentes, vencidos e impostos pagos
Empresa: Visão geral do CNPJ com status de impostos e sistema de alertas.
SuaMEI — tela de Impostos com DAS do Simples Nacional exibido inline com botão Pagar
Impostos: DAS integrado com detalhamento fiscal e botão para pagamento imediato.
Em Produção

A interface na prática.

Uma visão completa dos módulos entregues — onde cada tela foi validada com usuários antes de ir para o handoff.

Entregas e Resultados

Um ciclo de design focado no usuário

As entregas visaram alinhar o processo de desenvolvimento e proporcionar estabilidade na navegação do usuário.

✓
Produto Lançado

Plataforma mobile e desktop entregue em produção, atendendo mais de 250 empresas e 2.500+ MEIs desde o lançamento em 2020.

6+
Módulos Desenhados

Visão Geral, Financeiro, Conta Digital, Empresa, Benefícios e fluxos de onboarding — todos com cobertura de estados vazios, erros e sucesso.

↓
Integração UI e Front-end

A documentação detalhada no Figma somada ao suporte prático com HTML e CSS facilitou a implementação e otimizou o handoff.

2×
Plataformas Cobertas

Design system único sustentando tanto a versão desktop (SaaS) quanto a versão mobile — com adaptações responsivas documentadas para cada breakpoint.

100%
Fluxos Prototipados

Todos os fluxos críticos — pagamento, emissão de NF, abertura de conta e regularização de CNPJ — validados com protótipos interativos antes do desenvolvimento.

R$8.1Mi
Em Notas Gerenciadas

Volume financeiro transitado pela plataforma — validando que a experiência projetada sustenta transações reais com confiança e rastreabilidade.

Vamos conversar sobre design de interfaces e produtos digitais.

Para projetos focados em pesquisa, concepção e entrega técnica com Figma, HTML e CSS, estou à disposição para contato.

Bora tomar um café (WhatsApp) contato@ericknobre.com Ver todos os cases