bar chart (simples)

01
hackerclubes ativos por região
número de clubes em maio/2026
01223354642sudeste28nordeste35sul18norte22centro

demonstração · dados fictícios

quando usar

  • comparar valores entre categorias
  • ranking (ordenado decrescente)
  • 5-30 categorias

quando NÃO usar

  • séries temporais contínuas — usa line
  • mais de 30 itens — usa horizontal scrollable
  • porcentagens de um todo — usa stacked bar

bar chart (agrupado)

02
alunos por programa · 2025 vs 2026
evolução por programa
600 400 200 0 hackerclubesinclusãominasmão massa
20252026

demonstração

quando usar

  • comparar 2-3 subcategorias por categoria principal
  • comparação ano sobre ano

quando NÃO usar

  • mais de 3 subcategorias — vira mosaico
  • categorias com escalas muito diferentes

bar chart (empilhado)

03
composição de horas por atividade
por programa
janfevmarabr
oficinasmentoriaeventos

demonstração

quando usar

  • composição (parte do todo) por categoria
  • comparar tamanho total + subcategorias

quando NÃO usar

  • se quer comparar valores absolutos das subcategorias entre si — usa grouped
  • muitas subcategorias — fica ilegível

line chart

04
alunos matriculados · evolução 2026
crescimento mensal
0160319478638janfevmarabrmaijunjulagoset
alunos

demonstração

quando usar

  • evolução ao longo do tempo
  • comparar tendências entre 2-5 séries
  • dados contínuos com muitos pontos

quando NÃO usar

  • categorias discretas (não-temporais) — usa bar
  • 1 ponto único — usa big number
  • mais de 5 séries — escolhe 2-3 destaque + faded rest

line chart (multi-série)

05
alunos por região · 2026
crescimento comparativo
0110220330440janfevmarabrmaijunjulagoset
sudestenordestesul

demonstração

quando usar

  • comparar evolução de 2-5 grupos paralelos
  • ver convergência ou divergência ao longo do tempo

quando NÃO usar

  • mais de 5 séries — usa small multiples (grid de mini-charts)

area chart

06
oficinas realizadas · 2026
acumulado mensal
04182janfevmarabrmaijunjulagoset

demonstração

quando usar

  • mostrar volume/magnitude ao longo do tempo
  • 1 série apenas (mais que isso usa stacked area)

quando NÃO usar

  • várias séries não-stacked — área ofusca o que tá embaixo

pie / donut

07
composição de programa
5 fatias
hackerclubesinclusãominasmão massaperifa

demonstração

donut com KPI central
65% — engajamento

demonstração

quando usar

  • composição (parte do todo)
  • máximo 5 fatias
  • donut quando quer destacar uma métrica no centro

quando NÃO usar

  • 6+ fatias — usa bar ou treemap
  • valores muito próximos (difícil comparar ângulos)
  • tendência temporal

scatter plot

08
horas de oficina × alunos formados
correlação
04794

demonstração

quando usar

  • correlação entre 2 variáveis numéricas
  • identificar clusters ou outliers
  • tamanho do ponto pode codificar 3ª variável (bubble)

quando NÃO usar

  • dados categóricos
  • menos de 15-20 pontos — vira anedótico

histogram

09
distribuição de idades · alunos
frequência por faixa etária
0234770941212-143515-176018-208521-257226-304031-401841-50850+

demonstração

quando usar

  • distribuição de uma variável contínua
  • ver concentração e cauda

quando NÃO usar

  • dados categóricos — usa bar
  • poucos valores — fica trivial

heatmap

10
atividade no portal · hora × dia da semana
intensidade de acessos
segterquaquisexsábdom0003060912151821

demonstração

quando usar

  • densidade de valores em 2 dimensões
  • ver padrões em matrizes (ex: atividade por hora × dia)
  • calendar heatmap

quando NÃO usar

  • categorias sem ordem natural
  • poucas células — usa tabela

treemap

11
orçamento por programa
alocação 2026
hackerclubes 45% inclusão tech 25% minas 15% mão na massa 10% perifa 5%

demonstração

quando usar

  • hierarquia + proporção
  • quando quer mostrar muitos níveis de uma estrutura
  • alocação de recursos por categoria

quando NÃO usar

  • dados não-hierárquicos — usa bar
  • poucas categorias — usa pie

big number / KPI tile

12
alunos · mai/2026
2.847
↑ 18% vs abr
hackerclubes ativos
145
↑ 6 novos
churn mensal
3,2%
↓ -0,5pp

quando usar

  • destacar uma métrica única
  • comparação rápida (delta vs período anterior)
  • topo de dashboard

quando NÃO usar

  • se precisar de contexto histórico — adiciona sparkline
  • métricas não-quantitativas

sparkline

13
acessos · últimos 30 dias
14.523
↑ 22%

quando usar

  • tendência inline em pouco espaço
  • ao lado de KPI ou em linha de tabela
  • mostrar shape sem precisão

quando NÃO usar

  • se precisar de valores exatos — usa line tradicional