Planejamentos financeiros não precisam ser complicados, mas também não deveria simplificar demais. Para o bootcamp Santander 2026 AI React Front-end, criei Atlas Money, um simulador financeiro multi-etapas que guia o usuário pela sua situação real e oferece orientação personalizada e assistida por IA.

O Fluxo: O usuário insere renda mensal, despesas fixas, empréstimos ativos e sua meta financeira. O app gera um cenário completo (renda menos despesas, cronogramas de dívida, meta mensal de economia) e abre um chat com um educador financeiro assistido por IA para refinamento em tempo real.

Arquitetura & Acessibilidade

A interface é dividida em duas camadas: biblioteca de componentes reutilizáveis e lógica específica de features. Cada elemento usa React Aria Components para navegação completa por teclado, suporte a screen readers e labels ARIA apropriados. O design system roda em tokens Tailwind CSS v4, garantindo consistência.

Formulário e Resultados

Cada etapa do formulário é focada e precisa. O fluxo multi-etapas quebra uma situação financeira complexa em perguntas gerenciáveis. Completo, o usuário vê seu snapshot financeiro: renda, despesas e capacidade mensal para sua meta.

Depois vem a camada de IA. O educador financeiro oferece orientação personalizada baseada nos números do usuário, não conselhos genéricos. Usuários podem fazer acompanhamentos, refinar a meta ou salvar cenários localmente para comparar diferentes planos financeiros.