Automating Complex Business Processes with BetterCloud's Workflows
Overview
BetterCloud, a B2B SaaS application management platform, offers powerful no-code workflows where IT teams can build automations for their business processes such as Onboarding or Offboarding of employees.
In this project, I designed and delivered a new experience for BetterCloud's workflows that enabled users to build multiple paths (or 'branches') of conditional logic into their workflows .
Some images have been purposefully blurred to conceal sensitive details
My Role
Senior Product Designer
User & Competitive Research, Storyboarding, UI Design, Prototyping, User Testing, Planning and Launch
Tools
Miro, Figma, UserTesting.com
The Problem
Users were requesting workflows to have 'branching'. In the existing experience, users had to build many workflows because BetterCloud did not offer the ability to build multiple branches of conditional logic to automate their more complex processes. Competing automation products were already offering these abilities, leaving BetterCloud behind
Users would have to separate a business process into multiple workflows because they couldn't build branches of conditional logic
The Process
DISCOVERY
Understand the problem
To better understand the need for this requested feature, I did some research to better understand what customers were asking for and what they meant by 'branching'.
My main discoveries were:
User's onboarding and off boarding processes were resulting in building many different workflows
Users were building and duplicating their onboarding or off boarding workflows, then applying them into specific organizational units based on how their company org structure is
Ideate Collaboratively and Rapidly test a solution
To get alignment on the problem, goals, and vision with stakeholders and the product manager, I led and facilitated a design sprint with a cross-functional team. I planned the activities for the sprint, mostly following Google Venture's Design Sprints structure, and recruited team members to participate in it.
The sprint team consisted of: myself, our design team, the product manager, an engineer, and a customer-facing specialist.
DEFINE NEEDS
To start defining the needs and problem statements, I had the sprint team write out ‘How Might We (HMW)’ sticky notes while listening to user interviews.
The main needs uncovered were:
Allow users to build conditional paths for more workflow flexibility
Ensure an easy-to-use interface, especially as workflows get more complex
Maintain readability and visual cues to help users read and understand their workflow
Using the themes and notes from our HMW notes, I brainstormed with the team to determine who the user is, and what our goal and challenges are.
THE USER
IT Admin responsible for onboarding and offboarding of employees.
Has some no-code experience.
Technical knowledge may be limited
Wants to free up time of doing manual tasks
GOAL
Increase the number robust workflows users build, with a decrease in number of ‘small’ workflows users are building
CHALLENGES
Can customers easily manage and read a ‘robust’ workflow?
Can customers easily troubleshoot a failed ‘robust’ workflow?
MAP
I then led team to create the map. The map would walk through each step the user would need to take to achieve their goal. This was the beginning of the user's journey that helped me start to visualize what actions the user would need to take and how they would get to their goal.
Sketch & Storyboard the User's Journey
I led the team through a sketching exercise to drive ideation. I, along with each participant, sketched out a solution based on our goal, challenges, map, and key findings. I identified a scenario to use for a storyboard, then led the sprint team to outline and wireframe each step in the user's journey based on our solution sketches. Each frame in the storyboard would map back to what would eventually be each screen or interaction in the prototype.
PROTOTYPING
I developed a prototype of the storyboard we had written. To rapidly develop the designs for each storyboard frame, I split which screens and components I and the other designers would work on. I then added in interactions and flows to develop an end-to-end prototype for testing. I wrote a testing script and outlined each scenario and tasks, and worked with the User Researcher to further refine the script.
Solutions to Test
The following are solutions that came out of the sprint's ideation sessions. I wanted to get insights into how they would perform during testing.
Introducing 'Logic Blocks'
Do users understand what a 'logic block' is in the context of building their workflow and how to use it?
Coloring blocks for organization & readability
Will adding colors on each block in the workflow help users read their workflow easily and maintain organization of logic blocks?
Edit workflows steps in a single panel
Can users easily browse, add, and configure their workflow steps with this layout?
Usability Testing
Our user researcher ran 5 moderated sessions, and I sat in on each session as an active listener and took notes.
Our User Researcher developed UX Scorecards that gave a quick overview of a user test’s findings. This one was for our design sprint’s user tests.
Define Scope
Using the results of the design sprint and user testing sessions, I began the next step in the project to start defining scope with the Product Manager. We shared and reviewed the prototype and results from the design sprint with the project’s architects, who helped us understand and define what the scope for the project would be.
Design Iterations and Decisions
While we were defining scope, I was also continuing to iterate and refine the designs.
'Logic Block' becomes 'Section'
I had to ensure the new experience would migrate existing workflows into the new experience. The concept of 'logic blocks' meant that users wouldn't be able to easily add conditional logic into their existing workflows, so I had to re-think how users would also be able to easily edit their existing workflows to include conditional logic. After iterating and testing out ideas, I landed on 'sections', that would enable users to add both conditional logic and actions into their workflow
Remove Coloring of blocks
I discovered through testing that coloring the blocks confused the user more than it helped them. They were consistently misinterpreting the meaning of the colors, and it would be technically challenging to assign random colors to the blocks. Rather, I used the indentation of blocks and section headers to aid in organization and readability of the workflow.
During my design iterations, I would receive feedback and guidance from my design team, and continuously meet with the engineers and architects on this project to maintain open communication between us on any changes or updates that was happening on the designs.
As we aligned on what scope would be for this project, I also further defined and refined designs for the edge-cases and sad paths.
This taskflow outlined the different logic pieces a user could add into a section in their workflow
Plan
When it was time to plan, I led user story mapping sessions with the engineering team to define the user stories and begin to identify the acceptance criteria.
When we were aligned on the user stories, the product manager transferred them into JIRA, where I was able to help polish the acceptance criteria, and attach design materials such as prototypes, components and specs and flows to aid each user story.
Build
The team had then went on to plan out their sprints with the user stories we had developed. I was there to help support the team as they were building, and answering any questions that came up or we had missed during planned. Engineers would give me continuous visibility into their work, and I was invovled in end-to-end testing to help identify any tech or experience-related defects.
Delivering Value
Layout change - Builder and unified library and properties
The new workflows experience introduced a 2-column workspace with the goals to:
Give users more focus and readability space on the workflow they were building
Guide them through a step-by-step flow for adding and configuring their workflow steps.
If/Else-If Conditional Logic
This enabled flexibility for users building workflows. Users could now build in multiple sections that included conditional logic, resutling in them being able to consolidate multiple workflows into one, making it easier for them to manage and modify as needed. This gave users the power to design their workflows as they needed to.
Workflow Summary - Easily read and navigate workflow
Users needed a way to easily review their workflow they had built to be confident in what they would publish. The Workflow Summary displays a collapsed outline of their workflow, while also enabling users to navigate throughout their workflow.
Challenges
An expected finish date introduced pressure
The company was getting high visibility into the project, so there was a lot of excitement about the project, and thus some amount of pressure on building it in time for a certain date. We released the first iteration, knowing it wasn’t pixel-perfect, but enough to get our customers to start using it and giving feedback. We had a list of fast-follows to address after the release to further iterate on what was built.
The problem and effort was large
We faced challenges during planning, since it was a large effort that would require multiple teams and high levels of expertise in the feature.Our goal had been to follow a continuous planning model with this project, but found that we needed to fully redesign the interface, which resulted in large amounts of work that had to be done together.
Existing users would need to become re-familiar with the new workflows experience
Workflows was a heavily used existing feature in BetterCloud. I was careful with the new experience and made sure to undergo multiple usability tests with existing customers, and customers who had voted on the feature request. I did not want to disrupt existing user's familiarity with workflows, but still delight them enough with the new experience, layout, and added capabilities for building their workflows.
Results
This was a huge win for the product and for our customers, enabling more use cases for them to finally implement.
Some results from this experience include:
Increase in customer satisfaction with a 5% increase in NPS score following quarter
Increase in customer retention, with a decrease in customers churn because of the introduction of this experience
Increase in time saved for users, making building and managing workflows more efficient
This effort required multiple teams to work together and collaborate, and I'm thankful to have had the opportunity to work on such a project that provided great value for the customers.
