Generating Simplified Flowchart

A Faster and Easier Process to Save Time and Improve Collaboration Quality

Sponsor

Rachael Raymer

(Lead Product Designer) @Salesforce

Rachael Raymer

(Lead Product Designer) @Salesforce

Elisa Krebs

(Senior Product Designer) @Salesforce

Elisa Krebs

(Senior Product Designer) @Salesforce

Personal Contribution

User Interview Question Design

User Interview Result Analysis

User Interview Qualitative Analysis

Hosted 8 User Interviews

Idea Generation and Refinement

Design Documentation

We Made Rebuilding Flowcharts Faster and Easier

Saving Time While Creating an Ideal Collaboration Experience

Current Scenario

Collaboration Takes Place Outside of Salesforce Platform

Users need to spend hours rebuilding simple version flowcharts and getting feedback from clients through external visualization tools.

In the Future

Users can Build Simplified Version Flowchart by One Click

The generated simple flowchart is created with AI summary and it is based on users' current built automation flow. Users can edit the flowchart to personalize it and invite or share it with clients for feedback.

See How We Made it

Ideas Generated from 9 User Interviews

Simplified Flowchart

AI Summary

Edit Tool Box

Comment / Export / Share

New Information Architecture

AI-generated Simplified Flowchart

Less time for rebuilding another flowchart

Simplified version flowchart is generated after admins click the "generate simple diagram" button, and it is created based on the flow they are currently working on. It saves time for admins to filter technical and unnecessary information from the original flow for clients, and also the time they spend for manually creating simplified version flowcharts.

Simplified Flowchart

AI Summary

Edit Tool Box

Comment / Export / Share

New Information Architecture

AI-generated Simplified Flowchart

Less time for rebuilding another flowchart

Simplified version flowchart is generated after admins click the "generate simple diagram" button, and it is created based on the flow they are currently working on. It saves time for admins to filter technical and unnecessary information from the original flow for clients, and also the time they spend for manually creating simplified version flowcharts.

Skip to Solution Section

or keep scrolling to see the research process

User Feedback

Salesforce Consultant A

"The last flow I built had closer to 300 elements. So like that was way too complicated for me to be able to provide for the client as documentation. So being able to just spit out from that, like. give me the simple version of this."

Salesforce Consultant A

"The last flow I built had closer to 300 elements. So like that was way too complicated for me to be able to provide for the client as documentation. So being able to just spit out from that, like. give me the simple version of this."

Salesforce Architect A

“Being able to have something like this that I could export and show my clients the high level would be helpful.”

Salesforce Architect A

“Being able to have something like this that I could export and show my clients the high level would be helpful.”

Salesforce Consultant B

“And for someone who doesn't know how to read a technical flow. This can feel less intimidating and more accessible.”

Salesforce Consultant B

“And for someone who doesn't know how to read a technical flow. This can feel less intimidating and more accessible.”

Unlock Automation

Streamline Repetitive Work

Current Flow Builder user interface

What is Automation?

Automation — What makes repetitive work easier and faster

Automation is a way to streamline tasks that are often repetitive. Automation can help with very simple task such as sending notification every Friday morning, and also complex task that involve data input and output.


Where building happens — Flow Builder

Flow Builder is an automation workflow building tool powered by Salesforce. Flow Builder create a no-code/low-code environment where users can easily create automation workflow by connecting blocks with different functionalities.


Who is Using It?

Admin

Users who build flows for more diverse use cases—such as onboarding processes, marketing campaigns, customer service, sales, and pipeline management, among others.

Marketer

Build automation flow specifically for marketing campaigns.

Collaboration Patterns in Automation Projects

Uncovered 4 Phases in Automation Projects

Understanding the structure of automation project provides direction for designing user interview questions specifically facing each phases, and explore details that are not uncovered from the desk research.

Different Interview Question Sets

To Find the Different and Shared Challenges

The purpose is to broadly explore the common challenges that both user groups are facing. After further validations from interviews, we can either narrow down to one specific focus area or develop solutions that cover the needs from two user groups.

Snowball Method — Hypothesize, Test, and Refine

We did third rounds of interviews throughout the project. Each set of interview questions was refined and adjusted based on the analysis of previous interviews, allowing us to continuously test and validate our hypotheses.

Do We Need Two Personas?

To Simplify Research Process

No. Admins and Marketers share identical collaboration patterns based on the user interview result from two different question sets. Thus, we decided for the following research and design process, we merged two personas into one persona as "admin users".

For the following sections, "admin" will be used as the generic term that indicates our target user group.

Focus Area — Visualization Tools

Uncovered 3 Main Challenges, and
Narrowed the Scope Down to 1 Focus Area.

Uncovered 3 main challenges, and narrowed the scope down to 1 focus area.

Collaboration challenges distributed to each phases

Visualization Tools

Define the Minimum Scope that Makes the Most of Value to Salesforce

Although we uncovered multiple challenges, considering the limited time, business value, and feedback from the product managers in Salesforce side, we decided to go down this way. Here is why:

Cover Multiple Phases' Needs

Visualization tools is essential for clear communication, especially in the 3 phases shown above. Admins visualize the complex automation flow into a simpler flowchart for their clients to understand how the automation flow works as the project goes.

Expanded from Salesforce Native System

Admins currently use external visualization tools that leads to the fact that the most important collaboration process happens outside of Salesforce platform, and we saw this as an opportunity to bring the collaboration experience back to Salesforce platform.

Simplified Version Flowcharts

As a Communication Tool and Documentation Reference

Lower the complexity of automation flows

Admins largely use external visualization tools like Lucidchart, Miro, Excel, or PowerPoint to create simplified versions of automation flows to lower the complexity of automation flow for clients to understand the process and structure of the automation flow.

Refresh memory after a long feedback loop

Besides using simplified flowcharts as communication tools, they are often used as the documentation materials for admins to refresh memory while update are needed and for admins to hand off the project to the next admin.

See more details about other collaboration challenges we found

1

Communication Related Challenges

1

Communication Related Challenges

2

Admin-Admin Collaboration

2

Admin-Admin Collaboration

3

Keeping Document Updated

3

Keeping Document Updated

Marketing Cloud Consultant

"We use Lucidchart to create diagrams and flows, simplifying our explanations. This makes it easier to show stakeholders what’s happening step-by-step."

Marketing Cloud Consultant

"We use Lucidchart to create diagrams and flows, simplifying our explanations. This makes it easier to show stakeholders what’s happening step-by-step."

Marketing Strategist

"If someone isn't familiar with Journey Builder, they don't understand the complexity (of the autoamtion flowchart)."

Marketing Strategist

"If someone isn't familiar with Journey Builder, they don't understand the complexity (of the autoamtion flowchart)."

Salesforce Admin

"I end up spending extra time creating visuals just to help them understand."

Salesforce Admin

"I end up spending extra time creating visuals just to help them understand."

Hidden Problems

While Creating Simplified Version Flowcharts

Simplified version flowcharts certainly improves the communication with clients and bridge knowledge gaps. However, the process of making it takes long time and effort due to several reasons.

Root reasons with corresponding issues

Different Target Audience of Simplified Version Flowcharts

Salesforce Admin

"A client is not going to care what element I put in here (in automation flow flies). They're going to care how the process works"

Salesforce Admin

"A client is not going to care what element I put in here (in automation flow flies). They're going to care how the process works"

Filter Information — Client Facing vs. Admin Facing

Clients want to see the "process steps" and "structure" of automation flows, and Admins need to see technical details such as variable, API, elements, and so on.

Simplified Version Flowcharts Need to Keep Updating

Salesforce Admin

"If I were to update the flow, I'd then have to go back and update the Lucidchart to keep them in sync. Otherwise, the documentation would be out of date."

Salesforce Admin

"If I were to update the flow, I'd then have to go back and update the Lucidchart to keep them in sync. Otherwise, the documentation would be out of date."

Admins Make Simplified Flowcharts as the Project Goes

It could happen during discovery phase, building phase, or even after the automation flow is completed due to follow up changes. Accordingly, documentation has to be updated as well.

Lack of Integration to Native Salesforce System

Salesforce Solution Architect

"It took me an hour and a half to do a recorded me walking through the flow step by step of what it did, and another couple hours to build a Lucidchart of the simplified version"

Salesforce Solution Architect

"It took me an hour and a half to do a recorded me walking through the flow step by step of what it did, and another couple hours to build a Lucidchart of the simplified version"

Spend Extra Time for Rebuilding

Admins might have to rebuild simplified version flowcharts from scratch every feedback loop, and it takes longer when it comes to more complex automation flows.

Spend Extra Time Gathering and Organizing Feedback

When implementing feedback from simplified version flowcharts back to flow files in Flow Builder, admins have to gather feedback from place to place and organize feedback.

Poor Rebuilding Experience

During rebuilding, admins have to jump between screens or tabs, which leads to a bad user experience.

Unnecessary Information Shown

Some admins use screenshots of actual flow files to create simplified version flowcharts(see figure above). However, these may include unnecessary information, potentially raising unexpected questions from clients.

New Collaboration Experience

What Will Happen after One Click?

What is Included?

Simplified Flowchart

AI Summary

Edit Tool Box

Comment / Export / Share

New Information Architecture

AI-generated Simplified Flowchart

Less time for rebuilding another flowchart

Simplified version flowchart is generated after admins click the "generate simple diagram" button, and it is created based on the flow they are currently working on. It saves time for admins to filter technical and unnecessary information from the original flow for clients, and also the time they spend for manually creating simplified version flowcharts.

Simplified Flowchart

AI Summary

Edit Tool Box

Comment / Export / Share

New Information Architecture

AI-generated Simplified Flowchart

Less time for rebuilding another flowchart

Simplified version flowchart is generated after admins click the "generate simple diagram" button, and it is created based on the flow they are currently working on. It saves time for admins to filter technical and unnecessary information from the original flow for clients, and also the time they spend for manually creating simplified version flowcharts.

The Story Before

It could take hours for admins to create a simplified version flowcharts for better communication quality with clients.

It could take hours for admins to create a simplified version flowcharts for better communication quality with clients.

Admins have to jump between screens (Flow Builder and Lucidchart).

Admins have to jump between screens (Flow Builder and Lucidchart).

Admins have to spend extra time gathering and organizing feedback from different platforms.

Admins have to spend extra time gathering and organizing feedback from different platforms.

If feedback loop takes too long, admins have to go through the whole flow to refresh memory.

If feedback loop takes too long, admins have to go through the whole flow to refresh memory.

The Story After

Admins can create a simplified flowchart by one click without spending time filtering information and manually filling out text input.

Admins can create a simplified flowchart by one click without spending time filtering information and manually filling out text input.

Admins can easily organize feedback in one place.

Admins can easily organize feedback in one place.

Admins can use AI summary as self-notes that helps them easily refresh memory after a long feedback loop.

Admins can use AI summary as self-notes that helps them easily refresh memory after a long feedback loop.

What is Even Better?

Proof of Concept

ChatGPT Can Do This

The Prompt

We put a PDF file that contains a screenshot of an automation flow from Flow Builder into ChatGPT, asking AI assistant to make it a simpler flowchart.

The Result

ChatGPT generated a simplified flowchart image that is constructed by Python with Graphviz Package.

Possibility of Integrating this into Flow Builder

XML to Static Image

The underlying structure of the automation flow in Flow Builder is XML. It is possible to use Python filter the nodes and transform them into a new flowchart static image with Graphviz.

XML to Editable Flowchart

To make a simplified flowchart to be editable, like Figjam, the possible way to achieve this is transforming XML to XML using Python, and visualize XML to front-end elements using JavaScript visualize framework.

Stretch Goals

That We Should Keep Working on

Filter Options

When Facing Different Target Audience

The current "Generate Simplified Flowchart" function does not include more detail filter options such as filters that address with the situation when facing clients who have different level domain expertise and admin-oriented filter that aims specifically for documentation or future handoff.

How Can We Achieve?

To develop a filter option, we need a clearer understanding of user profiles. Admins work on diverse topics, and each topic may involve clients with varying levels of understanding and requirements.

Additionally, research on client side and their experience is needed since collaboration goes both ways.

Admin and Admin Collaboration

When Multiple Admins are Working Synchronously

Among the 6 interviewees, although only 1 participant mentioned the experience of working on the flow file in Flow Builder 'at the same time' with another co-admin, this result indicates the need to consider collaboration between admins

How Can We Achieve?

In addition to the need for more samples, we must explore the collaboration patterns that exist between admins and understand why they need to collaborate in this way.

Think like a designer, ship like a dev.

Think like a designer, ship like a dev.