> [Site index](https://perfectvector.com/llms.txt) — available pages and descriptions.

# Figuras científicas: preserve o significado sem cor

> Confira diagramas científicos em cinza com rótulos, formas e estilos de linha. Use um SVG completo para preservar a identidade das condições sem mudar os dados.

Source: https://perfectvector.com/pt-BR/blog/scientific-figure-color-redundancy

Language: pt-BR
Author: Irene Kim
Published: 2026-10-15T08:00:00+09:00

Para um diagrama científico funcionar sem cor, dê a cada condição importante uma identidade visível além da tonalidade. Adicione rótulos diretos, diferencie símbolos ou estilos de linha adequados e depois inspecione uma cópia em tons de cinza no tamanho de exibição pretendido. Outra paleta pode ajudar, mas não consegue nomear uma condição sem rótulo.

Este guia trata de diagramas explicativos categóricos: esquemas que mostram duas condições, grupos ou rotas. Ele usa um arquivo SVG (Scalable Vector Graphics) original de duas linhas sem dados experimentais. Mapas de calor contínuos, micrografias e gráficos de medidas precisam de tratamento próprio atento aos dados; não trace suas marcas como novas formas para deixá-los aparentemente mais claros.

## Decida o que a cor comunica ao leitor

Comece com a origem editável, a legenda da figura e a menor reprodução pretendida. Liste as distinções que o leitor precisa recuperar: a condição à qual um símbolo pertence, o destino de uma rota ou o painel que um rótulo descreve.

Depois esconda mentalmente a cor. Se as instruções virarem “siga a linha laranja” ou “compare os círculos azuis”, substitua essa dependência por nomes que o leitor possa localizar na figura. Use nomes significativos de condições em uma submissão real. “Condição A” e “Condição B” abaixo são nomes provisórios para demonstrar o layout.

A [orientação do W3C sobre uso da cor](https://www.w3.org/WAI/WCAG21/Understanding/use-of-color.html) pede uma pista visível, como texto ou forma, quando a cor transmite informação. É uma orientação de acessibilidade na web, não um teste de aceitação de periódico científico. O mesmo princípio de design é útil aqui: preserve a distinção por outra pista.

## Dê uma segunda identidade a cada condição

Use o menor número de pistas que torne o mapeamento claro. Um rótulo curto ao lado de cada rota pode bastar para um esquema simples. Marcadores repetidos ou conectores de estilos diferentes podem ajudar a seguir uma rota longa sem voltar à legenda.

| Condição | Cor neste exemplo | Símbolo   | Conector  | Rótulo direto |
| -------- | ----------------- | --------- | --------- | ------------- |
| A        | Azul              | Círculo   | Contínuo  | Condição A    |
| B        | Laranja           | Triângulo | Tracejado | Condição B    |

Mantenha esse mapeamento consistente entre os painéis. Se um triângulo já representa um componente específico na sua área, preserve esse significado e escolha outra pista. Da mesma forma, não reaproveite uma linha tracejada que já signifique uma conexão hipotética. Codificação redundante significa expressar a mesma identidade por mais de uma pista; não significa atribuir sentidos conflitantes a símbolos conhecidos.

Escolha uma paleta adequada ao destino e mantenha os rótulos legíveis sobre o fundo. As [especificações de figuras da Nature](https://research-figure-guide.nature.com/figures/preparing-figures-our-specifications/) pedem uma paleta acessível e mostram caixas coloridas de legenda acompanhadas de texto preto. Também desaconselham padrões e excesso de decoração. Isso favorece rótulos simples e símbolos com propósito em vez de preencher todo objeto com hachuras.

![Ilustração comparando duas condições esquemáticas identificadas apenas por cor com condições diferenciadas por rótulos, formas e estilos de conectores](https://perfectvector.com/blog/scientific-figure-color-redundancy/condition-labels-and-shapes.webp)

*Ilustração: rótulos diretos e formas ou estilos de linha diferentes fornecem pistas de identidade junto da cor. As verificações do SVG renderizado abaixo usam outro exemplo criado diretamente.*

## Experimente o SVG de duas condições

Salve este exemplo completo como `conditions.svg`. Abra no navegador ou em um editor vetorial. Ele tem fundo branco, duas linhas rotuladas e nenhuma imagem externa ou fonte importada. Os símbolos diferentes são deliberadamente genéricos; não representam um mecanismo biológico.

```xml
<svg xmlns="http://www.w3.org/2000/svg" width="600" height="240" viewBox="0 0 600 240">
  <rect width="600" height="240" fill="white"/>
  <g fill="white" stroke-width="4">
    <g stroke="#0072B2">
      <path d="M80 70H320"/>
      <circle cx="80" cy="70" r="16"/><circle cx="320" cy="70" r="16"/>
    </g>
    <g stroke="#D55E00">
      <path d="M80 170H320" stroke-dasharray="12 8"/>
      <polygon points="80,150 62,180 98,180"/><polygon points="320,150 302,180 338,180"/>
    </g>
  </g>
  <g fill="black" font-family="sans-serif" font-size="24">
    <text x="370" y="78">Condition A</text>
    <text x="370" y="178">Condition B</text>
  </g>
</svg>
```

A origem mantém os rótulos como texto. Seu `stroke-dasharray="12 8"` dá ao conector inferior um padrão repetido de traços e espaços; a [especificação de tracejado SVG](https://www.w3.org/TR/SVG2/painting.html#StrokeDashing) define como esses comprimentos seguem o caminho. Nem o rótulo nem o triângulo dependem de reconhecer o laranja.

1. Abra a versão de 600 × 240. Confirme a presença dos dois rótulos, os círculos na condição A e os triângulos na B.
2. Exporte uma cópia em cores e depois faça uma cópia em tons de cinza dessa exportação. Guarde o mestre em cores. Confira se consegue identificar as condições pelo nome e seguir seus conectores sem consultar uma descrição de cores.
3. Faça uma cópia menor da origem com `width="300"` e `height="120"`, mantendo o `viewBox` igual. Repita as duas exportações. Isso verifica uma redução, não um tamanho mínimo universal.
4. Inspecione o arquivo que você realmente colocará no manuscrito ou slide. Confirme que rótulos, símbolos e estilos de conectores sobrevivem à exportação e a qualquer redimensionamento posterior.

Para um controle deliberadamente mais fraco, remova o grupo de texto, substitua os triângulos por círculos nas mesmas posições e remova `stroke-dasharray`. Ele ainda tem duas linhas coloridas. A questão é se os nomes das condições continuam disponíveis, não se os dois tons de cinza parecem idênticos por acaso.

Renderizamos as duas versões com librsvg em 600 × 240 e 300 × 120 pixels e depois convertemos cada saída em tons de cinza com a ponderação RGB `0.299R + 0.587G + 0.114B`. Nas quatro versões redundantes, rótulos, distinção círculo/triângulo e conectores contínuos/tracejados permaneceram visíveis e sem cortes. O azul e o laranja do controle viraram valores de cinza diferentes, 87 e 119 em uma escala de 0–255. Por isso, não descrevemos o controle como indistinguível. A melhoria é a identidade explícita das condições, independente da tonalidade.

São verificações digitais deste SVG criado diretamente. Não testamos impressão física nem fizemos um estudo com leitores. Uma conversão em tons de cinza também não reproduz toda forma de deficiência de visão de cores. Trate-a como uma vista de inspeção junto de verificações adequadas ao público e ao periódico.

## Corrija a pista que falha no tamanho final

Se um rótulo ficar pequeno demais, abrevie com cuidado ou abra espaço para texto maior. Se os traços se juntarem e parecerem uma linha contínua, reveja o espaçamento ou use outra pista adequada. Se um marcador perder a forma, simplifique ou aumente. Confira a figura inteira após cada mudança para que a correção não crie sobreposição em outro lugar.

Para cálculos de tamanho físico, use o guia separado de [tamanho de fonte e largura de linha em figuras científicas](https://perfectvector.com/pt-BR/blog/scientific-figure-font-size-line-width). O exemplo de 300 pixels deste artigo é uma conferência de renderização na tela, não uma recomendação de largura de coluna de periódico.

Mantenha a legenda sincronizada com a arte. Troque “linha laranja” pelo nome da condição e sua pista visível, como “Condição B, conector tracejado”. Para figuras online, forneça também um texto alternativo ou legenda apropriada que descreva a comparação substantiva. Rótulos visíveis sozinhos não garantem acessibilidade para quem não consegue ver a figura.

## Preserve a ciência ao editar a apresentação

Revise gráficos de medidas na origem que os gera e reexporte preservando os valores subjacentes. Para micrografias, guarde as imagens originais e siga as regras de processamento do periódico. A [política de integridade de imagens da Nature](https://www.nature.com/nature/editorial-policies/image-integrity) exige que a imagem final represente os dados originais com precisão e descreve requisitos de divulgação do processamento. Redesenhar uma imagem até parecer mais arrumada não substitui esse fluxo.

Se você só tiver um esquema raster separado, o [fluxo de diagrama científico para SVG do PerfectVector](https://perfectvector.com/pt-BR/scientific-diagram-to-svg) pode ajudar a recuperar formas editáveis. Confira a prévia e desbloqueie o resultado para editar e exportar o SVG. Compare cada conexão e símbolo recuperado com a origem e refaça os rótulos como texto quando necessário. Uma forma recuperada só é útil se seu significado científico sobreviver. Se você já tem arte editável, revise diretamente; [mudar cores SVG](https://perfectvector.com/pt-BR/blog/how-to-change-svg-color) cobre essa etapa de edição mais restrita.

Termine quando cada condição tiver um nome inequívoco, suas pistas sem cor continuarem legíveis na figura inserida e a legenda estiver de acordo. Se a falta de origem vetorial bloquear um esquema separado, [recupere suas formas com o PerfectVector](https://perfectvector.com/pt-BR/scientific-diagram-to-svg) e repita a conferência de identidade no resultado exportado.

## Perguntas frequentes

**Uma paleta adequada para daltonismo basta para um diagrama científico?**
Uma paleta apropriada ajuda, mas a identidade das condições também precisa estar disponível por rótulos diretos ou outras pistas adequadas. Confira a figura completa no tamanho pretendido, incluindo a legenda.

**Uma conferência em tons de cinza prova que a figura é acessível?**
Não. Ela verifica uma renderização sem tonalidade. Não cobre toda diferença de visão de cores, baixa visão, acesso por leitor de tela ou requisitos de um periódico específico.

**Devo mudar todos os meus símbolos científicos para círculos e triângulos?**
Não. O exemplo usa símbolos genéricos provisórios. Preserve símbolos e estilos de linha que já tenham significado científico e adicione rótulos ou outra pista compatível.

## Fontes

1. [W3C — Entendendo o uso da cor](https://www.w3.org/WAI/WCAG21/Understanding/use-of-color.html) — Explica alternativas visíveis à cor e os limites desse critério de acessibilidade.
2. [Nature — Preparação de figuras: nossas especificações](https://research-figure-guide.nature.com/figures/preparing-figures-our-specifications/) — Fornece as orientações citadas sobre paleta, texto de legenda e excesso de decoração em figuras da Nature.
3. [W3C — Tracejado de traços SVG](https://www.w3.org/TR/SVG2/painting.html#StrokeDashing) — Define o padrão de traços e espaços usado no exemplo completo.
4. [Nature — Integridade e padrões de imagens](https://www.nature.com/nature/editorial-policies/image-integrity) — Estabelece os limites de dados de origem e processamento que sustentam as orientações de imagem científica.

## Explore

- [Read the HTML article](https://perfectvector.com/pt-BR/blog/scientific-figure-color-redundancy)
- [Como criar um logo de uma cor preservando o design](https://perfectvector.com/pt-BR/blog/one-color-logo-negative-space.md)
- [Ícones SVG no Shopify: prepare uma marca limpa](https://perfectvector.com/pt-BR/blog/shopify-custom-svg-icon.md)
- [Product facts](https://perfectvector.com/product-facts.md)
- [FAQ](https://perfectvector.com/faq.md)
- [Pricing and credits](https://perfectvector.com/pricing.md)
