Um Mapa Wardley é um framework poderoso usado para estratégia de negócios para visualizar cadeias de valor e mapear a evolução de componentes. Introduzido como um recurso nativo na versão Mermaid v11.14.0+, o wardley-betamotor permite que equipes de estratégia, arquitetos e gerentes de produtos mapeiem ambientes de mercado usando apenas texto. Ao posicionar componentes técnicos em um espaço de coordenadas bidimensional, as equipes podem analisar visualmente dependências na cadeia de valor, identificar inércia de mercado e tomar decisões estruturadas entre construir ou adquirir.
Compreendendo o Sistema de Grade de Coordenadas
Diferentemente dos fluxogramas livres padrão, cada componente em um Mapa Wardley é plotado em um espaço bidimensional rígido baseado em duas coordenadas decimais que variam de 0.0 a 1.0:
- Visibilidade (Eixo Y / Primeira Coordenada): Mede o quão visível ou valioso um componente é para um usuário final. Um valor de
1.0representa um ponto de contato direto com o usuário (maior visibilidade), enquanto0.0representa infraestrutura fundamental oculta. - Evolução (Eixo X / Segunda Coordenada): Mede o nível de maturidade de um ativo de mercado. Ele se desloca da esquerda para a direita através de quatro fases evolutivas distintas: Gênese (0.0), Personalizado (0.25), Produto/Aluguel (0,5), e Commodity/Utilidade (de 0,75 a 1,0).
Estrutura Básica da Sintaxe
Todo diagrama começa com o wardley-betacabeçalho de declaração. Em seguida, você estabelece pontos de ancoragem do usuário com o ancorarpalavra-chave, mapeie os blocos de infraestrutura operacional com o componentepalavra-chave, e desenhe relações entre eles usando setas direcionais.
wardley-beta
título Mapa Estratégico Simples
ancorar Cliente [0.9, 0.5]
componente Website [0.7, 0.4]
Cliente -> Website

Referência de Sintaxe
A tabela abaixo detalha os blocos principais semânticos e parâmetros necessários para estruturar um Mapa de Wardley dentro do interpretador central do Mermaid.
| Componente de Sintaxe | Tipo Requisito | Descrição e Regras de Uso |
|---|---|---|
| Declaração | Identificador de Palavra-Chave | Inicializa a tela de mapeamento da grade estratégica. Deve usar exatamente o wardley-betastring de bloco. |
| Título | String Simples/Entre Aspas | Um título opcional impresso centralizado na parte superior da área de trabalho da grade do diagrama. |
| Limites de Tamanho | Pixels entre Colchetes | Um parâmetro opcional usado para substituir a grade padrão de largura e altura da tela: tamanho [1200, 700]. |
| Nó de Ancoragem | Palavra-Chave + Rótulos | Estabelece o usuário ou comprador principal no topo da sua matriz da cadeia de valor. Requer limites de coordenadas: ancorar Comprador [Y, X]. |
| Nó de Componente | Palavra-chave + Rótulos | Declara um recurso técnico independente ou bloco de ativo. Exige limites de posição exatos: componente API Central [Y, X]. |
| Caminhos de Ligação | Operador de Conexão | Desenha dependências diretas e estruturadas para baixo ou horizontalmente através dos nós por meio do -> regra de sintaxe. |
Marcadores de Ação Estratégica (Construir, Comprar, Terceirizar, Mercado)
Para documentar explicitamente planos de execução estratégica, o Mermaid.js permite anexar envoltórios de ação a componentes individuais. Essas ações colocam formas distintas no nó de coordenadas para transmitir escolhas arquitetônicas instantaneamente:
| Modificador de Ação | Ícone de Forma Renderizada | Mapeamento de Intenção Estratégica |
|---|---|---|
(construir) |
Marcador Triangular | O componente é único, de alto risco ou desenvolvido internamente para diferenciação competitiva. |
(comprar) |
Marcador Diamante | O componente é obtido ou licenciado de um fornecedor de produto de terceiros. |
(terceirizar) |
Marcador Quadrado | A gestão do componente é totalmente delegada para um grupo externo de fornecedores. |
(mercado) |
Marcador Circular | O componente é uma utilidade amplamente disponível ou bem público. |
Exemplo de Implementação de Sintaxe:
wardley-beta
component Interface Personalizada [0.80, 0.30] (construir)
component Processador de Pagamentos [0.45, 0.65] (comprar) 
Plano Prático do Mundo Real: Cadeia de Valor de uma Loja de Café Artesanal
Este plano abrangente rastreia um modelo de negócios de loja em expansão. Ele descreve uma arquitetura completa do mapa — configurando um limite de tamanho personalizado maior, estabelecendo âncoras de negócios, definindo marcadores especializados de construir/comprar e traçando links de dependência em todas as fases dos eixos.
wardley-beta
title "Mapa Estratégico de Negócios do Café"
size [1100, 650]
%% Âncoras Principais de Negócios
anchor Proprietário da Franquia [0.95, 0.55]
anchor Cliente Final [0.90, 0.65]
%% Camadas de Componentes Operacionais
component Café Especializado [0.75, 0.45] (construir)
component Terminal de Pontos de Venda [0.60, 0.60] (comprar)
component Água Quente Automatizada [0.45, 0.75] (mercado)
component Energia da Rede Elétrica [0.15, 0.90] (terceirizar)
%% Caminhos de Vinculação em Cadeia de Dependência
Cliente Final -> Café Especializado
Proprietário da Franquia -> Terminal de Pontos de Venda
Café Especializado -> Água Quente Automatizada
Terminal de Pontos de Venda -> Energia da Rede Elétrica
Água Quente Automatizada -> Energia da Rede Elétrica 
Dica de Sintaxe: Ao declarar arrays de coordenadas, lembre-se de que o valor do eixo vertical Y (Visibilidade) vem *primeiro*, e o valor do eixo horizontal X (Evolução) vem *segundo* [Visibilidade, Evolução]. Inverter essas posições é a causa mais comum de os componentes se agruparem incorretamente na borda inferior da sua tela do mapa.
Armadilhas Comuns de Sintaxe e Restrições do Sistema
Ao compilar espaços da cadeia de valor, tenha em mente essas três limitações de layout para garantir que seu texto seja renderizado corretamente:
- Faixas Estritas de Coordenadas: As posições devem estar exatamente dentro dos colchetes decimais entre
0.0e1.0. Usar pixels inteiros absolutos (como[400, 200]) em vez de proporções de layout dentro dos argumentos dos nós causará um erro de execução no sistema. - Ordem de Declaração para Links: Para um renderização de layout limpa, certifique-se de que todos os seus
âncoraecomponentesejam declarados e atribuídos coordenadas *antes* de escrever quaisquer linhas de relacionamento entre nós (A -> B). Vincular a uma etiqueta não declarada pode comprometer a posição dos eixos do mapa. - Enclaves de Espaço de Etiquetas: Se um nome de componente contiver espaços, símbolos ou vírgulas, certifique-se de que está escrito com precisão. Reutilizar nomes de string incorretos dentro de caminhos de conexão criará um nó inteiramente novo e não posicionado na tela da grade.