Visual node based programming

a.k.a. dataflow graphs, patchers, visual coding, flow-based programming

Visual programming is for people who find this more soothing than lists of instructions

Graphical dataflow programming languages, a.k.a. node-based visual programming. Probably descended from flow based programming or at least dataflow programming. A specific kind of DSL, with a visual functional graph interface. There is much crossover between these and the new generation of low code development systems.

For the record, I hate programming using visual dataflow, although I do like visualizing my programs this way. The patchers that offer only a GUI workflow are arse-backwards for my work process, forcing you to click a million times to do every simple thing. But they are famous, and seem simple to the sort of people who prefer clicking on 100 buttons instead of tapping 100 keys. These are the same kind of people who will drive their cars until the rims are on the road rather than take half an hour to pump up the tyres.

This is popular in audio, visual multimedia in systems like VVVV and Quartz Composer and web api programming systems like nodered. Possibly the most important application now is the neural net paradigm that treats neural data flow as a dataflow graph.

This is not the only way you can program visually. I would argue that the hierarchical tree like structures of teaching tool scratch or art lisp project fluxus while having some obvious parallels, are different.


Vidual patcher programming is being made respectable by projects like Luna, which translate general purpose languages back and forth between equivalent graphical and textual representations.


KNIME seems to be a low-code data analytics platform. It looks like this.

That is all I know for now.



Nodes is a JavaScript-based 2D canvas for computational thinking. It’s powered by the npm ecosystem and lives on the web. We take inspiration from popular node-based tools but strive to bring the visual interface and textual code closer together while also encouraging patterns that aid the programmer in the prototype and exploratory stage of their process.

They have probably the best explanation of the whole dataflow patching mode, for the outsider:

One common differentiation between visual programming tools is the level of abstraction they operate on. Some tools, like Origami for example, are meant to prototype interactions of user interfaces and not much more. Others — like Pure Data for instance — are meant to be very low-level and let users craft their own environments. Some — like UE4 Blueprints or the Unity Visual Effects Graph — are embedded and part of a larger system (e.g. a game engine environment).

Nodes is more directly comparable to, FlowHub or MaxMSP. It does come with some batteries included but there are less preconceptions of what you use it for. However, unlike most of them we adopt a more programmer-first approach where the nodes themselves are generally a lot more high-level and users are encouraged to peek inside, copy and modify, and write their own. While you could drop on a lower level and express language-level semantics like if-checks and for-loops, or math concepts like add or multiply on a node level we generally don’t feel that is a productive way to work and prefer to write that logic in a textual programming language. This might feel conceptually familiar if you have used NoFlo.



Userland is an integrated dataflow environment for end-users. It allows users to interact with modules that implement functionality for different domains from a single user interface and combine these modules in creative ways.

The UI works as a series of cells. Each cell can be set to a different mode, and each mode implemented as a separate module. There are currently three different modules:

  • spreadsheet - basic spreadsheet-like behavior, activated by typing formulas starting with an equals sign (e.g. =1+1, =A1 * (3/2))
  • shell - posix shell mode, where each cell represents one command and its output, activated by typing shell. As the cell switches to shell-mode, it displays its current directory and allows commands to be entered.
  • synth - synthesizer mode, activated by typing commands starting with a tilde (e.g ~triangle 220). Pressing Enter when a synth cell is focused will start/stop the audio wave.


Flume is a framework for creating flow-based “patcher”-style programming languages.

Create your own visual programming language, while guaranteeing that users can’t create invalid logic. Color-coded ports make this concept easy and intuitive for end-users.

No comments yet. Why not leave one?

GitHub-flavored Markdown & a sane subset of HTML is supported.