[HN Gopher] Awesome Node-Based UIs
       ___________________________________________________________________
        
       Awesome Node-Based UIs
        
       Author : moklick
       Score  : 173 points
       Date   : 2022-11-17 14:51 UTC (8 hours ago)
        
 (HTM) web link (github.com)
 (TXT) w3m dump (github.com)
        
       | johnofthesea wrote:
       | For DSP there is also: https://puredata.info
       | 
       | https://en.wikipedia.org/wiki/Pure_Data
        
       | solardev wrote:
       | I was so happy to see that these are UIs for graph/diagram nodes,
       | not Node.js! Way cooler.
        
         | moklick wrote:
         | I added the header image just to avoid any confusion about
         | node.js :D
        
       | tabtab wrote:
       | 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
        
       | hellocinations wrote:
       | Bespoke Synth (https://www.bespokesynth.com/) is another cool
       | open source node-based synthesizer.
        
         | moklick wrote:
         | added
        
       | simonsarris wrote:
       | 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.
        
         | [deleted]
        
         | klysm wrote:
         | 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.
        
       | stevebmark wrote:
       | 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.
        
         | oregano wrote:
         | The repo owner of this collection is also the creator of React
         | Flow fyi. He probably wasn't trying to show off but provide a
         | list for people to browse and decide for themselves.
        
       | bevenky wrote:
       | Cool collection of elements here to browse
        
       | [deleted]
        
       | catapart wrote:
       | 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.
        
       | fuzzy2 wrote:
       | 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.
        
       | frading wrote:
       | I invite you to add https://polygonjs.com, which is fully node-
       | based (I'm the author). You can create procedural geometry,
       | shaders, behaviors, with just nodes.
       | 
       | 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!)
        
         | moklick wrote:
         | Polygonjs looks super slick!
        
           | frading wrote:
           | Thanks a lot!
        
       | bhouston wrote:
       | 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
        
         | moklick wrote:
         | added!
        
       | brasetvik wrote:
       | I think Blender is worth an honerable mention. :)
       | 
       | Geometry nodes, part of <<everything Nodes>>, is pretty
       | interesting: https://youtu.be/kMDB7c0ZiKA
        
         | fayten wrote:
         | 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...
        
         | moklick wrote:
         | Good point. If we add blender we also have to add Houdini I
         | guess :D
        
           | jasonjamerson wrote:
           | Da Vinci Resolve, Unreal Engine, everything is going node
           | based.
        
             | lattalayta wrote:
             | 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
        
           | johnofthesea wrote:
           | Also Dynamo[0] and Grasshopper[1]
           | 
           | [0] https://dynamobim.org
           | 
           | [1] https://www.grasshopper3d.com
        
       | jcelerier wrote:
       | 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 :)
        
         | whizzter wrote:
         | 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)
        
           | jcelerier wrote:
           | 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.
        
           | royjacobs wrote:
           | At least you don't have to write your own DOS extenders
           | nowadays :)
        
         | moklick wrote:
         | woow! This is so good! Just added it.
        
           | jcelerier wrote:
           | 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
        
       | vnorilo wrote:
       | I guess this is where I shamelessly plug mine ;)
       | 
       | https://kronoslang.io/veneer/tour
       | 
       | (music DSP patcher with a WASM JIT in browser)
        
         | moklick wrote:
         | super cool :) Added!
        
       | mroche wrote:
       | Pretty much most M&E oriented tools can be added to this list for
       | the 3D and Visuals section. We live for nodes!
        
       | SpaceL10n wrote:
       | Some of the tools listed here look like this one:
       | https://nodes.io
        
       | 7952 wrote:
       | 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.
        
         | moklick wrote:
         | I'll add it. Carto just released a workflow editor for GIS
         | data: https://carto.com/blog/introducing-carto-workflows/
        
       | tdjsnelling wrote:
       | 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
        
       | ilaksh wrote:
       | Do any of these systems have a way of encapsulating portions of
       | graphs so they can be reused?
        
       | moklick wrote:
       | Just open an issue or PR or leave a comment here if you have any
       | suggestions for the list :)
        
       | zamalek wrote:
       | Are any of these accessible? I noticed many of them are canvas-
       | based (especially the fancier looking ones).
        
       | melony wrote:
       | Retool Workflows
        
         | datasert wrote:
         | It looks nice but not sure if their component is open source or
         | if it is built any of the existing open source libs.
        
       | porcc wrote:
       | TouchDesigner!
        
         | porcc wrote:
         | Also Natron!
         | 
         | https://natrongithub.github.io/
         | 
         | https://derivative.ca/UserGuide/TouchDesigner
        
           | porcc wrote:
           | Also Notch!
           | 
           | https://www.notch.one/
        
       | tonerow wrote:
       | Should this list include text-to-node utils? Things like...
       | 
       | - Graphviz (https://graphviz.org/)
       | 
       | - Mermaid-js (https://mermaid.live/)
       | 
       | - Flowchart Fun (https://flowchart.fun/)
        
         | moklick wrote:
         | thanks! added.
        
       | escot wrote:
       | 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
        
         | moklick wrote:
         | I like this! The UX is quite unique. Added it to diagramming.
        
           | escot wrote:
           | Thanks! I just put up a PR for formatting the link.
        
       | jakearmitage wrote:
       | 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.
        
         | catapart wrote:
         | 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/
        
         | moklick wrote:
         | the docs are missing but this looks good
         | https://github.com/jagenjo/litegraph.js
        
       ___________________________________________________________________
       (page generated 2022-11-17 23:02 UTC)