Awesome Node-Based UIs(github.com)
github.com
Awesome Node-Based UIs
https://github.com/wbkd/awesome-node-based-uis
70 comments
You can add https://ossia.io which (as its author) I believe is fairly unique in combining node-based and timeline directly in the same UI :)
It looks like an interesting approach, gonna take a deeper peek at it.
Any particular reason for the player part to be LGPL rather than something more permissive? Don't see the player portions being badly appropriated or fork-extended commercially w/o the main tool that definetly should remain GPL:ed. (I'm still active in the demoscene doing 64k's where exe-compression usually works with single exe's)
Any particular reason for the player part to be LGPL rather than something more permissive? Don't see the player portions being badly appropriated or fork-extended commercially w/o the main tool that definetly should remain GPL:ed. (I'm still active in the demoscene doing 64k's where exe-compression usually works with single exe's)
If it was up to me it'd actually be at least GPLv3 and likely AGPL haha but many were involved in licensing choices and this is where the common ground landed.
And the player is what actually contains most of the interesting algorithmic "meat" ; a company could build a custom DAW on top of it without much trouble for instance.
And the player is what actually contains most of the interesting algorithmic "meat" ; a company could build a custom DAW on top of it without much trouble for instance.
Hmm, maybe you're right. I was mostly considering the parts needed for me (linear-replay) but I guess when you have OSC,Midi and all other kinds of integrations there's a lot more integration code weight.
Though from experience with my own tools, I suspect that in the end the UI code for the tool will outweight most other parts in the end.
Though from experience with my own tools, I suspect that in the end the UI code for the tool will outweight most other parts in the end.
Yes, there's definitely more UI code (roughly 20% of the total is engine code). But it's also a much, much easier code to write than the engine code which has to be threadsafe, has to perform no allocations as far as is possible, comes with various graph algorithms, etc
woow! This is so good! Just added it.
thanks for adding it! I find so interesting in terms of how we market it that you added it to the "3D & visuals" category, when it had audio features before even being able to display anything haha
I have recently implemented a fairly complex workflow editor [1] at Northflank (https://northflank.com) using react-flow and elkjs. They make for a very powerful and flexible combination, great for our needs.
[1] https://i.imgur.com/gENveM4.png
[1] https://i.imgur.com/gENveM4.png
Plug: Im making a keyboard-centric flowchart editor designed for speed. Its node/wires but instead of being a canvas and mouse interaction, its a grid like a spreadsheet and has navigation and selection like a spreadsheet. Free to use (below). It would go in the Diagramming section.
https://www.knotend.com
https://www.knotend.com
Very glad to see this get some focus! I wanted the same back when I worked on Flowhub.
The cannnabis co? What were you using flowcharts for?
Haha no, the other Flowhub :p http://flowhub.io
I think Blender is worth an honerable mention. :)
Geometry nodes, part of «everything Nodes», is pretty interesting: https://youtu.be/kMDB7c0ZiKA
Geometry nodes, part of «everything Nodes», is pretty interesting: https://youtu.be/kMDB7c0ZiKA
The blender game engine, Armory3d, supports node based scripting as well.
https://armory3d.org/features#scripting
https://github.com/armory3d/armory/wiki/Introduction-to-Logi...
https://armory3d.org/features#scripting
https://github.com/armory3d/armory/wiki/Introduction-to-Logi...
Good point. If we add blender we also have to add Houdini I guess :D
Also Dynamo[0] and Grasshopper[1]
[0] https://dynamobim.org
[1] https://www.grasshopper3d.com
[0] https://dynamobim.org
[1] https://www.grasshopper3d.com
Da Vinci Resolve, Unreal Engine, everything is going node based.
Agreed, many VFX graphics programs are node based - two more would be Nuke and Katana from The Foundry.
Natron would be an open source clone of Nuke, similar to how Gaffer is essentially an open source clone of Katana
Natron would be an open source clone of Nuke, similar to how Gaffer is essentially an open source clone of Katana
I guess this is where I shamelessly plug mine ;)
https://kronoslang.io/veneer/tour
(music DSP patcher with a WASM JIT in browser)
https://kronoslang.io/veneer/tour
(music DSP patcher with a WASM JIT in browser)
super cool :) Added!
Bespoke Synth (https://www.bespokesynth.com/) is another cool open source node-based synthesizer.
added
Don't forget behave-graph/behave-flow, the Unreal Engine Blueprints / Unity Visual Script like interaction/behavior system:
https://github.com/bhouston/behave-graph https://github.com/beeglebug/behave-flow
https://github.com/bhouston/behave-graph https://github.com/beeglebug/behave-flow
added!
I always wanted to find a nice Vanilla JS library that provided a base for what essentially is UE's Blueprints or the old Yahoo! Pipes.
This is VERY anemic, as far as features go, but if you're just looking for something easy to understand that uses native web features (vanilla js and web components), I've built a starting point: https://catapart.github.io/Magnit.NodeGraph/
the docs are missing but this looks good https://github.com/jagenjo/litegraph.js
Some Additional Local Data Processing Soft I use :
- Data preparation : https://easymorph.com/
- Data transformation : https://www.easydatatransform.com/
Also general purpose visual/dataflow python scripting like ryven.org and PyFlow
- Data preparation : https://easymorph.com/
- Data transformation : https://www.easydatatransform.com/
Also general purpose visual/dataflow python scripting like ryven.org and PyFlow
Should this list include text-to-node utils? Things like...
- Graphviz (https://graphviz.org/)
- Mermaid-js (https://mermaid.live/)
- Flowchart Fun (https://flowchart.fun/)
- Graphviz (https://graphviz.org/)
- Mermaid-js (https://mermaid.live/)
- Flowchart Fun (https://flowchart.fun/)
thanks! added.
Some of the tools listed here look like this one: https://nodes.io
I made a pull request for GoJS (https://gojs.net)
I have been building this canvas-based graphing library since 2011, and it contains a good number of features around customization and interactivity that are not found in other libraries. It is commercial for non-academic use however.
I have been building this canvas-based graphing library since 2011, and it contains a good number of features around customization and interactivity that are not found in other libraries. It is commercial for non-academic use however.
The pricing structure made it really hard to choose for a startup, if there was a more tiered approach allow easier adoption.
It looks great for our use case, but we ended up using other tools.
It looks great for our use case, but we ended up using other tools.
[deleted]
Just open an issue or PR or leave a comment here if you have any suggestions for the list :)
For DSP there is also: https://puredata.info
https://en.wikipedia.org/wiki/Pure_Data
https://en.wikipedia.org/wiki/Pure_Data
I have written 2 products with node-based UIs.
https://www.easydatatransform.com : A node based data transformation (ETL) tool where nodes are inputs, transformations (61 to choose from) and outputs.
https://www.hyperplan.com : A card-based task planner. The Professional edition supports drawing connections between tools (e.g. dependencies). It will auto-layout a graph based on the connections (which was a challenging bit of programming).
https://www.easydatatransform.com : A node based data transformation (ETL) tool where nodes are inputs, transformations (61 to choose from) and outputs.
https://www.hyperplan.com : A card-based task planner. The Professional edition supports drawing connections between tools (e.g. dependencies). It will auto-layout a graph based on the connections (which was a challenging bit of programming).
Shameless plug time! I've been working on something like this as a custom web component with no dependencies: https://github.com/catapart/Magnit.NodeGraph
Not the most feature rich - I'm developing it for a single project, so that's project's needs come first. But it's rudimentary enough to start from if you're looking to build your own, and it's simple enough to customize if it already does what you need.
Not the most feature rich - I'm developing it for a single project, so that's project's needs come first. But it's rudimentary enough to start from if you're looking to build your own, and it's simple enough to customize if it already does what you need.
Maybe add GitHub stars to this list? React Flow stands far above most (all?) of these in terms of use, maturity, and community, but it doesn’t stand out in the list.
I'm looking for a library that draws lines and arrows between boxes, but the boxes can generally be plain old div's or iframe's. HTML can do the box content, it's just the lines & arrows that are the hard part. The box connection can be the 8 compass references: N,E,S,W,NE,SE,SW,NW
FME deserves a mention, an ETL aimed at GIS data. It is the only automation tool I have ever used that doesn't make me want to switch to code. Everything can output to a node which makes it easier to understand errors. And every stage of processing can be inspected.
I'll add it. Carto just released a workflow editor for GIS data: https://carto.com/blog/introducing-carto-workflows/
>And every stage of processing can be inspected.
Isn't this the case for every node-based ETL tool?
Isn't this the case for every node-based ETL tool?
My previous employer also had a (proprietary) data transformation system like that, with a column-oriented table data structure and lazy evaluation. It was also part of a larger hierarchical system of (table) data sources and sinks. Powerful stuff.
Would you consider Labview [1] node based ui?
[1]https://www.ni.com/en-ca/shop/labview.html
[1]https://www.ni.com/en-ca/shop/labview.html
Pretty much most M&E oriented tools can be added to this list for the 3D and Visuals section. We live for nodes!
Are any of these accessible? I noticed many of them are canvas-based (especially the fancier looking ones).
Can you elaborate? Accessible is a big topic.
Could a blind person use any of these? Are there any that a blind person could?
Do any of these systems have a way of encapsulating portions of graphs so they can be reused?
[deleted]
Cool collection of elements here to browse
TouchDesigner!
It is inspired by Houdini/Nuke/Unreal. The main engine is open source ( https://github.com/polygonjs/polygonjs ) and there are more and more examples ( https://polygonjs.com/examples/ )
(edit - oh, it was already there! thank you!)