---
slug: dashboard-dados
nome: Painel de dados
descricao: azul-marinho profundo, gráficos planos e saturados que crescem, números gigantes que contam
familia: SaaS e tecnologia
versao: 1
quando:
  - "vídeo de relatório, resultado do mês ou painel de métricas"
  - "mostrar crescimento com números e gráficos"
  - "anúncio de ferramenta de analytics, BI ou financeiro"
  - "prova de resultado com um número grande"
  - "resumo de ano ou retrospectiva em dados"
nao_serve:
  - "vídeo sem nenhum número ou dado"
  - "clima editorial, calmo, em papel (use notion-editorial)"
---

# Painel de dados

Fundo **azul-marinho profundo** (`#0C1224`) com linhas de eixo finas que sobem devagar como a régua de um gráfico. Os heróis são **dados desenhados em cores chapadas e saturadas** (laranja `#FF8A3D`, turquesa `#35D6C0`, rosa `#FF5C8A`, amarelo `#FFD23F`): um **KPI de 380 px** que conta, **colunas que crescem com overshoot**, **rosca que se desenha fatia a fatia**, **ranking de barras horizontais** e **linha de tendência** com ponto final etiquetado. Tudo **alinhado à esquerda** (x = 96), como num painel, em **Montserrat 800**. A cor laranja marca sempre a barra/fatia/ponto que importa; o resto é turquesa. Um herói por cena e muito vazio ao redor.

## Como montar um vídeo com este kit

1. **Leia o pedido e o roteiro.** Corte cada fala em frases curtas. Uma frase = um plano.
2. **Escolha as batidas** em `receita.json`. Cada batida diz quanto dura e quais elementos servem.
3. **Escreva o plano de cenas** (`plano.json`, mesmo formato de `exemplos/plano.json`): `de`/`ate` em quadros, `entrada`, `camadas` (elemento + props) e `sons`. Os cortes seguem a voz ou a batida da trilha (1 batida = 14.75 quadros).
4. **Renderize** com `<Montagem plano={...} arquivos={...} />`.
5. **Confira** um quadro por cena contra `regras/`: área segura, herói grande, nada parado, nada cortado.

## Elementos

| elemento | o que faz | batidas |
|---|---|---|
| `NumeroGigante` | KPI de até 380 px contando, rótulo mono e selo de variação | kpi |
| `BarrasCrescendo` | colunas que crescem da base com overshoot, números contando, a destacada em laranja | barras |
| `RoscaDados` | rosca de 640 px com fatias que se desenham em sequência + legenda | rosca |
| `RankingBarras` | barras horizontais ordenadas que deslizam, valor contando | ranking |
| `LinhaTendencia` | linha que se desenha, pontos que estalam, etiqueta no último | tendencia |
| `AssinaturaMarca` | logo + nome + fio laranja + endereço, à esquerda | marca (última) |
| `Fundo`, `Camera`, `Cena` | o chão, a deriva da câmera e a janela de cada plano | todas |
| `Efeito`, `Trilha` | sons e trilha do kit | todas |

## Proibido

- Fundo claro ou cartões brancos (isso é stripe-ondas) e janela de app (isso é saas-linear).
- Mais de 4 cores de dado; laranja só no que importa.
- Gráfico sem número: todo dado mostra o valor contando.
- Dado inventado fora de ordem de grandeza razoável; sempre rotule a unidade.
- Mais de um herói por cena; elemento a menos de 96 px da borda.
- Brilho/glow, flash branco, 3D.
- Texto fora da área segura (168–1330 px, 96 px nas laterais).