Todos os guias

Criar bolhas dinâmicas, sunbursts, redes e Gantt
passo a passo.

Cada gráfico responde a uma pergunta diferente e exige uma estrutura de linha própria. Aprenda o esquema de bolhas por período, caminhos hierárquicos, ligações ponderadas e tarefas agendadas.

10 min de leituraAtualizado
GUIA · EXEMPLO AO VIVO

Linha do tempo de bolhas em movimento

2021Norte · 2021 · X 22 · Y 64 · 38Norte38Sul · 2021 · X 48 · Y 36 · 62Sul62Leste · 2021 · X 71 · Y 72 · 44Leste44Oeste · 2021 · X 84 · Y 28 · 26Oeste262021202220232024
LIVELYCHARTDê vida aos dados

De dados limpos a um gráfico pronto a publicar.

  • Transforme a pesquisa numa decisão de gráfico
  • Prepare CSV com rótulos, unidades e períodos limpos
  • Use Linha do tempo de bolhas em movimento apenas quando combinar com os dados
  • Exporte vídeo e PNG final para reutilização
Experimentar o exemplo

Crie com a estrutura de dados certa

Use este esquema pronto para gráficos como ponto de partida. Substitua as linhas de exemplo, mantenha as colunas e reveja toda a animação antes de exportar.

Ideal para
As bolhas deslocam-se, mudam de tamanho e reagrupam-se entre períodos para revelar mudanças multivariadas.
Colunas obrigatórias
EntidadePeríodoXYTamanho
O que cada linha representa
Uma entidade num período, com coordenadas X e Y e tamanho numérico. Repita cada entidade em todos os períodos.

Fluxo em três passos

  1. 1

    Mantenha os nomes e a ordem das colunas mostrados acima.

  2. 2

    Adicione uma observação por linha e mantenha nomes, unidades e períodos consistentes.

  3. 3

    Pré-visualize todos os frames e ajuste rótulos, densidade e ritmo.

Linha do tempo de bolhas em movimentoExemplo CSV localizado
Entidade,Período,X,Y,Tamanho
Norte,2021,22,64,38
Sul,2021,48,36,62
Leste,2021,71,72,44
Oeste,2021,84,28,26
Norte,2022,31,69,46
Sul,2022,52,43,70
Leste,2022,66,78,51
Oeste,2022,77,35,34
Norte,2023,39,75,58
Sul,2023,59,51,77
Leste,2023,72,83,63
Oeste,2023,69,44,42
Norte,2024,47,81,72
Sul,2024,66,60,86
Leste,2024,79,88,75
Oeste,2024,61,53,55
O que cada linha representa

Crie com a estrutura de dados certa

Use este esquema pronto para gráficos como ponto de partida. Substitua as linhas de exemplo, mantenha as colunas e reveja toda a animação antes de exportar.

Ideal para
Anéis aninhados expandem-se do centro para mostrar a composição hierárquica e a contribuição de cada ramo.
Colunas obrigatórias
CaminhoValor
O que cada linha representa
Um caminho final e o seu valor. Separe níveis com barra, por exemplo Produto/Núcleo/Pesquisa.

Fluxo em três passos

  1. 1

    Mantenha os nomes e a ordem das colunas mostrados acima.

  2. 2

    Adicione uma observação por linha e mantenha nomes, unidades e períodos consistentes.

  3. 3

    Pré-visualize todos os frames e ajuste rótulos, densidade e ritmo.

Sunburst animadoExemplo CSV localizado
Caminho,Valor
Produto/Núcleo/Pesquisa,28
Produto/Núcleo/Espaço de trabalho,22
Produto/Crescimento/Automação,18
Produto/Crescimento/Insights,14
Serviços/Consultoria/Estratégia,12
Serviços/Consultoria/Pesquisa,9
Serviços/Entrega/Lançamento,16
Serviços/Entrega/Suporte,11
Parceiros/Plataforma/Nuvem,13
Parceiros/Plataforma/Dados,8
O que cada linha representa

Crie com a estrutura de dados certa

Use este esquema pronto para gráficos como ponto de partida. Substitua as linhas de exemplo, mantenha as colunas e reveja toda a animação antes de exportar.

Ideal para
Relações ponderadas são desenhadas enquanto os nós ligados se acomodam numa rede relaxada.
Colunas obrigatórias
OrigemDestinoPeso
O que cada linha representa
Uma ligação dirigida da Origem ao Destino. O peso controla a força da ligação e o destaque do nó.

Fluxo em três passos

  1. 1

    Mantenha os nomes e a ordem das colunas mostrados acima.

  2. 2

    Adicione uma observação por linha e mantenha nomes, unidades e períodos consistentes.

  3. 3

    Pré-visualize todos os frames e ajuste rótulos, densidade e ritmo.

Rede de forçasExemplo CSV localizado
Origem,Destino,Peso
Produto,Design,8
Produto,Engenharia,10
Produto,Pesquisa,6
Design,Marca,4
Design,Crescimento,5
Engenharia,Dados,7
Engenharia,Plataforma,9
Pesquisa,Dados,5
Crescimento,Vendas,6
Vendas,Suporte,4
Plataforma,Suporte,5
Dados,Insights,7
Insights,Crescimento,3
O que cada linha representa

Crie com a estrutura de dados certa

Use este esquema pronto para gráficos como ponto de partida. Substitua as linhas de exemplo, mantenha as colunas e reveja toda a animação antes de exportar.

Ideal para
Barras de projeto constroem-se numa linha do tempo comum com progresso e tarefas reveladas em sequência.
Colunas obrigatórias
TarefaInícioFimProgresso
O que cada linha representa
Uma tarefa com início e fim numéricos e progresso de 0 a 100. O fim deve ser maior que o início.

Fluxo em três passos

  1. 1

    Mantenha os nomes e a ordem das colunas mostrados acima.

  2. 2

    Adicione uma observação por linha e mantenha nomes, unidades e períodos consistentes.

  3. 3

    Pré-visualize todos os frames e ajuste rótulos, densidade e ritmo.

Linha do tempo de Gantt animadaExemplo CSV localizado
Tarefa,Início,Fim,Progresso
Pesquisa,0,3,100
Estratégia,1,5,92
Design UX,3,8,78
Protótipo,5,10,65
Engenharia,7,15,48
Garantia de qualidade,13,17,32
Lançamento,16,20,12
O que cada linha representa

Siga o fluxo

Faça os passos por ordem para um gráfico novo, ou use-os como lista de revisão de uma animação existente.

  1. 01

    Entenda a intenção local

    Confirme se a pessoa procura tutorial, modelo, configuração de exportação ou exemplo de relatório antes de escolher o gráfico.

  2. 02

    Prepare um CSV substituível

    Use uma única linha de cabeçalhos, rótulos curtos, unidades consistentes e remova totais ou notas que quebrem o exemplo.

  3. 03

    Escolha o padrão de gráfico

    Comece pela pergunta: ranking, tendência, comparação, parte do total, fluxo ou relação. Use Linha do tempo de bolhas em movimento quando essa relação ficar clara.

  4. 04

    Escreva a conclusão visível

    Inclua conclusão, unidade e período perto do gráfico para que o frame final funcione em pesquisa, redes ou relatórios.

  5. 05

    Ajuste o movimento para leitura

    Desacelere em líderes, cruzamentos, anomalias e valores finais. A animação deve orientar, não decorar.

  6. 06

    Exporte conforme o destino

    Crie MP4 ou WebM para movimento e PNG para PDFs, emails, prévias e contextos com movimento reduzido.

Experimente estes modelos

Compare o movimento e a leitura antes de se comprometer com um formato. Cada exemplo abre como gráfico editável baseado em dados.

TENDÊNCIA · PRÉ-VISUALIZAÇÃO AO VIVO

Linha do tempo de bolhas em movimento

2021Norte · 2021 · X 22 · Y 64 · 38Norte38Sul · 2021 · X 48 · Y 36 · 62Sul62Leste · 2021 · X 71 · Y 72 · 44Leste44Oeste · 2021 · X 84 · Y 28 · 26Oeste262021202220232024
LIVELYCHARTDê vida aos dados
tendência

Linha do tempo de bolhas em movimento

As bolhas deslocam-se, mudam de tamanho e reagrupam-se entre períodos para revelar mudanças multivariadas.

Usar este modelo
PARTICIPAÇÃO · PRÉ-VISUALIZAÇÃO AO VIVO

Sunburst animado

Produto: 82ProdutoNúcleo: 50NúcleoPesquisa: 28PesquisaEspaço de trabalho: 22Espaço de trabalhoCrescimento: 32CrescimentoAutomação: 18AutomaçãoInsights: 14InsightsServiços: 48ServiçosConsultoria: 21ConsultoriaEstratégia: 12EstratégiaPesquisa: 9PesquisaEntrega: 27EntregaLançamento: 16LançamentoSuporte: 11SuporteParceiros: 21ParceirosPlataforma: 21PlataformaNuvem: 13NuvemDados: 8Dados151
LIVELYCHARTDê vida aos dados
participação

Sunburst animado

Anéis aninhados expandem-se do centro para mostrar a composição hierárquica e a contribuição de cada ramo.

Usar este modelo
COMPARAÇÃO · PRÉ-VISUALIZAÇÃO AO VIVO

Rede de forças

Produto → Design: 8Produto → Engenharia: 10Produto → Pesquisa: 6Design → Marca: 4Design → Crescimento: 5Engenharia → Dados: 7Engenharia → Plataforma: 9Pesquisa → Dados: 5Crescimento → Vendas: 6Vendas → Suporte: 4Plataforma → Suporte: 5Dados → Insights: 7Insights → Crescimento: 3ProdutoDesignEngenhariaPesquisaMarcaCrescimentoDadosPlataformaVendasSuporteInsights
LIVELYCHARTDê vida aos dados
comparação

Rede de forças

Relações ponderadas são desenhadas enquanto os nós ligados se acomodam numa rede relaxada.

Usar este modelo
TENDÊNCIA · PRÉ-VISUALIZAÇÃO AO VIVO

Linha do tempo de Gantt animada

048121620PesquisaPesquisa: 0—3 · 100%100%EstratégiaEstratégia: 1—5 · 92%92%Design UXDesign UX: 3—8 · 78%78%ProtótipoProtótipo: 5—10 · 65%65%EngenhariaEngenharia: 7—15 · 48%48%Garantia de qualidadeGarantia de qualidade: 13—17 · 32%32%LançamentoLançamento: 16—20 · 12%12%
LIVELYCHARTDê vida aos dados
tendência

Linha do tempo de Gantt animada

Barras de projeto constroem-se numa linha do tempo comum com progresso e tarefas reveladas em sequência.

Usar este modelo

Casos relacionados

Perguntas frequentes

Para quem é o guia Criar bolhas dinâmicas, sunbursts, redes e Gantt?

Para equipas que transformam CSV ou planilhas em gráficos animados reutilizáveis para relatórios, páginas de produto, redes ou apresentações.

Com que gráfico devo começar?

Comece pelo modelo Linha do tempo de bolhas em movimento se combinar com a relação dos dados. Se a pergunta mudar, troque o modelo antes do design.

Que formato devo exportar?

MP4 para compatibilidade, WebM para web, GIF apenas para loops curtos sem áudio e PNG como frame final de fallback.

Pronto para
fazer os dados se moverem?

Abrir o estúdio