馃挕 UX Solution: Choosing between web-form and flow-chart style workflow builder
What's this issue all about? (Background and context)
This issue documents the decision to choose web-form over flow-chart styled UX for authoring workflow automation.
TL;DR
Give the problem to the right people while letting them choose their own tools.
Webform-based builder, as proven by Zapier's popularity, is capable of configuring simple automation with a minimal learning curve. Therefore, we should choose web-form style to kick off the MVC but leave the door open for it to iterate.
Background
There are essentially two types of UX for building workflows: flow-chart and web-form.
Flowchart-based Workflow Builder
The flowchart-based solutions typically provide a canvas for drag-and-drop components and making connections. Products in this category tend to focus more on the reusability of the components, data flow, branching and looping logic. You may find this construct closely resembles the core concepts in computer programming, therefore they are more popular among technical users. To highlight a few:
Notable products:
- https://www.workato.com/
- https://tray.io/
- https://n8n.io/
- https://nodered.org/
- https://docs.aws.amazon.com/step-functions/latest/dg/workflow-studio.html
Proof of concept:
To learn the technical challenges and prove the technical viability, I conducted a PoC as below.
Screenshot:
This demo shows the overall authoring experience and the technical feasibility for such a tool to be built natively inside GitLab.
Pros:
- Flow-chart style is capable of expressing more complex logic such as branching & looping
- The visual representation with auto-layout makes complex workflow more comprehensible
Cons:
- This solution resembles visual programming, which is notorious for overpromising its capability for tackling complex real-world problems.
- Not compatible with GitLab Triage
- Given the inherited complexity, it takes much more effort to implement. So perhaps not the best choice to kick off the MVC.
Webform-based Workflow Builder
What is a webform-based workflow builder?
The web-form based solutions usually take away the flow control and leave the users with a much more guided experience, such as a step-by-step wizard to collect configuration info. General users who are comfortable with web forms can find themselves at home.
Notable products
- https://zapier.com/
- https://www.airtable.com/product/automations
- https://www.atlassian.com/software/jira/features/automation
- https://ifttt.com/
- https://support.apple.com/en-au/guide/shortcuts/welcome/ios
- https://notion-automations.com/
Proof of concept:
The proof of concept is mainly to validate the idea of using GitLab Triage as the underlying DSL.
Screenshot:
Pros:
- Minimal learning curve involved
- Requires less effort to implement
- The guided experience means less can go wrong
- Can generate DSL compatible with https://gitlab.com/gitlab-org/ruby/gems/gitlab-triage. This means no need to reinvent another DSL.
Cons:
- Cannot express logics such as loop and branch
- Only capable of expressing simple if-then-else rules
What hypotheses and/or assumptions do you have?
- The feature would mostly benefit the below personas: