Gráfico de quadrantes
Priorize com uma matriz 2×2
O que é um Gráfico de quadrantes?
Um gráfico de quadrantes posiciona elementos em dois eixos — esforço vs impacto, urgência vs importância, risco vs recompensa. É a ferramenta clássica de priorização para produto, estratégia e retrospetivas.
Os gráficos de quadrantes são artefactos de decisão: o último slide de um workshop de priorização, a imagem de um memorando de estratégia, a retrospetiva em que uma equipa separa o que quer manter. O que fazem bem é obrigar a uma posição — nada pode ficar «algures no meio» sem que isso se veja. O que escondem é o raciocínio: duas pessoas põem o mesmo elemento em quadrantes diferentes, e o gráfico regista o resultado, nunca o argumento. Os eixos não trazem números, apenas os seus dois rótulos de extremidade.
Exemplo em tempo real
quadrantChart
title Feature prioritization
x-axis Low effort --> High effort
y-axis Low impact --> High impact
quadrant-1 Plan carefully
quadrant-2 Do first
quadrant-3 Skip
quadrant-4 Quick wins
Public sharing: [0.3, 0.85]
Realtime collab: [0.85, 0.75]
Dark mode: [0.2, 0.4]Quando usar
Erros frequentes
Coordenadas fora do intervalo 0 a 1
Escrever A: [3, 8] é um erro léxico e não um ponto cortado: ambos os valores têm de ficar entre 0 e 1. Pontuou os elementos de zero a dez? Divida por dez antes de escrever o gráfico.
Os números dos quadrantes não são a ordem de leitura
O quadrant-1 é o canto superior direito, e depois segue-se o sentido anti-horário: quadrant-2 superior esquerdo, quadrant-3 inferior esquerdo, quadrant-4 inferior direito. Rotule-os a partir dos cantos da imagem, não da ordem por que os leria.
Um eixo sem a sua seta
x-axis Effort é válido e desenha um único rótulo na ponta esquerda — sem erro, apenas um gráfico que ninguém consegue interpretar. Escreva x-axis Low effort --> High effort para que ambos os extremos fiquem nomeados.
Sintaxe básica
quadrantChart
x-axis Low --> High
y-axis Low --> High
Item A: [0.3, 0.8]quadrantChart title Feature prioritizationO gráfico é sempre uma divisão 2×2 no ponto médio de ambos os eixos. O título é o que diz ao leitor que decisão esta imagem em particular está a registar.
x-axis Low effort --> High effort y-axis Low impact --> High impactCada eixo recebe um rótulo de início e, a seguir à seta, um rótulo de fim. Indique os dois: com um só rótulo, o leitor tem de adivinhar em que sentido corre a escala.
Public sharing: [0.3, 0.85] radius: 12, color: #4f46e5Um ponto pode trazer o seu próprio raio, preenchimento e cor de traço depois das coordenadas — o suficiente para destacar um elemento sem acrescentar uma legenda.
classDef hot color: #ff0000, radius: 10 Realtime collab:::hot: [0.85, 0.75]O classDef nomeia um estilo de ponto uma vez e o ::: aplica-o, e é assim que se marca um grupo inteiro — itens comprometidos, concorrentes, riscos — de forma coerente.
Perguntas sobre este diagrama
Como posiciono os elementos com precisão?
Cada elemento recebe coordenadas [x, y] entre 0 e 1, pelo que «Feature A: [0.2, 0.9]» cai no quadrante de baixo esforço e alto impacto.
Posso renomear os quadrantes?
Sim — de quadrant-1 a quadrant-4 aceitam rótulos personalizados como «Fazer primeiro» ou «Vitórias rápidas», e ambos os eixos aceitam rótulos de início e de fim.
Posso colar um gráfico de quadrantes no Google Slides ou no PowerPoint?
Exporte PNG em 2× ou 4× e cole, ou SVG se a ferramenta aceitar vetores, para os rótulos dos eixos se manterem nítidos em qualquer zoom. Volte a exportar depois de cada repriorização, em vez de mexer nos pontos à mão.
Posso deslocar o cruzamento dos eixos para fora do centro?
Não. A divisão é sempre no ponto médio de ambos os eixos, por isso «impacto alto» começa em 0,5 seja qual for o aspeto dos seus dados. Reescale as suas próprias pontuações antes de traçar, quando o limiar interessante está noutro sítio.
Quantos elementos cabem antes de os rótulos se sobreporem?
O Mermaid não desloca os rótulos para evitar colisões, por isso o teto prático anda pelos quinze pontos, e menos quando vários partilham um canto. Afaste ligeiramente as coordenadas, divida o gráfico por tema, ou aumente o chartWidth para ganhar espaço sem mexer em nenhum ponto.
Como faço o gráfico maior?
Ponha o tamanho dentro de um bloco quadrantChart, na diretiva init da primeira linha: %%{init: {"quadrantChart": {"chartWidth": 600, "chartHeight": 600}}}%%. A predefinição é 500 por 500. Fora desse bloco, as duas chaves são ignoradas, e é por isso que os nomes longos continuam a transbordar.
Gráfico de quadrantes ou outro tipo de diagrama?
Gráfico de quadrantes ou gráfico circular?
O de quadrantes regista onde cada elemento fica em duas escalas e mais nada: todos os pontos têm o mesmo tamanho, a menos que defina um radius, por isso um elemento que vale dez vezes outro parece igual a ele. Quando a mensagem é a dimensão de cada elemento, desenhe um gráfico circular.
Gráfico de quadrantes ou jornada do utilizador?
Ambos pontuam, mas não as mesmas coisas. A jornada pontua os passos de um percurso, por ordem, com um número em cada; o de quadrantes pontua elementos independentes em duas escalas e não tem ordem nenhuma. Se reordenar os seus elementos mudasse o sentido, precisa da jornada.
Crie já o seu Gráfico de quadrantes
Descreva-o em linguagem natural — a IA escreve o código Mermaid por si.
Abrir o Mermaid Studio