Wappler adapting a visual Flow-Based Programming UI

Mjmontgo · January 31, 2022, 4:48pm

This might be too broad of a suggestion, and maybe already being considered, but I thought I’d put it out there. I suggest Wappler explore adapting a visual Flow-Based Programming library to replace its Workflows UI.

Flow-Based Programming’s (FBP) visual paradigm appears to be where low-code development is going. In general, FBP’s visual notation needs many improvements. I personally think FBP should look more like a linear stream of routes, not multi-axis flowchart notation. No doubt we’ll see lots of innovation in the coming years on this in low-code.

In the meantime, I’m wondering whether Wappler could adapt existing FBP UI libraries. Currently, I find that all the pop-ups Wappler uses makes learning the program taxing on the mind. I see a FBP UI as the inevitable solution to this.

sid · January 31, 2022, 4:59pm

Sounds interesting. Could you share some references om how the pop-ui would look like on a FBP UI? Be it for actions pickers or query builder?

brad · January 31, 2022, 5:08pm

Maybe I don’t understand what you are trying to suggest but wouldn’t that just limit what you can do with Wappler? Like I say, I am probably not understanding your suggestion.

Mjmontgo · January 31, 2022, 7:25pm

Thanks for your response. I put this together quickly to give you a sense of what I have in mind for the visual notation. Obviously these would need a lot of work.

Flow-Based Programming Visual Notation: My main idea is that FBP would be a lot more intuitive if everything flowed in one direction.

Quick idea of UI: (Snapshot mock from Wordpress elementor) Of course this is ugly. The UI could probably borrow some thinking from Mendix and other low-code programs.

BiBo · January 31, 2022, 7:50pm

May be like this?

GlobaticoLabs · January 31, 2022, 8:16pm

Mjmontgo · January 31, 2022, 9:34pm

Yea some low code tools are on their way to getting it. This one you posted is pretty good, a nice improvement on traditional flow charts like Drakon.

Again I think a linear flow notation - and snap-to-grid - could improve the multi-direction flow chart style that’s currently being adopted by this tool and and other low code tools.

sid · February 1, 2022, 3:32am

All UI screenshots only depict a different representation of the tree view Wappler has. How would the picker and builder UIs fit in FBP?

Mjmontgo · February 1, 2022, 3:17pm

The UI aspects of incorporating Flow-based programming into Wappler would probably require significant design and development work. Offhand I dont have any unique insight into how that could be done.

NewMedia · February 1, 2022, 5:08pm

Built on the Drakon Tech editor

A smart way to break javascript down in a vertical build flow.

Example using IDE online in browser

NewMedia · February 1, 2022, 5:13pm

Bolt brings complete visual scripting to Unity, empowering artists, designers and programmers to create gameplay mechanics and interactive systems without writing a single line of code.

https://assetstore.unity.com/packages/tools/visual-scripting/bolt-163802

Mr.Rubi · February 1, 2022, 6:24pm

Hi Mike

Now you need to strain your brain a little harder to master the Wappler interface, but when you learn, the interface will start working for you. If you change the current workflow interface to an interface in the FBP paradigm, it will be easier for you to master working in a Wappler, but in the future this interface will start eating up your time in complex projects. Hundreds of hours in the trash, just because of the paradigm shift of the interface…

Have you ever worked with FBP schemes with complex logic in which there are 35+ nodes? I am yes. It’s a living hell. In some cases, it is more difficult to understand such schemes than in the code.

If the Wappler changes the current interface, with a procedural approach that is very effective and easy to read (especially with complex logic and a large number of actions), to an interface in the FBP paradigm, it will be an unambiguous downshift.

I’m just wondering what exactly is wrong with you in the current workflow interface, which has a very simple and understandable logic, as well as a very effective procedural approach to creating and reading logic? Why do you think that the FBP interface paradigm, which creates a lot of problems when creating and reading complex logic (the scheme must be constantly reduced/increased and moved in all four directions), will be better than the current workflow interface, which has extremely simple rules for working and reading?

Mjmontgo · February 1, 2022, 6:58pm

Thanks - very interesting. Yes they get it - keep it in a linear flow.

Mjmontgo · February 1, 2022, 9:19pm

I completely agree. The investment in time to learn Wappler is a no-brainer. I’m still learning it so I’m mostly commenting from the experience of going through tutorials at this point.

To your questions:
RE FBP: I haven’t worked with FBP but I’ve been exploring it, along with DSL editors and low code tools over the past year. My understanding is that software development in general is moving to a visual paradigm, and will soon solve the issues you mentioned regarding FBP’s historic limitations.

RE the challenge I find with Wappler’s current workflow: I find the many pop-ups make it taxing to keep track of what’s going on in tutorials. I think its a similar issue of too much screen-level depth that fatigues immediate memory. The original iPod solved this issue; Steve Jobs made a requirement of no more than 3 screen-level depth.

RE Why might FBP solve this issue? I thought the pop-ups might be able to replaced with a sidebar UI that places the builder UI’s in accordions drop-downs from which you drag the actions, components, data, etc to the visual flow, similar to some other low-code tools. Wappler’s Workflow Steps UI isn’t far from FBP. So building off the idea of making everything more visual, its more my intuition thinking that some improved version of FBP would advance Wappler’s Workflow UI with a visual paradigm. I haven’t sorted through the details though. Again I’m still learning Wappler.