Crie um dashboard com IA em segundos com o Lovable
Neste post você vai aprender a criar um dashboard interativo em segundos usando Lovable, uma ferramenta no-code de inteligência artificial.
Você vai ver como construir uma visualização de dados de vendas de uma empresa fictícia, com gráficos, filtros e KPIs, sem ter que escrever código. Vamos detalhar o passo a passo, incluindo como preparar um bom prompt, fazer upload de dados, personalizar o dashboard e até usá-lo como mockup para projetos profissionais.
Resumo: o Lovable é uma ferramenta no-code de IA que cria aplicativos e dashboards a partir de uma descrição em texto. Para montar um dashboard, você acessa lovable.dev, descreve em um prompt o painel que quer (os gráficos, os KPIs e os filtros), faz o upload da sua base de dados e a IA gera a visualização interativa em segundos — sem escrever uma linha de código. Depois, é só ajustar o layout pedindo mudanças no chat e publicar o dashboard por um link.
Para receber por e-mail a base de dados e o prompt utilizados neste guia, preencha:
Não vamos te encaminhar nenhum tipo de SPAM! A Hashtag Treinamentos é uma empresa preocupada com a proteção de seus dados e realiza o tratamento de acordo com a Lei Geral de Proteção de Dados (Lei n. 13.709/18). Qualquer dúvida, nos contate.
O que você vai ver hoje?
Por que usar Lovable para criar dashboards?
O Lovable é uma ferramenta no-code que usa IA para criar sites e dashboards instantaneamente, permitindo que você suba uma base de dados e gere visualizações da maneira mais prática possível.
É ideal para freelancers, analistas de dados ou empresas que precisam de soluções rápidas e acessíveis, sem depender de ferramentas como Excel ou Power BI.
- Benefícios:
- Cria dashboards em segundos, sem necessidade de programação.
- Gera mockups para aprovação de layout ou dashboards finais para uso real.
- Suporta filtros interativos e integração com dados reais.
- Fácil de compartilhar as visualizações por meio de links.
Estrutura da base de dados
A nossa base de dados contém histórico de vendas de uma empresa fictícia chamada Eletro, com as seguintes colunas:
- SKU Vendido: Código do produto/Identificador único (texto).
- Quantidade Vendida: Número inteiro.
- Produto: Nome do produto (texto).
- Marca: Marca do produto (texto).
- Categoria: Categoria do produto (texto).
- Preço Unitário: Valor do produto (decimal).
- Faturamento: Receita total da venda (decimal).
- Loja: Nome da loja (texto).
- Cidade: Cidade da loja (texto).
- Tipo da Loja: Física ou online (texto).
- Data da Venda: Formato de data (número serial do Excel, ex.: 44828).
Essa base será usada para gerar gráficos e KPIs no dashboard.
Dica: se você quer entender o que são KPIs, veja um dos nossos artigos onde mostramos os principais KPIs de marketing, de produção ou de RH.
Passo a passo: Criando o dashboard
1. Preparando o Prompt
O Lovable funciona melhor com um prompt bem estruturado.
É importante especificar os detalhes da base de dados e os elementos que você quer que apareçam no dashboard.
Veja o prompt que utilziamos:
Crie um painel interativo para a empresa fictícia #Eletro que permita o upload de um arquivo CSV chamado "base_vendas.csv". Cada linha do CSV representa uma venda individual com as colunas:
- Código do Produto (texto),
- Quantidade Vendida (inteiro),
- Produto (texto),
- Marca (texto),
- Categoria (texto),
- Preço Unitário (decimal, sem ç),
- Faturamento (decimal),
- Loja (texto),
- Cidade (texto),
- Tipo da Loja (texto, valores: "Física" ou "Online"),
- Data da Venda (número serial do Excel, ex.: 44828, representando uma data).
Ao fazer o upload, crie automaticamente um dashboard interativo com:
- Gráfico de linhas ou barras para faturamento mensal com base na Data da Venda.
- Gráfico de barras para faturamento por loja.
- Gráfico de pizza para faturamento por tipo de loja (Física vs. Online).
- Gráfico de barras para quantidade vendida por marca (top 10 marcas).
- Cartões com KPIs: Faturamento Total, Quantidade Vendida Total, Ticket Médio (Faturamento Total / Quantidade Vendida Total), Total de Vendas.
- Filtros interativos para período (data), loja, cidade, marca e tipo de loja.
- Layout claro (fundo claro, textos visíveis).
Observações técnicas:
- Trate Data da Venda como campo de data válido (número serial do Excel).
- Faturamento como número decimal.
- Quantidade Vendida como número inteiro.
- Certifique-se de que os gráficos e filtros sejam responsivos e interativos.Dicas para o prompt:
- Use os mesmos nomes das colunas da base de dados para evitar erros.
- Especifique o formato da data (número serial do Excel) para evitar problemas de interpretação.
- Liste os gráficos e KPIs desejados claramente.
- Reforce aspectos técnicos (ex.: tipo de dado de cada coluna) para garantir cálculos corretos.
2. Acessando o Lovable
- Acesse lovable.dev e faça login com sua conta do Gmail.
- Use os créditos gratuitos diários do plano free para gerar dashboards.
- Cole o prompt no campo de entrada do Lovable e pressione Enter.
- Aguarde alguns segundos enquanto a IA gera o painel com a opção de upload de arquivo.
3. Fazendo upload da base de dados
- Baixe o arquivo base_vendas.csv (disponível na descrição do vídeo, conforme mencionado).
- Na interface do Lovable, clique para fazer o upload do arquivo.
- Após o upload, o Lovable processa os dados e gera automaticamente o dashboard com:
- KPIs: Faturamento Total, Quantidade Vendida Total, Ticket Médio, Total de Vendas.
- Gráficos: Faturamento mensal, faturamento por loja, faturamento por tipo de loja (pizza), quantidade vendida por marca (top 10).
- Filtros: Período, loja, cidade, marca e tipo de loja.
4. Personalizando o Dashboard
O dashboard pode apresentar pequenos erros, como gráficos não renderizados ou problemas de visibilidade no modo escuro.
Para corrigir:
- Mudar para fundo claro: Se o dashboard for gerado no modo escuro (como mencionado), adicione um prompt de feedback: text
Troque o fundo do dashboard para um tema claro e ajuste as cores dos textos para garantir visibilidade. - Corrigir gráficos com erro: Se um gráfico (ex.: faturamento por loja) não renderizar, use: text
Ajuste o gráfico de faturamento por loja que não está funcionando. - Adicionar mais elementos: Para incluir novos gráficos ou filtros, envie prompts como: text
Adicione um gráfico de linhas mostrando a quantidade vendida por categoria ao longo do tempo.
O Lovable ajusta o dashboard automaticamente com base no feedback, geralmente resolvendo erros internos, como destacado na transcrição.
5. Usando e Publicando o Dashboard
- Interatividade: O dashboard é totalmente interativo. Você pode:
- Filtrar por loja (ex.: Rio de Janeiro) ou período (ex.: 1º trimestre de 2025).
- Visualizar dados atualizados automaticamente ao aplicar filtros (ex.: 80,5% das vendas do Rio de Janeiro são online).
- Publicação: Clique no botão de publicação no Lovable para gerar um link compartilhável. O dashboard pode ser acessado como um site, permitindo uploads de novos dados.
- Mockup ou uso final:
- Use o dashboard como um mockup para aprovação de layout, replicando-o em ferramentas como Power BI ou Excel com dados reais.
- Ou publique-o diretamente como solução final, se os dados forem fictícios ou seguros para upload.
Inteligência Artificial ImpressionadorVocê vai aprender de forma prática a usar as principais ferramentas de Inteligência Artificial que estão revolucionando o Mercado de Trabalho, para se destacar em qualquer empresa que use as ferramentas dessa revolução. Independente da sua área, aqui você vai aprender como usar a Inteligência Artificial na sua realidade para se destacar.
Começar agora
Dicas Práticas
- Teste com dados fictícios: Use uma base de dados “mascarada” para evitar subir informações sensíveis.
- Itere com feedback: Se houver erros (ex.: filtro não funcionando), envie prompts curtos ao Lovable para corrigir.
- Aprove o layout: Use o Lovable para criar um mockup inicial, obtenha aprovação do cliente, e recrie em outra ferramenta, se necessário.
- Economize créditos: Um prompt bem escrito reduz a necessidade de ajustes, aproveitando melhor os créditos diários gratuitos.
Componentes do Dashboard Gerado
| Elemento | Descrição | Exemplo de Visualização |
|---|---|---|
| KPI: Faturamento Total | Soma de todo o faturamento | R$ 1.250.000 |
| KPI: Ticket Médio | Faturamento Total ÷ Quantidade Vendida Total | R$ 125,00 |
| Gráfico: Faturamento Mensal | Linhas ou barras por mês | Barras mostrando aumento em março |
| Gráfico: Faturamento por Loja | Barras por loja (ex.: RJ, SP) | RJ com maior faturamento |
| Gráfico: Tipo de Loja | Pizza (Física vs. Online) | 80,5% Online no RJ |
| Filtros Interativos | Filtrar por período, loja, marca, etc. | Vendas do 1º trimestre de 2025 |
Conclusão
Com o Lovable, criar um dashboard interativo é incrivelmente rápido e acessível, mesmo sem conhecimento de programação. A transcrição destaca como a ferramenta revoluciona a criação de dashboards, permitindo gerar visualizações profissionais em segundos. Use o prompt fornecido, faça upload da sua base de dados, ajuste o layout com feedback simples, e publique ou use como mockup. Essa abordagem é perfeita para freelancers, analistas ou empresas que querem protótipos rápidos ou soluções prontas. Baixe os arquivos, experimente, e aproveite a revolução do no-code com IA!
Caso prefira esse conteúdo no formato de vídeo-aula, assista ao vídeo abaixo ou acesse o nosso canal do YouTube!
O que você aprende neste vídeo
Resposta rápida: A aula mostra um prompt que faz o Lovable trabalhar com a sua base: pedir primeiro um painel de upload, porque o pedido direto de dashboard sai meio fictício, e detalhar cada coluna da base. O dashboard sai interativo, mas um gráfico falha e é corrigido pelo chat.
Neste vídeo (13 min):
- 1:46 - Para pensar em métricas e gráficos, o instrutor joga a base no ChatGPT e aproveita as ideias de indicadores e visualizações; o prompt sugerido, porém, falava em Power BI, que não tem nada a ver com o Lovable.
- 2:30 - Em vez de pedir o dashboard de cara, o prompt pede um painel para subir a base: o pedido direto, segundo o instrutor, gera um dashboard meio fictício, sem os seus dados.
- 5:13 - O prompt sugere os componentes: gráficos de faturamento por mês, por loja e por tipo de loja, quantidade vendida por marca, cartões de KPI e filtros interativos.
- 6:22 - Para entrar no Lovable, basta um login gratuito com a conta do Gmail; o plano gratuito dava cinco créditos (por dia, se o instrutor não se engana), o bastante para este dashboard.
- 6:48 - Com o prompt colado, o Lovable gera primeiro o painel de upload, já no modo escuro.
- 7:39 - Ao subir o arquivo da aula, o dashboard aparece na hora, com faturamento total, quantidade vendida, ticket médio, total de vendas, faturamento mensal e a aba de filtros.
- 8:32 - No modo escuro, o texto que aparece ao passar o mouse fica escuro sobre fundo escuro; o instrutor pede fundo claro e o conserto do gráfico de faturamento por loja, que não tinha aparecido, e o Lovable ajusta os dois.
- 9:10 - Os filtros funcionam por loja e por período: com a loja do Rio de Janeiro ou o primeiro trimestre de 2025 selecionados, os gráficos passam a mostrar só esse recorte.
- 10:05 - Como o Lovable cria um site, dá para publicar o dashboard, e a versão publicada traz a opção de subir o arquivo.
- 12:41 - Se continuar dando erro, a saída é explicar o problema ao Lovable: num teste anterior, o filtro não abria, e a ferramenta respondeu que ia corrigir um erro interno.
Trechos do vídeo:
- Os nomes das colunas no prompt têm de ser idênticos aos da base: num teste do instrutor, o ChatGPT escreveu preço unitário com cedilha, a base não tinha a cedilha, e deu um pequeno problema.
- No Excel, a data aparece como dia, mês e ano, mas por trás é um número; explicar no prompt que o Excel exporta a data como número serial, sugestão do próprio Lovable, fez os erros de data pararem nos testes do instrutor.
- No prompt, diga o tipo das colunas que entram em conta, como faturamento em número decimal e quantidade em número inteiro, e como se calcula cada indicador, como o ticket médio, para a IA não inventar nada.
- Quem não quer subir a base real da empresa numa IA pode montar no Lovable um mockup com dados diferentes, aprovar o modelo e refazer o mesmo dashboard com os dados reais no Power BI ou no Excel.
Hashtag Treinamentos
Para acessar outras publicações de Inteligência Artificial, clique aqui!
Posts mais recentes de Inteligência Artificial
- Graph Engineering: o que é e como coordenar agentes de IA
Entenda o que é graph engineering, como coordenar vários agentes de IA com critérios, pesos e revisão cruzada e quando essa estrutura vale a pena. - Engenharia de IA: o que é, o que faz e como começar
Entenda o que é engenharia de IA, a diferença para machine learning e engenharia de agentes, o que faz um engenheiro de IA e como começar na área. - Loop Engineering: o que é e como automatizar agentes de IA
Entenda o que é loop engineering, como gatilhos fazem agentes de IA trabalharem sem você pedir cada passo e quais cuidados tomar ao automatizar.
Posts mais recentes da Hashtag Treinamentos
- Planilha de Controle de Notas Fiscais no Excel [Grátis]
Baixe a planilha de controle de notas fiscais no Excel grátis: calcule ISS e retenções, veja o que está em aberto e gere a cobrança de cada nota de serviço. - Qual IA usar na empresa: ChatGPT, Claude ou Perplexity?
Qual IA usar na empresa: veja as diferenças entre ChatGPT, Claude e Perplexity e quando cada um rende mais em cada área da sua equipe. - Apostilas Gratuitas em PDF: Excel, Power BI, Python e IA
Baixe apostilas gratuitas em PDF de Excel, Power BI, Python, Claude e agentes de IA, com exercícios e gabarito. Escolha a sua e comece hoje.
