Introduction

Hivemind is a free tool that lets you create mind maps in your browser. It supports time-travel (through the change history of the mind map), tagging specific time points (Planned) and collaborative editing (Planned).

At a Glance

Each mind map is modelled as a tree, ie. it has a single root node, and all other nodes are descendants of this root node through a single hierarchy. There are no cases of multiple parents, cycles, loops (self-joining edges), parallel edges or orphaned nodes.

An example mind map

Tree structure with a single root node.

This tree is 3 levels deep. Each node can have one or more children, but exactly one parent (except the root node, which has none). The timeline at the bottom shows at what points this mind map was modified.

Each node in the mindmap is a container for information. There is a title, a summary and a content field. This node is connected to exactly one parent by an edge (except when it is the root node), and can optionally have one or mode child nodes. The edges themselves do not carry any information at present, other than which nodes they connect.

Expanded view of a node

Accessed by a context menu upon clicking the node.

Apart from the title, summary and content, a few other bits of information are displayed, like who created/last updated the node, and where the node sits in the overall hierarchy.

Key Points

Every write operation that is performed on a node (create/update/delete) is recorded permanently in a time-travelling database, allowing for point-in-time lookups of any historic version of a single node or the graph as a whole.

1. The root node is special - it cannot be deleted, and is the only node without a parent.
2. Whenever a node is deleted, the entire subtree under it is also deleted in order to ensure there are no orphaned nodes.
3. Only users with edit or admin access can perform write operations on the tree.
4. Planned A user with admin access can additionally share the mindmap with other users (by granting/revoking read/write/admin access) or make it publicly (in)visible (read-only).
5. Planned Only an admin user can delete a mind map.
6. Access control is NOT modelled temporally, ie. if your access to a mind map is revoked, you lose access to ALL its history, not just from the time of revocation. Conversely, if you are granted access to a mind map, you gain access to its ENTIRE history, not just from now onwards.

Quick Start

Logging in

Login Prompt

Login via email or an external authentication provider.

Anonymous users must first login to start creating mind maps.

• Go the the Hivemind home page.
• If you're not logged in, you'll see a login prompt as shown in the example above.
• Use an email (that you own) or one of the other providers (currently Google, GitHub) to sign in.
• If you're signing in for the first time, you'll have to perform a few extra steps, either to set your password, or to authorize Hivemind with the external provider.
• Once you've signed in, you'll be redirected to the list of mind maps that you own.

Creating a mind map

Create a Mind Map

Accessed from the mind maps list page.

Click on the Create button. Then just type a name and hit ⏎.

• Go to the mind maps list page.
• Click on the Create button.
• Type a name and hit ⏎ (<Enter>).
• The first node in the mind map will inherit its title from the mind map's name.

Creating a (child) node

Each node (except the root node) is a child of exactly one other node. While the root node is automatically created for you when you create the mind map, every other node must be created as a descendant of the root node by accessing a context menu within the mind map canvas (the black area). This context menu is available on all nodes, but its contents could vary depending on a number of factors. The ‘create child’ option is available, provided:

1. The user has ‘admin’ or ‘write’ access to the mind map, and
2. The mind map is being viewed in ‘write’ mode (i.e., not in ‘lookback mode’ - to be discussed later).

Open the Context Menu

Accessible from any node on the canvas.

Contents may vary depending on state of mindmap and node.

Create a Child Node

Accessed by clicking on the ‘ Child’ option from the context menu.

Type a name and hit ⏎. The newly created child node will show up under the node from which the context menu was opened.

PreviousNext

• Click on the node under which you wish to create the child.
• Select the ‘ Child’ option.
• Type a name and hit ⏎ (<Enter>).
• The new node will show up under the node selected above.

Deleting a node

All nodes (except the root node) can be deleted. Upon deletion, the entire sub-tree under the deleted node is also deleted. The ‘delete node’ option is available, provided:

1. The user has ‘admin’ or ‘write’ access to the mind map,
2. The mind map is being viewed in ‘write’ mode (i.e., not in ‘lookback mode’ - to be discussed later), and
3. The node is not the root node.

Delete a Node

Accessed by clicking on the ‘ Del’ option from the context menu.

Confirm delete operation to get rid of the node (and all of its descendants, if present).

• Click on the node that you would like to remove.
• Select the ‘ Del’ option.
• Confirm that you want to delete the node by clicking the Delete button.

Editing a node

All nodes can be edited. The ‘edit node’ option is available, provided:

1. The user has ‘admin’ or ‘write’ access to the mind map, and
2. The mind map is being viewed in ‘write’ mode (i.e., not in ‘lookback mode’ - to be discussed later).

Edit a Node

Accessed by clicking on the ‘ Edit’ option from the context menu.

Edit one or more of the ‘title’, ‘summary’ and ‘content’ fields, and click the Save button.

• Click on the node that you would like to edit.
• Select the ‘ Edit’ option.
• The popup screen will appear with a title, summary and content of the node.
• Modify one or more of the attributes as required as click on  Save.

Viewing a node

View a Node

Accessed by clicking on the ‘ View’ option from the context menu.

View the title, summary and content of the node. Also shows its position in the hierarchy and who created/last updated it.

• Click on the node that you would like to view.
• Select the ‘ View’ option.
• The popup screen will appear with a title, summary and content of the node.

Hiding a node

Each node (except the root node) has an option to be hidden from display on the canvas. This can be useful to temporarily remove clutter when a large number of nodes are on display. Upon hiding, the entire sub-tree under the node is also hidden. To indicate that a node was hidden, its parent is marked in a grey/black shaded background. The hidden node (and all its descendants) can be revealed using a menu option under its parent.

Open the Context Menu

The ‘ Hide’ option is accessible from any node on the canvas (except root).

Useful for reducing clutter on the canvas.

Hide a Node

Accessed by clicking on the ‘ Hide’ option from the context menu.

Hides the entire sub-tree under this node (as well as the node itself). Shades the parent to indicate hidden children.

PreviousNext

• Click on the node which you wish to hide.
• Select the ‘ Hide’ option.
• Hides the entire sub-tree under this node (as well as the node itself).
• Shades the parent to indicate hidden children.

Revealing (Un-hiding) a node (sub-tree)

A hidden node (and its descendants) is indicated by a shaded background on its parent. To reveal its sub-tree and render them back onto the canvas, a menu option is added to the parent (only for parents with hidden children). Clicking on this reveals (un-hides) the entire sub-tree under the parent.

Open the Context Menu

The ‘ Reveal’ option is accessible from any node that has hidden children.

Used to reveal (un-hide) the entire sub-tree under the node.

Reveal a Node

Accessed by clicking on the ‘ Reveal’ option from the context menu.

Reveals the entire sub-tree under this node. Un-shades the node to indicate no hidden children.

PreviousNext

• Click on the (shaded) node whose children you wish to reveal.
• Select the ‘ Reveal’ option.
• Reveals the entire sub-tree under this node.
• Un-shades the node to indicate no hidden children.

Time travel

Hivemind can time-travel. What this means is, as you keep changing the mindmap through create/edit/delete operations, Hivemind keeps track of all these changes and retains a history of all the revisions of the mind map as a whole. This gives users of Hivemind the unique ability to rewind back to any point in time through the history of the mind map, and view it as it was at that time. This is achieved either by using the timeline component (below the canvas) or the playback buttons (in the menu bar above the canvas). See the image below.

Time Travel

Use the playback buttons or the timeline.

Travel back/forth through the history of changes to the mind map, and view it as it was at any point in time through its lifecycle.

Whenever the user travels through time to look back at a historical version of the mind map, it is said to be in ‘lookback mode’, and all modifications are disabled (since its history is treated as immutable). This is indicated in three ways:

1. A timestamp query parameter in the URL, which also serves as a permalink to this point-in-time version of the mind map,
2. A button at the top right of the menu bar, which shows a symbol (otherwise showing a symbol when in ‘write mode’),
3. A grey border around the canvas (which is otherwise red in ‘write mode’).

While the mind map is in ‘lookback mode’, it cannot be edited.

Using the Timeline

The timeline is the component displayed at the bottom of the mind map canvas, that shows a time series of write events that took place on the mind map, in chronological order. It has the following properties:

1. The timeline can zoom in and out. This is manually achieved by scrolling while the cursor is on the timeline (or using pinch zoom on a touchscreen).
2. When fully zoomed out, the timeline fits all events of the mind map. It cannot be zoomed out beyond the boundaries defined by the first and the last events of the mind map.
3. When fully zoomed in, it has a resolution of 1 minute.
4. Events are color-coded to depict their type. A ‘create’ event is green, an ‘update’ event is blue and a ‘delete’ event is red.
5. When two or more events get too close together on the timeline to be clearly rendered (ie. they start overlapping), they are clubbed together in a ‘cluster’, with a number showing the number of events in that cluster.
6. A cluster can be expanded to fill the timeline by double-clicking on it.
7. Double-clicking an empty portion of the timeline will cause it to zoom out fully.

Open the example below for a step-by-step guide how to use the timeline.

Any jump triggered on the timeline automatically puts the mind map in ‘lookback mode’.It can be put back into ‘write mode’ by clicking on the button at the top right in the menu bar.

Event Detail

Shows the delta associated with an event (update, in this instance).

Accessed by clicking on an event on the timeline. Fields that were changed are marked in colour. The event time is displayed. If the title was changed, both the old and new title are shown in the header section of the detail popup. Clicking on the Jump button makes the mind map jump to a point in time just after this event had occured. This updates the canvas and also focuses the timeline on this event.

Timeline Jump

Accessed by clicking on the Jump button from the event detail popup.

The mind map has jumped to the point in time at which this event had occured. The state of the canvas reflects the mind map was in just after this event had occurred. The affected node is higlighted with a blue border. The timeline focusses on the event in question.

Event Detail (Focussed)

Shows the delta associated with an event (update, in this instance).

Accessed by clicking on an (focussed) event on the timeline. The Jump button is now replaced with a Find button. This can be used to zoom in on the affected node on the canvas.

Find Node

Accessed by clicking on the Find button from the event detail popup.

The canvas zooms in on the node affected by the event.

PreviousNext

Using the Playback Buttons

The playback buttons at the top menu bar should be fairly easy to understand and use. They look and work similar to an audio player - only that in this case, the buttons are used to jump between events on the timeline, rather than between items in a playlist.

1. The button takes you directly to the first event of the timeline.
2. The button takes you to the previous event from the current event on the timeline. If you are currently in ‘write mode’ then this takes you to the last event.
3. The button takes you to the next event from the current event on the timeline. If you are currently in ‘write mode’ then this takes you to the last event.
4. The button takes you directly to the last event of the timeline.

Any action on the playback buttons automatically puts the mind map in ‘lookback mode’.It can be put back into ‘write mode’ by clicking on the button at the top right in the menu bar.

Searching

Search

Search for nodes on canvas.

Use one or more filters/sort to locate a particular node of your interest. Clicking on a row will make the canvas zoom in one the node corresponding to that row.

• Click on the button in the top menu bar.
• Enter your filter criteria or sort the columns in ascending/descending order.
• If a node that matches all filter critera exists, you should see it in the list.
• Click on the node if you would like to navigate to it in the canvas.

Renaming a mind map

The mind map can be renamed when in ‘write mode’. This is true when:

1. The user has ‘admin’ or ‘write’ access to the mind map, and
2. The mind map is being viewed in ‘write’ mode (i.e., not in ‘lookback mode’ - as discussed earlier).

Rename

Rename the mind map.

Click on the button. Enter the new name and hit Save.

• Click on the button.
• This button can be found in the menu bar.
• Modify the name as required and hit ⏎ (<Enter>).

Fit on canvas

If the mind map does not optimally fit in the canvas, either because you played around with the canvas zoom or moved a few nodes around, or just hid/revealed a bunch of nodes, you can force them to optimally fit by clicking on the button in the top menu bar.

Messed-Up Layout

Nodes on the canvas have been manually dragged around.

Use to re-run the layout and achieve optimal fit.

Layout Fixed

Optimal fit achieved.

This resets any movement on canvas, and also refits nodes after a hide/reveal.

PreviousNext

Show All

If several sub-trees were hidden on the canvas, it can get tedious to reveal them all by navigating to their parents one-by-one. For such cases a quick shortcut is to click on the button in the top menu bar. This causes the canvas to immediately reveal all hidden sub-trees and also re-run the layout if necessary.

Canvas with Hidden Nodes

Some nodes/sub-trees on the canvas have been hidden.

After hiding, the canvas was told to rerun its layout to optimally fit the now visible nodes.

All Nodes Revealed

All hidden nodes/sub-trees are revealed.

This reveals any hidden nodes/sub-trees on canvas, and also reruns the layout to optimally fit the now fully visible mind map.

PreviousNext