🧠 Mermaid

Mappa mentale

Organizza le idee attorno a un tema centrale

Apri questo esempio nell’editor Generane uno con l’IA

Che cos’è un Mappa mentale?

Una mappa mentale fa irradiare rami di idee da un concetto centrale. È il modo più rapido per strutturare brainstorming, scomporre argomenti, pianificare contenuti o mappare competenze — e con Mermaid è puro testo.

Le mappe mentali sono uno strumento di pensiero più che di documentazione: workshop, scalette di contenuti, definizione del perimetro di una funzionalità prima di impegnarsi. In Mermaid l’indentazione fa anche da struttura del documento, così la mappa e il futuro indice restano un unico artefatto. Il vincolo da accettare è che si tratta di un albero: una sola radice, un solo genitore per nodo, nessuna etichetta sui rami. Tutto ciò che deve convergere va in un diagramma di flusso.

Esempio dal vivo

Codice Mermaid

mindmap
  root((Product v2))
    Features
      AI generation
      Live preview
      Export
    Quality
      E2E tests
      Monitoring
    Growth
      SEO pages
      Public sharing

Esempio dal vivo

Quando usarlo

Strutturare brainstorming e risultati dei workshop

Scomporre un prodotto, un progetto o un argomento di apprendimento

Pianificare contenuti, documentazione o competenze del team

Errori frequenti

Due radici al primo livello

Una mappa mentale ha esattamente una radice. Un secondo nodo alla stessa indentazione fallisce con «There can be only one root». Se hai davvero due centri, allora sono due mappe mentali — oppure un diagramma di flusso.

Parentesi nel testo semplice di un nodo

Growth (EU) viene disegnato come «EU», perché le parentesi sono lette come delimitatore di forma smussata e il testo che le precede viene scartato. Dai un id al nodo e metti l’etichetta tra virgolette: g1["Growth (EU)"].

Tabulazioni mescolate a spazi

La gerarchia nasce solo dall’indentazione, e una tabulazione non equivale a degli spazi. Mescolarle solleva lo stesso errore «There can be only one root», che punta alla radice e non alla riga che hai rotto.

Sintassi di base

.mmd

mindmap
  root((Main idea))
    Branch A
      Leaf 1
    Branch B

mindmap root((Product v2))
La radice è esattamente una, e le doppie parentesi la disegnano come un cerchio. Tutto ciò che sta sotto è posizionato dalla sola indentazione, senza frecce da dichiarare.
Features[Squared] Live preview(Rounded)
Le parentesi attorno al testo scelgono la forma del nodo: [] quadrato, () smussato, (()) cerchio, ))(( esplosione, {{}} esagono. Usale con parsimonia, per marcare una categoria e non per decorare.
Growth ::icon(fa fa-rocket)
Una riga ::icon() sotto un nodo aggiunge un’icona presa da un font di icone caricato dalla pagina ospite, di solito Font Awesome. Senza quel font non viene disegnato nulla.
Retention:::urgent
Tre due punti agganciano una classe CSS a un nodo: è così che si evidenzia un ramo — rischi, blocchi, decisioni — senza toccare il resto della mappa.

Domande su questo diagramma

Come funziona l’indentazione nelle mappe mentali Mermaid?

La gerarchia è definita unicamente dall’indentazione: ogni livello più profondo diventa un ramo figlio. Forme come root((testo)) personalizzano l’aspetto dei nodi.

Mappa mentale o diagramma di flusso per il brainstorming?

Mappe mentali per divergere (raccogliere e raggruppare idee), diagrammi di flusso per convergere (trasformare le idee in un processo ordinato).

Posso condividere una mappa mentale con chi non usa Mermaid?

Esporta in PNG o SVG, oppure pubblica il diagramma come pagina pubblica e condividi il link. Anche GitHub renderizza le mappe mentali in Markdown, mentre gli strumenti self-hosted con una versione di Mermaid più vecchia potrebbero non conoscerne ancora la sintassi.

Posso decidere su quale lato appare un ramo?

No. La posizione è calcolata dall’albero e non esiste alcuna impostazione di lato o di angolo. Riordinare i rami nel sorgente cambia il risultato, ma non in modo prevedibile: accetta il layout, oppure passa a un diagramma di flusso.

Come aggiungo icone ai nodi di una mappa mentale?

Aggiungi una riga ::icon(fa fa-book) indentata sotto il nodo. Il font delle icone deve essere caricato dalla pagina che renderizza il diagramma; quando manca, il nodo appare semplicemente senza icona e non si rompe nulla.

Posso trasformare una mappa mentale nella struttura di un documento?

Direttamente: l’indentazione è già la struttura. Ogni livello della mappa diventa un livello di titolo o una lista annidata, ed è per questo che le mappe mentali funzionano bene per pianificare la documentazione prima di scriverla.

Mappa mentale o un altro tipo di diagramma?

Mappa mentale o linea temporale?

Guarda il primo livello. Se i rami principali sono Q1, Q2, Q3 — oppure 2024, 2025 — stai disegnando una linea temporale con qualche indentazione in più, e l’albero non aggiunge nulla. Tieni la mappa mentale quando il primo livello è fatto di temi e il significato sta nell’annidamento.

Mappa mentale o diagramma delle classi?

Una mappa mentale esprime una sola relazione: questo sta sotto quello. Non può dire che un modulo dipende da un altro, ne possiede tre o implementa un’interfaccia. Appena i riquadri hanno bisogno di campi, cardinalità o di una direzione di dipendenza, usa un diagramma delle classi.

Esplora gli altri tipi di diagrammi

🔀 Diagramma di flusso 💬 Diagramma di sequenza 🧩 Diagramma delle classi 🗄️ Diagramma entità-relazione 🔄 Diagramma degli stati 📅 Diagramma di Gantt 🥧 Grafico a torta 🌿 Grafo Git 🕰️ Linea temporale 🚶 Percorso utente 🎯 Grafico a quadranti

Crea ora il tuo Mappa mentale

Descrivilo in linguaggio naturale — l’IA scrive il codice Mermaid per te.

Apri Mermaid Studio