Blocos de análises e gráficos
Esta página é um resumo rápido dos treze blocos de gráfico e KPI — cada um também tem sua própria página dedicada com a lista completa de campos e exemplos práticos, vinculada ao final de cada seção abaixo.
Treze blocos de gráfico e KPI para contar uma história de dados dentro do próprio e-mail — um resumo semanal, um recapitulativo de vendas, um relatório que seus destinatários não precisam clicar para ler. Eles vivem na mesma seção Conteúdo da paleta de inserção que todos os outros blocos; não há uma categoria "Análises" separada.
Algumas coisas são verdadeiras para todo gráfico dessa família, então são ditas uma vez aqui em vez de treze vezes abaixo:
- Todo gráfico é renderizado como uma única imagem gerada no servidor — sem biblioteca de gráficos no lado do cliente, sem JavaScript — com uma tabela de dados visível logo ao lado. A tabela não é uma nota de rodapé nem uma reflexão tardia de acessibilidade: são os mesmos números da imagem, em HTML simples, e é o que torna o gráfico realmente utilizável em clientes somente texto, caixas de entrada que bloqueiam imagens e leitores de tela. Nunca é opcional.
- Os números de um gráfico são fixados no momento do envio ou da exportação — a mesma convenção "precisos no momento do envio" do prazo final do cronômetro de contagem regressiva ou do selo de estoque de um bloco de produto, não um widget que se atualiza ao vivo. (A única exceção: um gráfico vinculado aos próprios resultados de resposta de uma campanha lê os dados ao vivo no momento da renderização — veja Vinculando gráficos a dados reais.)
- Nunca há gráficos com eixo duplo. Duas medidas de escalas diferentes são dois blocos de gráfico lado a lado, não um gráfico fingindo ter dois eixos y.
Scorecard de KPI
Um grande número para uma métrica de destaque — receita, cadastros, o que for que o e-mail estiver reportando.
- Campos: um rótulo, um valor com um formato (número simples, moeda ou porcentagem), um valor anterior opcional para mostrar um Δ em relação a ele, e um sparkline opcional.
- A direção do Δ (para cima/para baixo/estável) é algo que você define, não algo inferido de os números terem subido — assim você mantém o controle sobre o que conta como boa notícia.
- O sparkline é uma pequena imagem de tendência; o rótulo/valor/Δ abaixo dele é sempre texto HTML real, nunca dependente da renderização da imagem.
Gráfico de barras
Barras verticais ou horizontais, com até 3 séries autorais.
- Passando de cerca de 8 categorias, o gráfico abandona os rótulos de valor diretos em cada barra em favor de um eixo compartilhado com linhas de grade — ler números exatos em uma dúzia de barras rotuladas deixa de ser legível antes disso, então a tabela de dados assume como a fonte precisa.
Gráfico de linha/área
Mesmo formato de autoria linha a linha do gráfico de barras — categorias nas linhas, até 3 séries nas colunas — mais um alternador filled para a variante de gráfico de área.
- Os marcadores de ponto em cada valor de dado começam a se tornar mais esparsos a partir de cerca de 20 pontos, para que a linha não vire uma fileira sólida de pontos; a linha traçada, o eixo compartilhado e a tabela de dados continuam carregando a tendência a partir daí.
Gráfico de pizza/rosca
Um valor por categoria, desenhado como uma pizza ou (no modo rosca) um anel com um rótulo central opcional para um número estilo KPI no meio.
- Passando de 8 fatias, as menores se agrupam em uma única fatia "Outros" em vez de o gráfico ficar fino demais para ler — a legenda e a tabela de dados mostram o mesmo agrupamento.
Gráfico de dispersão/bolhas
Pontos X/Y, com uma coluna series opcional para agrupar pontos em várias cores e uma coluna size opcional para transformá-lo em um gráfico de bolhas.
- A identidade da série vem do que você digitar na coluna Series — deixe em branco e todo ponto compartilha o próprio título do bloco como sua única série.
Histograma
Agrupa uma coluna de valores brutos em faixas automaticamente — forneça números individuais, não faixas pré-contadas, e ele faz o agrupamento por você.
- Você controla aproximadamente quantas faixas mirar; se todo valor que você digitou for idêntico, ele se reduz a uma única faixa em vez de desenhar dezenove vazias.
Mapa de calor
Uma grade de linhas × colunas de valores, sombreada em uma rampa de cores sequencial do claro ao escuro.
- As células mostram seu valor exato como texto somente enquanto a grade permanecer pequena o suficiente para ler rapidamente — depois disso, a própria rampa (mais a tabela de dados sempre visível) carrega os números em vez de espremer texto em células minúsculas. Uma combinação verdadeiramente ausente (nenhuma linha para aquele par linha/coluna) é renderizada como um cinza distinto de "sem dados" em vez de parecer um zero.
Funil
Valores de estágio ordenados — visitas → cadastros → compras, esse tipo de sequência — cada um mostrado como uma porcentagem do primeiro estágio.
- Como o significado de um funil depende inteiramente da ordem em que você digitou os estágios, não há como agrupar um estágio em excesso em um bucket "Outros" como fazem a pizza/o treemap — um estágio além do limite simplesmente não é desenhado. A tabela de dados adiciona tanto "porcentagem do primeiro estágio" quanto "porcentagem do estágio anterior" (a queda passo a passo), que a imagem sozinha não mostra.
Cascata
Um gráfico de total corrente — valor inicial, depois uma sequência de barras de aumento/diminuição, opcionalmente chegando a uma barra de "total" autoral na metade ou no final.
- As barras de aumento/diminuição/total sempre usam as mesmas três cores reservadas, para que uma cascata seja lida de forma consistente em todo e-mail, em vez de depender de como você escolheu as cores da última vez. Assim como o funil, uma barra em excesso é descartada em vez de agrupada, já que a matemática de total corrente depende da ordem autoral.
Medidor
Uma única métrica mostrada em relação a faixas de limite bom/atenção/grave que você define — um mostrador estilo ponteiro, não um gráfico baseado em linhas.
- O único bloco dessa família sem uma tabela de dados abaixo dele, pelo mesmo motivo do scorecard de KPI: o valor e seu status já são texto HTML real ao lado da imagem, não números trancados dentro de uma figura.
Radar
Uma comparação multieixo — até 3 séries plotadas em eixos compartilhados, útil para comparar categorias em várias dimensões ao mesmo tempo (por exemplo, um produto avaliado em preço/qualidade/velocidade/suporte).
- Precisa de pelo menos 3 eixos para sequer desenhar como um polígono — menos que isso mostra o mesmo placeholder de "adicione mais dados" que um gráfico vazio recebe. Diferente do resto da família, isso é um piso além de um teto (limitado a 8 eixos).
Treemap
Blocos proporcionais dimensionados por valor, organizados para preencher um retângulo (um layout "squarified") em vez dos ângulos da pizza — o mesmo formato de autoria de um valor por categoria do gráfico de pizza, apenas uma forma diferente de comparar a participação de um todo.
- Segue a mesma regra de agrupamento após 8 fatias do gráfico de pizza, já que compartilha o mesmo preparo de dados subjacente.
Sankey
Fluxo proporcional entre nós nomeados — linhas De, Para e Valor, por exemplo origem de tráfego → página de destino → conversão.
- Os nós não são autorais diretamente; eles são derivados de quaisquer rótulos que se repetem em suas linhas De/Para, e sua posição da esquerda para a direita é calculada automaticamente a partir da direção do fluxo.
- Além do limite de nós ou links, um nó em excesso é descartado, não agrupado — mesclar dois pontos finais de fluxo distintos em um só representaria mal o que o diagrama está mostrando, diferente da fatia "Outros" de um gráfico de pizza. A tabela de dados ainda lista toda linha que você autorou, independentemente de ter entrado no diagrama desenhado, então nada que você digitou desaparece silenciosamente de vista.
Vinculando a dados reais
Scorecard de KPI, gráfico de barras, gráfico de linha e gráfico de pizza — e somente esses quatro — podem se vincular a uma fonte de dados conectada ou aos próprios resultados de resposta de uma campanha passada, em vez de números que você digita manualmente. Também há um iniciador de projeto Dashboard de um clique que gera uma linha de KPI e um gráfico de barras juntos. Veja Vinculando gráficos a dados reais para saber como.