---
title: "Create a Flow"
slug: "creating-a-flow"
updated: 2026-08-06T15:06:38Z
published: 2026-08-06T15:06:38Z
canonical: "support.whatfix.com/creating-a-flow"
---

> ## Documentation Index
> Fetch the complete documentation index at: https://support.whatfix.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Create a Flow

Whatfix Flows are sequential steps that help users learn about an objective or complete a task through a series of step-by-step actions. Flows guide users through various sequential tasks. The Flow steps display as a layer on the application page.

Use the following steps to create a Flow:

1. Log in to the application where you want to create content, and then launch the **Whatfix Studio**. ![CLM_editor plug in2](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/CLM_editor%20plug%20in%282%29.png?sv=2026-02-06&spr=https&st=2026-10-15T07%3A46%3A51Z&se=2026-10-15T08%3A46%3A51Z&sr=c&sp=r&sig=3OJoFTYJCdLzxqK7kACASi3auoyh5taJxaqzzsbSRE0%3D)
2. Click **Flow**. ![Click Flows ](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Studio_Click_Flows.png?sv=2026-02-06&spr=https&st=2026-10-15T07%3A46%3A51Z&se=2026-10-15T08%3A46%3A51Z&sr=c&sp=r&sig=3OJoFTYJCdLzxqK7kACASi3auoyh5taJxaqzzsbSRE0%3D)
3. In the Studio toolbar, select a capture mode. ![std_toolbar_capture_modes](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/std_toolbar_capture_modes.png?sv=2026-02-06&spr=https&st=2026-10-15T07%3A46%3A51Z&se=2026-10-15T08%3A46%3A51Z&sr=c&sp=r&sig=3OJoFTYJCdLzxqK7kACASi3auoyh5taJxaqzzsbSRE0%3D)

          Note:

          

- **Free floating step** is currently Beta. Contact [support@whatfix.com](http://mailto:support@whatfix.com?subject=Enable%20Free-floating%20Flow%20step%20&body=Hi%0A%0AI%20would%20like%20to%20explore%20the%20new%20Free-floating%20Flow%20step%20type.%20Kindly%20enable%20it%20on%20my%20ENT%0A%0AThanks) for more information.
- For more information on different capture modes, see [Quick Capture Modes](https://support.whatfix.com/docs/what-are-quick-capture-flows#quick-capture-modes).

1. Click the desired elements on the application page. ![Create_Flow_Leads_Click](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Create_Flow_Leads_Click.png?sv=2026-02-06&spr=https&st=2026-10-15T07%3A46%3A51Z&se=2026-10-15T08%3A46%3A51Z&sr=c&sp=r&sig=3OJoFTYJCdLzxqK7kACASi3auoyh5taJxaqzzsbSRE0%3D)
2. After you have captured the required steps, click **Done**. ![std_toolbar_done1](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/std_toolbar_done%281%29.png?sv=2026-02-06&spr=https&st=2026-10-15T07%3A46%3A51Z&se=2026-10-15T08%3A46%3A51Z&sr=c&sp=r&sig=3OJoFTYJCdLzxqK7kACASi3auoyh5taJxaqzzsbSRE0%3D)
3. Enter the name of the Flow. ![Editor_flow_name6](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Editor_flow_name%286%29.png?sv=2026-02-06&spr=https&st=2026-10-15T07%3A46%3A51Z&se=2026-10-15T08%3A46%3A51Z&sr=c&sp=r&sig=3OJoFTYJCdLzxqK7kACASi3auoyh5taJxaqzzsbSRE0%3D)

          Info:

          

- Whatfix enables you to add a Display Name for your end users. Use the Content Name for internal tracking, such as region, role, module, or release codes. Users then see the Display Name in the Self Help, Task List widgets and Exports. For more information, see [Add a Display Name to Whatfix Content](https://support.whatfix.com/docs/add-a-dislay-name-to-whatfix-content). ![The image shows the Flow name and the Display Name field while creating a flow on the Studio.](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/FlowDisplayName.png?sv=2026-02-06&spr=https&st=2026-10-15T07%3A46%3A51Z&se=2026-10-15T08%3A46%3A51Z&sr=c&sp=r&sig=3OJoFTYJCdLzxqK7kACASi3auoyh5taJxaqzzsbSRE0%3D)
- To capture additional steps, click **Add Step**. ![Click Add Step](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Click%20Add%20Step.png?sv=2026-02-06&spr=https&st=2026-10-15T07%3A46%3A51Z&se=2026-10-15T08%3A46%3A51Z&sr=c&sp=r&sig=3OJoFTYJCdLzxqK7kACASi3auoyh5taJxaqzzsbSRE0%3D)

1. Review or Edit the auto generated action text on the step.  

![SF_Click_Leads](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/SF_Click_Leads.png?sv=2026-02-06&spr=https&st=2026-10-15T07%3A46%3A51Z&se=2026-10-15T08%3A46%3A51Z&sr=c&sp=r&sig=3OJoFTYJCdLzxqK7kACASi3auoyh5taJxaqzzsbSRE0%3D)

Info:

Enter any additional information that you want to provide in the description section of the tooltip.

1. Under **Configurations**, expand **Appearance**. ![Change the appearance of the Flow steps ](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Studio_Flows_Configurations_Appearance.png?sv=2026-02-06&spr=https&st=2026-10-15T07%3A46%3A51Z&se=2026-10-15T08%3A46%3A51Z&sr=c&sp=r&sig=3OJoFTYJCdLzxqK7kACASi3auoyh5taJxaqzzsbSRE0%3D)

Change the following configurations:

- Select a Tool tip appearance from the available options.
- Select the tip **Color** from the existing color picker or enter the hex code of the desired color.
- Select the **Close (X) color** from the existing color picker or enter the hex code of the desired color.  

![Choose_Flow_Theme.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Choose_Flow_Theme.png?sv=2026-02-06&spr=https&st=2026-10-15T07%3A46%3A51Z&se=2026-10-15T08%3A46%3A51Z&sr=c&sp=r&sig=3OJoFTYJCdLzxqK7kACASi3auoyh5taJxaqzzsbSRE0%3D)

1. Expand **Position** and select the desired position of the tooltip. ![Choose_Position_Flow.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Choose_Position_Flow.png?sv=2026-02-06&spr=https&st=2026-10-15T07%3A46%3A51Z&se=2026-10-15T08%3A46%3A51Z&sr=c&sp=r&sig=3OJoFTYJCdLzxqK7kACASi3auoyh5taJxaqzzsbSRE0%3D)
2. Under the **Step Completion Rules** section, select the desired rule. For more information on the Step Completion Rules, see [Define step completion rules](/studio/docs/defining-step-completion-rules) ![Define_step_completion rules.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Define_step_completion%20rules.png?sv=2026-02-06&spr=https&st=2026-10-15T07%3A46%3A51Z&se=2026-10-15T08%3A46%3A51Z&sr=c&sp=r&sig=3OJoFTYJCdLzxqK7kACASi3auoyh5taJxaqzzsbSRE0%3D)
3. Click **Save Step**. ![Click_Save_step.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Click_Save_step.png?sv=2026-02-06&spr=https&st=2026-10-15T07%3A46%3A51Z&se=2026-10-15T08%3A46%3A51Z&sr=c&sp=r&sig=3OJoFTYJCdLzxqK7kACASi3auoyh5taJxaqzzsbSRE0%3D)

Note:

Click **Preview** to preview the Flow during the Flow creation on Studio. The Flow opens in a new tab and displays the steps that are created on the application. You must create and save at least one step to enable **Preview**. ![Click_Previewflow.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Click_Previewflow.png?sv=2026-02-06&spr=https&st=2026-10-15T07%3A46%3A51Z&se=2026-10-15T08%3A46%3A51Z&sr=c&sp=r&sig=3OJoFTYJCdLzxqK7kACASi3auoyh5taJxaqzzsbSRE0%3D)

1. Go to where you want to start the next step and then click **Add Step** on the Studio. ![Click Add Step.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Click%20Add%20Step.png?sv=2026-02-06&spr=https&st=2026-10-15T07%3A46%3A51Z&se=2026-10-15T08%3A46%3A51Z&sr=c&sp=r&sig=3OJoFTYJCdLzxqK7kACASi3auoyh5taJxaqzzsbSRE0%3D)
2. Repeat the above steps to add additional steps.

Note:

[Display Rules](/studio/docs/visibility-and-display-rule-conditions-1) enable you to configure Flows to display the tooltip only when pre-determined conditions are met.

Use the following steps to add Display Rules to Flow steps:

a. Click **Advanced Options**. ![Click Advanced options on Flow steps ](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Studio_FlowSteps_Advancedoptions.png?sv=2026-02-06&spr=https&st=2026-10-15T07%3A46%3A51Z&se=2026-10-15T08%3A46%3A51Z&sr=c&sp=r&sig=3OJoFTYJCdLzxqK7kACASi3auoyh5taJxaqzzsbSRE0%3D)

b. Expand the **Display Rules** section and then click **Add Rule**. Display Rules enable you to configure Flows to display the tooltip only when pre-determined conditions are met. ![Add display rules to Flow steps under Advanced Options](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Studio_Flows_Advancedoptions_Display%20Rules.png?sv=2026-02-06&spr=https&st=2026-10-15T07%3A46%3A51Z&se=2026-10-15T08%3A46%3A51Z&sr=c&sp=r&sig=3OJoFTYJCdLzxqK7kACASi3auoyh5taJxaqzzsbSRE0%3D)

c. Set the desired conditions. For more information on the different conditions that can be used in Display Rules, see [Visibility and Display Rule Conditions](/studio/docs/visibility-and-display-rule-conditions-1) ![Add_Rule.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Add_Rule.png?sv=2026-02-06&spr=https&st=2026-10-15T07%3A46%3A51Z&se=2026-10-15T08%3A46%3A51Z&sr=c&sp=r&sig=3OJoFTYJCdLzxqK7kACASi3auoyh5taJxaqzzsbSRE0%3D)

Add multiple conditions using **Add Rule** if needed.

1. Click **Save Flow**.  

![Click_Saveflow](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Click_Saveflow.png?sv=2026-02-06&spr=https&st=2026-10-15T07%3A46%3A51Z&se=2026-10-15T08%3A46%3A51Z&sr=c&sp=r&sig=3OJoFTYJCdLzxqK7kACASi3auoyh5taJxaqzzsbSRE0%3D)

Info:

- Edit a Flow step during the Flow creation. For more information, see [Edit a Flow](/studio/docs/editing-a-flow).
- The Flow you created is saved on Whatfix, the Flow needs to be pushed to the Whatfix CDN servers before it is available for your users. You might be able to see the content using the **Preview mode** or the **See Live** option (during content creation), but for the content to be live and reflect on your end user's application, you must publish it.

Use the following steps to push the Flow to Production:

1. On the Whatfix Guidance dashboard, click **Content**. ![Click_Content](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/image%28320%29.png?sv=2026-02-06&spr=https&st=2026-10-15T07%3A46%3A51Z&se=2026-10-15T08%3A46%3A51Z&sr=c&sp=r&sig=3OJoFTYJCdLzxqK7kACASi3auoyh5taJxaqzzsbSRE0%3D)
2. Click **Flows**. ![Click_Flows](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/image%28321%29.png?sv=2026-02-06&spr=https&st=2026-10-15T07%3A46%3A51Z&se=2026-10-15T08%3A46%3A51Z&sr=c&sp=r&sig=3OJoFTYJCdLzxqK7kACASi3auoyh5taJxaqzzsbSRE0%3D)
3. In the **Draft** stage, select the Flow, and then click **Send to Ready**. ![Move Flows from Draft to Ready ](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Dashboard_Flows_sendtoready.png?sv=2026-02-06&spr=https&st=2026-10-15T07%3A46%3A51Z&se=2026-10-15T08%3A46%3A51Z&sr=c&sp=r&sig=3OJoFTYJCdLzxqK7kACASi3auoyh5taJxaqzzsbSRE0%3D)
4. Go to the **Ready** stage, select the Flow to move it to production, and then click **Publish**. ![Push Flows to production ](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Dashboard_Flows_Publish.png?sv=2026-02-06&spr=https&st=2026-10-15T07%3A46%3A51Z&se=2026-10-15T08%3A46%3A51Z&sr=c&sp=r&sig=3OJoFTYJCdLzxqK7kACASi3auoyh5taJxaqzzsbSRE0%3D)

## Related

- [Flows Best Practices](/flows-best-practices.md)
- [Whatfix Studio does not work properly](/whatfix-editor-not-working-properly.md)
- [Overview of Whatfix Studio](/what-has-changed-on-studio.md)