Automation 2.0

Make automation configuration in SaaS management platform super-easy and allow any SaaS business process in a single workflow.

Context

The new automations management mechanism with canvas and conditional logic for creating and maintaining advanced dynamic workflows.

My role

Product Designer - UX research, user flows, rapid prototyping, visual design

Timeline & Status

4 moths, Launched in October 2023

Outcomes

Business impact

  • In the first month, 20% of customers used branching in workflows
  • A large number of suggestions for further enhancements were received from the customers
  • Great reception and fast adoption of the new design by the customers

The challenge

The existing automation flow suffers from a lack of conditional logic,
creating a few issues:

  • Too many similar workflows, leading to tedious management and error-prone maintenance.
  • Conditional tasks like approval follow-ups or branching based on success/failure become impossible.

Research

Data Analysis

According to the data the solution should accommodate workflows with:

  • Complexity:
    Many branching paths to handle variations in processes. These branches can be nested up to two or three levels deep
  • Variable Length:
    While most workflows will be concise, some, like onboarding and offboarding, can be lengthy. The UI should prioritize clear navigation and user orientation within these extended workflows

UI of conditional logic in automation products

  • Non visual UI
  • Highly visual UI with canvas
  • Semi-visual UI (used for single IF/ ELSE conditions)

Hypothesis

  • Implementing an open canvas solution that supports unlimited number of conditions will Increase the workflow adopters’ satisfaction, as the workflow management will be more effective
  • Implementing an open canvas will eliminate blockers around additional use cases and increase the automation adoption

Solution

Proposed solution

  • Replace the current workflow configuration UI with flexible canvas
  • Add out-of-the-box building block If / Else branch that has 2 branches by default and allows adding more

KPIs

  • Number of active workflows with conditional logic
  • Number of valid branching actions in active workflows
  • Customer feedback and sentiment

User journey

Enhanced automation flow

  • Defines workflow type
  • Chooses the trigger type
  • Adds actions/ conditions
  • Activates the workflow when done

UI design

Designing powerful workflows

To empower users with maximum flexibility, I opted for an open canvas workflow builder. This enables the creation of complex workflows with numerous steps (nodes) within a single view.

Maintaining user focus during editing was crucial. I achieved this by utilizing a drawer panel component for action editing tasks. This keeps the broader automation flow visible while users concentrate on the details of a specific step.

For efficient navigation in workflows of varying complexity, I implemented zooming functionality. Users can seamlessly switch between a detailed view of individual steps and a high-level overview of the entire workflow.