learn-mind-mapping-with-phoebe / Session 5 of 6
Learn Mind Mapping with Phoebe · Session 5 of 6

Maps as text

Last session you typed an outline into a box and a map appeared. That was not a trick of the bench. An indented outline and a radial map are the same tree written two ways, and the text way has a property the picture never will: when one idea moves home, one line moves, and a diff can point at it. Tonight is about keeping the text, rendering the picture when readers need one, and knowing when to ignore all of that and draw.

🟡 Medium Bring your bench outlines Laptop 45 min
0-3 · Welcome 3-18 · Indentation is the map 18-40 · Build-along: from paper to text and back 40-45 · Q&A
Part 0

Where we start

Daybreak's fourteen launch notes have now been a list, five branches, five keyword branches and one clean map with every idea in one home. Four of those shapes exist as text in session 4's bench, which means they can be copied, pasted, compared and kept. The paper map from session 1 cannot do any of those things, and that difference is the whole of tonight.

🎫 Clear all three quiz questions to stamp your passport Live = presented in the 45 minutes Self-study = the full depth, after class

★ What you walk out with tonight. Your maps as indented text you can diff, version and paste into any renderer, plus a one-line rule for when to render from text and when to draw by hand, and the honesty to follow it.

Syntax lives next door. The grammar of Mermaid's mindmap diagram, its node shapes, icons and classes, is learn-mermaid-with-phoebe session 5, linked below and not repeated here. Tonight uses exactly two lines of it: the word that names the diagram and the root. Everything after that is indentation, and indentation is what you already have.

Part 1 · covers outline grammar

Indentation is the map

5 min live

A tree needs two things written down: what each node says and who its parent is. An indented outline carries both with no symbols at all. The first line is the centre. A line indented two spaces deeper than the one above is its child. A line at the same depth is its sibling. That is the entire grammar, and the bench in session 4 parsed exactly this and nothing more.

AS AN OUTLINE two spaces per level, first line is the centre Autumn roast launch ··Supply ····Guji short ······Sidamo blend ····First batch ··Packaging ····New sleeve ····Legal sign-off ··Pricing ····Existing: hold ····New: seasonal ··Comms ····Email ····Landing page ··Ownership ····Launch date AS A MAP the same tree, drawn; distance is depth Autumn roast launch Supply Guji short Sidamo blend First batch Packaging New sleeve Legal sign-off Pricing Existing: hold New: seasonal Comms Email Landing page Ownership Launch date Same tree twice. The left one you can type, diff and paste; the right one you can look at.
🔍 Click to zoom - three highlighted lines and the three nodes they become; depth on the left is distance on the right
LiveWhy the outline came first3 min▶

In session 4 you edited a textarea and a map redrew itself. Nobody mentioned that the textarea was the map, because it did not need mentioning: you indented "Guji short" under "Supply" and it appeared on the Supply branch, which is what indenting means. Every map drawn in this course, including the paper one from session 1, was already an outline waiting to be typed.

  • Line one is the centre. There is exactly one line at depth zero. Two lines at depth zero is two maps, and the parser will tell you so by drawing a very confused one.
  • Two spaces deeper is a child. The number is a convention; what matters is that every level is the same step deeper than the last. Mixed tabs and spaces is the commonest reason a map draws wrong.
  • Same depth is a sibling. "Supply", "Packaging", "Pricing", "Comms" and "Ownership" all sit two spaces in, so they are the five main branches. Move "Comms" four spaces in and it becomes a twig of Pricing, which is a claim about the world you probably did not mean.

The consequence is that the paper map is a rendering, not the source. The source is the tree, and the shortest honest way to write a tree is indentation.

Self-studyOutline discipline4 min▶

An outline that will be parsed by a machine, or by a colleague six months from now, follows three habits. None of them is about style. Each one removes a way for the tree to be misread.

  • One idea per line. "New sleeve, legal sign-off" on one line is one node with two ideas in it, and the bench will count it as one label of four words. Split it and each idea can carry its own twig.
  • Consistent indent. Pick two spaces and never mix in a tab. Editors show tabs and spaces identically and parsers do not, so a map that looks right in your editor can draw with a branch missing.
  • No trailing sentences. The keyword rule from session 2 applies to the text exactly as it applied to the page. "Guji short" is a node. "Guji supply is still short so the autumn blend leans on Sidamo" is a sentence that happens to be indented, and it will run off the page when drawn, which session 4's second rung measured at seven labels off the edge.
Real world

The Daybreak product manager keeps her supplier maps as plain text in the same folder as the contracts. A colleague once opened one, saw an indented list, and asked where the map was. She pasted it into a renderer and the map appeared. He asked whether he could edit it. She said yes, and that the edit would show up as a changed line when she next looked, which is more than either of them could say about the slide it replaced.

Part 2 · covers version control

A map that diffs

5 min live

Session 4's third and fourth rungs drew almost the same picture. The difference between them was one idea living in two homes versus one, and a single number caught it. As text, the difference is two lines: one removed under Comms, one added under Packaging. A diff shows exactly those two lines. A drag-and-drop tool saves a binary file, and a diff of two binary files says only that they differ.

A DRAG-AND-DROP TOOL SAVES launch-map, saved twice, three days apart 01101100 01100001 01110101 01101110 01100011 01101000 00101101 01101101 01100001 01110000 the tool can read it; a diff cannot What changed between the two saves? Unknown. A TEXT OUTLINE SAVES the same two saves, as a diff Packaging Legal sign-off origin claim + see Comms Comms Landing page 20th - Legal sign-off moved home one idea, one home, two lines in the diff Both files changed. Only one of them can say what changed, and it is the one you can read.
🔍 Click to zoom - session 4's third rung becoming its fourth, seen as a diff: one line out, one line in
LiveWhat a diff of a map tells you3 min▶

A diff is a list of lines removed and lines added between two versions. Run it on two outlines and the operations of the whole course fall out of it as visible edits.

  • A moved idea is a removed line and an added line at a different indent. That is the session 3 fix, one home plus a pointer, made checkable by a colleague who was not in the room.
  • A cut to a keyword is a changed line that got shorter. Twelve words became two; the diff shows both versions side by side and you can decide whether the two still bring back the twelve.
  • A merged branch is a heading removed and its children re-indented. If the merge was wrong, the diff is the undo button.

Mermaid's mindmap diagram reads this exact shape. Hierarchy comes from indentation, only relative indentation matters, and bracket shapes around a label pick the node's style. It renders on GitLab, on mermaid.live, in VS Code with a preview extension, and on GitHub inside a fenced block. Two lines above your outline are the whole cost of entry:

The two-line headermindmap Autumn roast launch Supply Packaging

The word names the diagram, the first indented line is the root, and everything beneath it is your outline unchanged. Node shapes, icons, classes and the rest of the grammar are learn-mermaid-with-phoebe session 5. Markmap does the same job for a Markdown heading-and-list outline; it is named here so you recognise it, not taught.

Self-studyPer-supplier pages: the map that is regenerated every quarter4 min▶

A map that is drawn once and read for years can live as a picture. A map that is redrawn on a schedule cannot, because the redrawing is the expensive part and a picture makes you pay it every time.

Real world

The Daybreak product manager's nine supplier maps are nine text files, one per supplier, each with the same five branches. Every quarter she updates the twigs that changed: a new backup origin under Supply, a price band under Contract, a payment term that moved. The nine pictures are regenerated from the nine files in one step. When the buying team asks what changed since last quarter, she sends the diff, which is six lines, instead of two pictures and an invitation to spot the difference. The one time a supplier map was maintained as a picture in a drawing tool, the quarterly update took an afternoon and nobody could say afterwards which twigs had moved.

The pattern generalises. Anything with a shape that stays constant and content that churns, a project map, a team map, a risk map, wants to be text with a renderer attached. Anything drawn once for one purpose can stay a drawing.

Part 3 · covers render or draw

Render or draw

4 min live

None of this retires the pen. A hand-drawn map is the right tool for thinking, for capturing live, and for a room full of people; a rendered one is the right tool for sharing, versioning and repeating. Two questions settle it: who is going to read this, and how many times will it be made?

FOR ME FOR OTHERS ONCE REPEATING Draw it thinking, capturing live, or in a room the drawing is for the hand that drew it Render from text type the outline, render it, send the picture readers get the tidy one; you keep the text Type it, keep the text you will edit it again; keep the version that diffs, and sketch on top when you think Render from text, version it regenerate every quarter from the same text the picture is an output, the text the source Who reads it and how often decide the tool. Hand for one thinker once; text for readers or repeats.
🔍 Click to zoom - the only cell that wants a pen and nothing else is the top left, and it is the cell most maps start in
LiveThe hand-drawn map is for the person who drew it3 min▶

A map drawn while thinking carries information that never makes it into the tree: the branch you drew first, the twig you crossed out, the arrow you added at the end when two ideas turned out to be one. All of it is legible to you and to nobody else. Send that map to a colleague and they receive the tree with a lot of noise on it.

So the split is by audience first. For yourself, draw; the mess is the thinking. For anyone else, type the tree and render it, because a reader wants the tree and only the tree. Then check frequency. Anything you will make again, even for yourself, is worth typing, because the second time you will want to know what changed since the first.

The honest failure mode runs the other way too. Rendering a map you are still thinking with makes it look finished before it is, and finished-looking maps stop getting edited. Keep it on paper until the branches stop moving, then type it.

Build-along

From paper to text and back

★ 22 min · everyone types

Your session 1 paper map goes through the whole loop tonight: typed as an outline, measured on the bench, given its two-line header, rendered once, and saved as the file it always was.

Type it. Open a plain text editor. First line, the centre. Then each main branch two spaces in, each twig two more. Type what is on the paper, not what you now wish were on it; the fixes come at the next stage where they can be measured.

Bench it. Paste the outline into session 4's bench and read the numbers before you touch anything. Branches, collisions, off-page, shared ideas. Fix the outline until collisions and off-page are zero and every idea has one home, then copy the text back out.

Add the header. Two lines above the outline: the word mindmap, then the centre indented two spaces. Re-indent everything under it by two more so the root has children. That is all the syntax you need tonight.

Render once. Paste the whole thing into mermaid.live. If a branch is missing, you mixed tabs and spaces or skipped a level. If the picture is right, look at it once, then close it; the picture is not what you are keeping.

Save the text. One file, a plain text extension, in the folder where the meeting's other documents live. Not the PNG. Not a screenshot. The file is the map; the picture can be made again from it whenever anyone asks.

Photograph the paper map first, so you can compare later. A month from now the photo will show you what your hand thought the structure was before the text made you commit to one.

Type the tree with the paper beside you, centre first, then one main branch at a time with its twigs before moving to the next. Working branch by branch keeps the indentation honest.

Paste into session 4's bench and write down all four headline numbers as they come out. If anything is worse than your homework result, the paper was hiding it; the text does not.

Fix in the text, not in the picture. Move lines, shorten labels, give the shared idea one home with a pointer. Watch the map follow. Every edit you make here is one the diff will show tomorrow.

Add the two-line header and render once at mermaid.live. Everything about how that renderer styles nodes lives in learn-mermaid-with-phoebe; tonight only cares that the tree came out.

Save the text file and delete the PNG. Then reopen the file, move one twig to a different branch, and save again. That is version two, and the difference between the two is now a thing you can show someone.

If you take one thing from tonight. The picture is a build output. The text is the source. Keep the source, and the picture, the diff, the quarterly update and the bench numbers are all one paste away, forever, in any tool that reads indentation.

Homework

Before session 6

25 min
  1. Type all three of your session 4 homework outlines into three text files with the two-line header, render each once, and keep only the text. Note how long the third one took compared with the first.
  2. Make a version two of one of them a day later, from memory of what changed in the real project, and compare the two files line by line. Write down what the diff told you that the two pictures would not have.
  3. Pick one map you currently keep as a picture, in a drawing tool or a photo, and decide with the two-by-two whether it should stay that way. One sentence of reasoning, naming the cell.
  4. Bring a map you owe somebody. A plan, a brief, a decision, a revision: session 6 turns one map into the thing it was for, and it needs a real one.
Check yourself

Three questions

Clear all three and session 5 gets stamped in your passport.

1 · A colleague pastes their outline into the bench and it reports one main branch, fourteen levels deep. What happened?

The outline has no symbols to get wrong; depth is the only grammar. A line two spaces deeper than the one above is its child, so an outline where every line steps in once is a single chain of parents and children. Put the fourteen lines at the same depth and you get fourteen branches, which is session 4's first rung; group them under five and you get a map.

2 · Two versions of a map exist, three days apart. Why can a diff explain the change when the map is text and not when it was saved by a drag-and-drop tool?

The diff of session 4's third rung against its fourth is exactly two lines: "Legal sign-off" removed under Comms, "see Comms" added under Packaging. That is the session 3 fix, readable by someone who was not there. Miro or XMind would save the same change as a new binary blob, and the only honest diff of two blobs is that they are not identical.

3 · The Daybreak product manager's supplier map is read by the buying team and updated every quarter. A colleague's map of tomorrow's negotiation is for their own eyes and will be thrown away by Friday. Which is which?

Audience first, then frequency. Readers want the tree without the thinker's noise, and anything regenerated on a schedule wants a source you can diff, so the supplier map is text. A map for your own thinking, made once, gains nothing from being typed and loses the crossings-out that were the thinking. Neither answer is about which map matters more.

Sources covered

What this session teaches, and where it came from

✓Outline grammarFirst line is the centre, two spaces deeper is a child, same depth is a sibling; the shape session 4's bench parsed
✓Mermaid mindmap factsHierarchy from indentation, only relative indentation matters, bracket shapes pick styles; renders on GitLab, mermaid.live, VS Code preview, GitHub fenced block
◐Mermaid syntaxTwo lines shown; shapes, icons and classes are learn-mermaid-with-phoebe session 5
✓Version control claimText-defined maps diff; drag-and-drop tools such as Miro and XMind store binaries that do not
✓Render or drawAudience then frequency; hand for one thinker once, text for readers or repeats
◐MarkmapNamed as a Markdown-to-map renderer; not taught

Every fact on this page, and its verification tier, is recorded in the course's source map.

Session 5 cheat sheet · pin this

Indentation is the treeLine one is the centre. Two spaces deeper is a child.
Outline disciplineOne idea per line. Spaces, never tabs. No sentences.
A moved idea is two linesOne removed, one added. The diff shows the fix.
Two-line headermindmap, then the root. Syntax is learn-mermaid session 5.
Binaries do not diffTwo blobs compare as "different" and nothing more.
Render or drawFor me, once: pen. For others or repeating: text.