New User Interaction Approach for Vithanco

We have simplified the user interaction approach of Vithanco. It was already released with Vithanco 1.4. The new approach is reducing the numbers of popup windows and hence keeps the focus on the canvas/diagram.

The standard behaviour of clicks has changed. If you double click a node you can immediate start typing on the canvas. A text field is overlaying the node and awaits changes. Leaving the text field with the mouse or pressing [Return] will end the editing.

Vithanco 1.4
Please note the new editing box (highlighted in blue) on the canvas.

The previously for this used Node Editor dialog can be reached either by pressing [CMD] when clicking on the node, or via right click (two finger click on trackpad) or using the little wrench symbol on the top right.

These changes  felt so natural that the clusters and edges got the same behaviour.

Please let us know what you think!

Connect your Diagram

Vithanco allows to connect your diagram easily with other relevant resources as long as it can be referenced via a URL. 

How to add URLs?

Just add a URL to a Node in your diagram in the Node Editor.

How to use URLs?

Hoover over the node. Notice the new link icon in the middle on the top of the node? Just click that button and the system browser will be called with the URL provided.

What can I do with this?

Obviously, the use cases for this feature are as versatile as Vithanco itself.

  • Use URLs as an example in a Concept Map for additional information. Link to the corresponding Wiki page, or to a company internal page that is of relevance to the reader.
  • Create Decision Tree Diagrams with URLs for to each outcome. This way you not only document each decision point but you can trigger the next action.
  • Connect each Business Change in a Benefit Breakdown Structure with a link to details on the intended change. Connect each enabler with the link to the corresponding task or feature (or how ever you call it in your company / project).
  • Reference background articles etc. from within your IBIS diagram on a topic to make it simple for others to understand your thinking.

And so on.

What else should you know?

A URL doesn’t have to point only to a website (as indicated by an http: or https: at the beginning of a URL). Vithanco as an example has a URL schema allowing to create a new document with a specific domain.

vithanco://?command=newDocument&domainID=com.vithanco.domains.ibis

On a Mac with Vithanco installed the URL above creates a new document with the IBIS domain. Many other applications have similar features.

Can I export these URLs and hence create a clickable Image?

Unfortunately, common picture formats don’t offer such a functionality. However, HTML does. Vithanco therefore allows to “Export Browsable” starting with version V1.3.0 which will be released soon. “Export Browsable” exports the diagram as a .jpg file and a corresponding .html page that overlays the exported diagrams with links. You can already store URLs today and navigate to them from the Vithanco application.

Special variants of Vithanco like Vithanco Concept Maps will gain the export feature as well soon. 

Changing Node Order in Vithanco

The Problem

Laying out a graph depends on node order. The nodes are created in an order and this is the first order used. By maintaining that order Vithanco ensures that the nodes are located where they are and that small changes in the input leads to only small changes in the output. That means that in most cases the leftmost node stays leftmost. The layout algorithms are stable in the sense that they produce the same outcome for the same input. And the order of nodes is part of the input.

And sometimes the original order is not the order you like. You would like the nodes presented in a different order, exchanging two nodes that are located next to each other, or similar.

The Solution

You can change the order of nodes and thus can influence the resulting diagram by using the [TAB] key. Simply select two nodes and press [TAB] and the two nodes exchange their place in the order of nodes. If you select more than 2 nodes and press [TAB] they are rotating their position in the order. Finally, press the [ALT] (or [OPTION]) key at the same time as [TAB] and the order is shuffled.

You can use [TAB] in all diagram types.

Limitations

Sometimes the algorithm will not be influenced by a change of order.  ‘Good reasons’ might keep the layout algorithm from changing the diagram if the order of nodes changes.  Examples of these ‘good reasons’ may:

  • to avoid long edges (aka connection)
  • to avoid crossing edges, or
  • to place nodes within a cluster next to each other,
  • to balance a tree based on the next layer (layered view only),

or similar. The above list is not complete and the used algorithms are quite sophisticated.

There are more ways to influence a diagram but these will be captured in another post.

An Example

The following is an example from a domain that will be released during first half of 2019: the “Causal Loop Diagram” or “CLD” in short. Causal loop diagrams are used to analyse systems and their behaviour.

CLDs aren’t layered as they are normally full of cycles (“loops”), meaning they have a lot of connections that would point from the bottom to the top. Hence CLDs use a star layout.

The example is based on the “Shifting the Burden” archetype. The first version looked like this:

The structure of this CLD archetype is not very obvious. Edges are overlapping, making the understanding unnecessarily difficult.

Using the above, select the top and the right node:

Now press [TAB] and the order of the two selected nodes is exchanged, resulting in a different positioning of these nodes in the internal order. In this example they simply exchanged their location as well.

Now the structure becomes clear. The edges are no longer overlapping and the three loops become visible.

 

Draw more, together

For a long time do I believe in the value of visual thinking. Clearly, not all visual thinking would use graphs such as Vithanco is allowing to manipulate. In fact, graphs are a just one approach to visuals among many. Clearly, the author believes it is a powerful approach, not least because it allows structure whilst still using additional senses over text-only approaches.

Ole Qvist-Sørensen was presenting his view on visual thinking at the TEDx Copenhagen 2012. I think it’s a great presentation.

I have seen the works of Ole and his company. We used Bigger Picture quite often at the company the author works. I can only confirm the usefulness of his drawings. There is something that makes you contemplate a good (enough) drawing unlike a lengthy text. Book his company or simply draw yourself. It is worth it.

Dan Roam has a similar message as Ole in his “napkin” books or in the potentially even better “blah, blah, blah” book. The latter presents even some kind of “grammar” for visual drawings.

How does Vithanco fit in? Vithanco is clearly less flexible than pen and paper. It is “only” drawing graphs. However, I believe that there is a case for Vithanco. Vithanco is useful as an explorative tool. It can help you to “think things through”. Auto layout will prevent you from wasting your time on arranging drawing elements whenever a small change is happening. The domains enforce that you stick to the underlying structure of the diagram.

Vithanco is therefore useful in a changing environment. If you don’t know where your analysis will end and/or you need to add elements at any point of time, potentially even maintaining one diagram over a longer period (consider for example a Benefit Breakdown Structure that should reflect your project throughout the project lifetime) then Vithanco is the right tool.

Ole mentioned in his talk how powerful it can be to work together on a drawing. I challenge you to do the same with Vithanco. According to a German proverb, four eyes see more than two (and a quick online research shows that not only the Germans have this proverb). This is so true when we discuss visual thinking.

 

 

Diagram Logic

Vithanco diagrams can have an associated logic. They are guiding you to the right thinking. Vithanco has 3 different Logic Types. 

NameMeaning
NoneNo logic associated
Sufficient CauseSufficient Cause means that from one statement the next statement follows. 
Necessary ConditionNecessary Condition means that each of the predecessor statements need to be fulfilled in order for a statement to be true. 

So, in a sufficient cause diagram, the following makes sense:

Sufficient Cause

Clearly, when I eat I am less hungry than before. Being less hungry is a direct consequence. Eating is sufficient to reduce hunger (ignoring some psychological effects). In comparison, preparing food is not sufficient. You can prepare food and not eat it. That leads to necessary conditions. 

Necessary Conditions

It is not sufficient to be 18 years old, you need as well in order to be registered in order to vote. Unfortunately, this diagram would not tell you if there is a 3 condition to be met in order to be able to vote, like living in a democracy. 

How to use this?

  • First and foremost, it should influence the way you think about the diagram. (Remember, Vithanco stands for “Visual Thinking and Communication”).
  • Choosing the right logic makes the model more comprehensive. You can use And/Or junctors in order to add more expressiveness to the diagram. 
  • Theory of Constraints (TOC) uses these two diagram types extensively. TOC is based on designing logically correct diagrams. 
  • If you drag from a node to a line in a sufficient cause diagram then Vithanco will create a AND junctor for you, do the same in a necessary condition diagram Vithanco will create a OR junctor. Both junctors are part of the Basics Domain. 
  • In the future Vithanco will use the logic type for diagram reviews. More on that at a later time. 

The diagram’s logic is shown in the upper right corner, in a non-obtrusive way. If you want to change it then need to go into the settings dialog and choose “Behaviour” in the settings dialog.

How to change the Diagram’s Logic

Then choose the intended logic.

Change the Logic here

In case you wonder, the Application is referencing this article.