Como criar um dashboard de SaaS sem escrever código

Como criar um dashboard de SaaS sem escrever código

Um dashboard de SaaS existe para responder uma pergunta por dia, não para exibir gráficos. No Zugo, uma tela única sai por 6 créditos e um painel com três telas nasce como plataforma multipágina por 12 créditos, com edições a 3 créditos e alguns minutos de espera na primeira construção.

Antes de escolher o gráfico, decida quem abre o painel e o que essa pessoa faz depois de olhar. Painel que não muda nenhuma decisão vira enfeite na segunda semana.

Esse painel é para você ou para o seu cliente?

São dois produtos diferentes com o mesmo nome, e misturá-los é o erro que mais custa tempo. O painel interno serve ao time: mostra receita recorrente, cancelamento, ativação e o que precisa de ação hoje. Ele pode ser feio, desde que seja verdadeiro.

O painel do cliente é parte do seu produto. Ele mostra os dados daquele cliente, precisa de login, precisa de permissão bem feita e precisa aguentar alguém abrindo do celular no meio de uma reunião. Aqui feio custa cancelamento.

A diferença prática aparece no desenho. No painel interno, você compara períodos e segmenta por plano. No painel do cliente, você mostra o uso dele, o limite do plano e o próximo passo, sem nenhuma referência a outros clientes.

Se você ainda não sabe qual dos dois quer, comece pelo interno. Ele é mais barato de construir, revela quais números realmente importam e serve de rascunho para o painel do cliente quando chegar a hora.

Quais números entram na primeira tela?

Poucos, e todos com uma ação associada. A tentação é replicar a tela de uma ferramenta famosa, que tem quarenta indicadores porque atende quarenta tipos de negócio. O seu atende um.

A taxa de ativação é o indicador mais ignorado e o mais útil. Um SaaS raramente morre de falta de cadastro: morre de gente que se cadastra, não chega ao primeiro valor e some. Se o painel mostra só receita, essa perda fica invisível até virar cancelamento.

Uma regra que economiza retrabalho: cada bloco da tela precisa terminar em uma pergunta acionável. "Cancelamentos do mês" sozinho é informação. "Cancelamentos do mês, com nome e plano, clicáveis" é trabalho que alguém pode fazer hoje à tarde.

De onde vêm os dados do painel?

Do lugar onde eles já moram. Se o seu produto guarda contas, assinaturas e eventos de uso, o painel só lê essa base e apresenta. Se ainda não guarda, o painel não tem o que mostrar, e essa é a primeira coisa a resolver.

No Zugo, a base fica no Supabase, que cuida de banco de dados, login e arquivos. É ele que permite ter usuários com permissões diferentes e é ele que responde às consultas que alimentam cada número da tela. Como isso se monta na prática está no guia de aplicativos com Supabase.

A parte de assinatura e cobrança vive no Stripe. Receita recorrente, plano e cancelamento saem de lá, e vale decidir cedo se o painel lê esses dados direto ou se você grava um espelho na sua base. Ler direto é mais simples no começo, gravar espelho fica melhor quando o histórico importa.

Um cuidado que evita conversa desconfortável: painel interno mostra dado de cliente. Defina quem do time enxerga o quê antes de abrir o acesso, porque esse tipo de erro só aparece quando alguém vê o que não devia.

Qual prompt descreve um painel de SaaS?

Descreva os números, a origem de cada um e quem entra. A aparência o construtor resolve, e a sua regra de negócio ele não tem como adivinhar.

Construa um painel interno para um SaaS de assinatura.
Tela 1, visão geral: cartões com receita recorrente mensal,
assinantes ativos, novos cadastros do mês e cancelamentos
do mês, mais um gráfico de linha com a receita dos últimos
doze meses.
Tela 2, contas: tabela com nome, plano, data de cadastro,
último acesso e status, com filtro por plano e busca por nome.
Tela 3, ativação: percentual de cadastros que concluíram o
primeiro projeto, com a lista de quem travou no caminho.
Login por usuário. Perfil administrador vê tudo, perfil
suporte vê apenas a tela de contas.
Interface em português do Brasil, leitura confortável no celular.

Repare que o prompt fala de comportamento e de permissão, não de cor. Quem pede em termos de estética recebe uma tela bonita com regra errada, e regra errada em painel gera decisão errada.

Uma construção dessas custa 12 créditos e leva alguns minutos, por ser multipágina. Cada tela adicional sai por 3 créditos, e os ajustes que vêm depois do primeiro uso custam 3 créditos por edição.

Quanto custa montar e ajustar em créditos?

O gasto se concentra nas primeiras semanas, quando o time usa e descobre o que falta. A tabela abaixo é a lista completa de preços, válida para qualquer tipo de projeto.

O plano gratuito dá 5 créditos, menos do que uma construção, então ele serve para experimentar a ferramenta. O Pro custa $25 por mês com 200 créditos, algo como 16 plataformas, 33 construções ou 66 edições. O Business custa $99 por mês com 800 créditos.

Na prática, um painel interno consome a construção inicial e mais quatro a oito edições no primeiro mês: falta um filtro, o gráfico precisa de outro recorte, alguém pede uma coluna. É justamente essa rodada que decide se o painel entra na rotina ou some.

Vale montar o seu painel ou usar uma ferramenta pronta?

Depende de quanto o seu recorte foge do padrão. Ferramentas de dados como Metabase, Google Looker Studio ou PostHog chegam com conexão a banco, gráficos prontos, agendamento de relatório e anos de refinamento em cima de milhares de times. Isso é vantagem real e seria desonesto fingir o contrário.

O painel próprio ganha quando ele faz parte do produto ou quando ele precisa ligar número e ação na mesma tela. Um painel que lista contas em risco e permite abrir a ficha da conta ali mesmo é um pedaço de operação, e ferramenta de BI não foi feita para isso.

Se o seu caso é acompanhar clientes e cobranças em vez de indicadores, um CRM feito sob medida resolve melhor, porque o objeto central passa a ser o negócio e não a métrica.

Como testar antes de abrir para o time?

Toda construção do Zugo é aberta em uma sandbox antes da entrega, e a que não sobe é reportada como falha em vez de chegar quebrada. Isso garante que o painel abre, não que a soma do MRR está certa.

Confira os números na mão antes de acreditar neles. Pegue um mês fechado, some as assinaturas ativas na sua base e compare com o cartão da tela. Se bater, você tem um painel. Se não bater, você tem um gráfico bonito e uma decisão errada esperando para acontecer.

Depois entre com dois perfis diferentes e confirme quem vê o quê. Permissão é a parte que mais assusta em painel interno, porque o erro só aparece quando alguém abre o que não devia. Se o painel também vai virar argumento comercial, vale alinhar com o que a sua página de preços de SaaS promete em cada plano.

O que um construtor com IA não faz em um painel?

Três limites que valem ser ditos antes de começar. O primeiro é análise pesada: cruzar milhões de linhas, montar coorte complexa e rodar consulta que demora minutos é trabalho de ferramenta de dados, não de uma tela gerada por descrição.

O segundo é atualização em tempo real de verdade, com números mudando na tela enquanto você olha. O caminho realista é atualizar a cada carregamento e, se precisar, a cada poucos minutos.

O terceiro é a definição das métricas. O construtor não sabe se você conta o churn por conta ou por receita, nem se o teste grátis entra em assinante ativo. Regra de negócio muito específica se afina com edições sucessivas, e o Zugo não substitui um time de desenvolvimento em um produto complexo.

Por onde começar?

Escreva em um papel as três perguntas que você faz toda segunda-feira sobre o negócio. Esse é o painel. Tudo o que não responde a uma dessas perguntas fica de fora da primeira versão e entra depois, se alguém sentir falta.

Construa a versão de três telas, use sozinho por uma semana e só então convide o time. Dá para começar em zugo.dev com um dos 25 modelos prontos e adaptar o painel ao seu produto.