Concept map plugin idea

I have an idea for a plugin that would really help my workflow when doing sensemaking of information.

The idea

A WYSIWYG map editor or digital whiteboard where you can create and connect cards with annotations to create non-linear concept maps. It is functionally similar to digital whiteboarding tools like Miro, but allows your cards to reference notes in your vault.

Isn’t this just graph view?

No, Graph view visualises the connections between your notes, rather than letting you explore and generate visual connections manually. It also doesn’t require that the cards are links in your vault, where as the nodes in graph view does.

Isn’t it just a mind map?

No, Mindmaps are linear and hierarchical. Concept maps are more organic, allow you to create cards and then connect them.

Key features

  • Create ‘cards’ or ‘post-its’ on a board and write in them (similar to cards in kanban)
  • Add links to cards using wikilinks
  • Connect cards and annotate connection

Here is a screencap of how it works I’m Miro

Nice to have features

  • Style cards, links and labels
  • Auto style types of cards using tags or YAML
  • Drag cards into each other to group
  • Export as image or PDF

Would replace

But, would allow you to link the cards to other notes in your vault using the [[wiki link]] syntax

Similar to plugins, that don’t quite answer this need

  • Juggl
  • Breadcrumbs
  • Kanban
  • Mindmap

My current workflow

Make the map in Miro, and embed it in the relevant note.

This could be improved by having it in Obsidian as I could add wikilinks directly, and save time copying and pasting back and for the between tools.

Key challenges

Unlike hierarchical or structured visualisations like kanban and mind maps, it is unclear how the map information would be stored as markdown. There may need to be some additional code to store the positions and styles of the map.

Plectica allows you to export maps as markdown, using position to determine order. (top left first), but it is unclear how you would store this the other way.

Why don’t you just do it yourself?

I’m a strategist, researcher and designer. I have no real coding experience so would need someone to build it, but I can do visual design if that is helpful.

8 Likes

I’ll throw in Scapple | Literature & Latte as another good example of this.

I really like this idea. Having concept maps would be super useful.

This is something Emile and I are considering already. The idea is to use the Juggl API to visualize the Breadcrumbs structure.

I am curious, doesnt Excalidraw allow you to do most of this? Iirc, you can add links in the drawing, so you have the freedom to create the map however you want, and can create links.
But this does have limitations too.

If this were an entirely new plugin, I don’t think storing the graph would be a problem.

2 Likes

I think something important is to keep using regular files, using markdown+metadata.

As an example you can look at the excalidraw plugin 1.2.0, it allows you to have links and the text is kept in markdown so it’s searchable, replaceable, etc.

I do the same, also diagrams from software diagraming tools like Magicdraw or
Archimate. The problem is that suddenly we rename something and these changes are not reflected. We need a tool for thinking that helps to maintain our diagrams.

This is a brilliant idea! And it’s great to hear that SkepticMystic and Emile are considering something like it.

I like the way CmapTools generates a text outline of the concept map. In that program, if the concept map has any circularity, the text outline can be expanded “infinitely”, but I think there would be a workable way to encode the concept map in a Markdown file. For example, if we say that * indicates a ‘card’ and - indicates a link, the Markdown text for @callan’s concept map could be something like the following:

* [[Co-design]]
  - is
    * A form of participatory design
      - with roots in
        * [[Scandinavian design]]
      - with roots in
        * Corporate and industrial design
      - that
        * Shares power
          - similar to
            * [[Action research]]
        * Involves non-designers in the design process
  - can be
    * Can be difficult for government to implement
      - because
        * Shares power

The parser would either need to recognize that lines with the same text should be the same card (both occurrences of “Shares power” in this example), or else there could be a way for the parser to work with block references, so that the second occurrence of “Shares power” would be a block reference of the first.

So, the hierarchy would simply be a way of encoding the relationships between linked cards, and it would not enforce a tree structure. (Map position and so forth would need to be encoded separately.)

Ideally, with this kind of approach, one could edit text either in the underlying Markdown file or in the WYSIWYG whiteboard.

(Is this sufficiently in keeping with the original idea?)

3 Likes

Some ideas here from me:

  1. I like the idea of having nodes that are not notes in your vault. Indeed, for things like ‘arguments’ or things that clearly aren’t ‘entities’, I’d not create a note either. The challenge is in representing this in data, as you mention. That is, where to store the text on a node? Should it be in some file that links to it? But some nodes (such as ‘Involes non-designers in the design process’) does not have any incoming links from a wikilink! So I like @lucasd’s idea, but I don’t see where to store this if you were to create this in a WYSIWYG sense.
  2. Storing a graph with positional information and hidden nodes is already possible in Juggl, but not in a Markdown-like format. This sounds really hard to do, and I doubt it’d be useful in any sense (it’d just be a huge list of coordinates and links to nodes…). I think storing it as a regular data/.json file should be enough there.
  3. WYSIWYG for Juggl is somewhat in the plans (see Use EdgeHandles to create typed links · Issue #30 · HEmile/juggl · GitHub and double-click to insert new note on graph · Issue #71 · HEmile/juggl · GitHub), however writing text on a node like in Miro could be challenging. I think it might be possible there, though!

If you don’t need to explore the graph like in a graph view, I do wonder how Excalidraw would not work here, as others have mentioned :slight_smile:

1 Like

I hadn’t tried Excalidraw for this. I have been giving it a shot this week. It nearly works for it. Or, should I say it does work, but it feels pretty clunky. The main issues for me are text and boxes (cards) are treated separately, rather than text within a box. Same with labels on arrows, so once you start getting a larger concept map it can be pretty fiddly to move things around. I know this sounds like a bit of a petty gripe, but when you are trying to get flow and map out ideas having to constantly fix the styling really breaks your flow and you end up fighting against the software rather than mapping.

I think the way Excalidraw tracks text elements eg ^m4TvMX0P could be useful though?

I have had good success adding CMAP concept maps to JIRA and CONFLUENCE by

  1. rendering the image of the concept map to .PDF (cmaptool does this)
  2. embedding the “.cmap” file as data within the .PDF (mupdf can do this)
  3. adding the .PDF to the JIRA issue or Confluence page (normal .pdf add)

The same idea can work here with Obsidian.

  1. Obsidian can store and view .PDF
  2. .PDF can contain binary data and hence store the .cmap source
  3. Plugin can retrieve .cmap source, manipulate/query as desired with cmaptool, and pass information to Obsidian.

I came after reading about this in Obsidian Roundup, and wanted to make this idea more rigorous and general as it is in my head: think of the “WYSIWYG editor” as having these different types of views:

  1. Lists/Outline
  2. Kanban
  3. Calendar
  4. Concept-map (as told by OP, I just called them mind-maps though)
  5. Timeline
  6. Table
  7. Draw (freehand, shapes)
  • The “views” 1, 2, 3, 5 and 6 are available in Notion and we have 1, 2, 6 and 7 in Obsidian itself now.
  • These “create notes” from themselves, as opposed to Graph view, Calendar community Mind-map community plugin, etc. making use of available notes to create a “pre-view” of them.
  • A simpler example (1): working in an unordered list we “Outline” the information and adding a [[ ]] creates a potential note from that list itself.
  • Next up we have Kanban (2) that creates a visual “board” for the information.
  • (6) is partly available in two ways: Dataview or making a simple table itself (and that in my opinion is a superpower!)
  • I would really love all the others too be available in Obsidian too~!

You can do this with Excalidraw, though its not quite as seamless as I’d like.

Here’s an example of a new app that puts these spatial whiteboards/surfaces front and center alongside docs/notes. It’s a really nice UX. https://cloverapp.co/