--- title: "Flow Best Practices" slug: "flow-best-practices" updated: 2026-08-07T04:26:59Z published: 2026-08-07T04:26:59Z canonical: "support.whatfix.com/flow-best-practices" stale: true --- > ## 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. # Flow Best Practices **Use Flows for product tours and tutorials** Use Flows for sequential actions such as product tours, tutorials, and UI guidance. For more information on creating a Flow, see [Create a Flow](/desktop/docs/creating-a-flow). **Create simple and descriptive titles for Flows** Name each Flow clearly for easy retrieval. Use simple, descriptive words that your audience is likely to use. Keep titles concise and avoid special characters. ![Name clearly11](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Name%20clearly%281%29%281%29.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A03%3A36Z&se=2026-11-12T10%3A03%3A36Z&sr=c&sp=r&sig=IjBQrzIg3NUCytW4igqy2vP%2FEgj7TsNcITnGhZCW3U8%3D) **Avoid special characters when naming Flows** Avoid special characters when naming a Flow. Special characters can cause issues when downloading the Flow as a video. If the Flow title includes spaces or any of the following special characters (<,>,:,",/,|,,?,*,#,%,\s,\n,.), replace them with an underscore (_) when downloading the Flow as a PDF or Video. ![do not use special char.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/do%20not%20use%20special%20char%283%29.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A03%3A36Z&se=2026-11-12T10%3A03%3A36Z&sr=c&sp=r&sig=IjBQrzIg3NUCytW4igqy2vP%2FEgj7TsNcITnGhZCW3U8%3D) **Provide a brief description in Tooltips** Use simple language and keep the description in your Tooltip concise and to the point. ![Description simple.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Description%20simple%283%29.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A03%3A36Z&se=2026-11-12T10%3A03%3A36Z&sr=c&sp=r&sig=IjBQrzIg3NUCytW4igqy2vP%2FEgj7TsNcITnGhZCW3U8%3D) **Create Flows in a stable environment** Create Flows in a stable production or live application. Frequent changes to the underlying code could break the Flows. ![Stable site 111](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Stable%20site%201%281%29%281%29.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A03%3A36Z&se=2026-11-12T10%3A03%3A36Z&sr=c&sp=r&sig=IjBQrzIg3NUCytW4igqy2vP%2FEgj7TsNcITnGhZCW3U8%3D) **Limit the number of steps to 15** Limit the number of steps in a Whatfix Flow to no more than 15 steps. This enables users to understand the value proposition of the guides quickly and easily. ![Limit to 15 steps2](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Limit%20to%2015%20steps%282%29.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A03%3A36Z&se=2026-11-12T10%3A03%3A36Z&sr=c&sp=r&sig=IjBQrzIg3NUCytW4igqy2vP%2FEgj7TsNcITnGhZCW3U8%3D) **Split long Flows into two parts** If it is not possible to keep the number of steps under 15, then consider splitting the guide into two parts and interlinking them. This keeps your guide concise and simplifies user tasks. When interlinking content, ensure that the button on the end message that links to the remaining procedure is titled appropriately. Use a short, action-oriented phrase. ![Split into two2](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Split%20into%20two%282%29.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A03%3A36Z&se=2026-11-12T10%3A03%3A36Z&sr=c&sp=r&sig=IjBQrzIg3NUCytW4igqy2vP%2FEgj7TsNcITnGhZCW3U8%3D) **Interlink Flows using a clear phrase** When interlinking content, ensure that the button in the end message linking to the remaining procedure is titled appropriately. Use a short, action-oriented phrase. ![End message button linking to the next Flow](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/DB_Flow.gif?sv=2026-02-06&spr=https&st=2026-11-12T09%3A03%3A36Z&se=2026-11-12T10%3A03%3A36Z&sr=c&sp=r&sig=IjBQrzIg3NUCytW4igqy2vP%2FEgj7TsNcITnGhZCW3U8%3D) **Ensure Tooltips don't hide important UI elements on your Desktop application.** Ensure that Tooltips do not obscure important UI elements. Proper positioning prevents user frustration. ![Reposition tooltip2](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Reposition%20tooltip%282%29.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A03%3A36Z&se=2026-11-12T10%3A03%3A36Z&sr=c&sp=r&sig=IjBQrzIg3NUCytW4igqy2vP%2FEgj7TsNcITnGhZCW3U8%3D) > [!WARNING] > Note: > > Use a Free-floating step type in Flows in scenarios where you might feel the tooltip can hide UI elements. > > - With the Flow enhancement feature, you have the option to select two types of Flow steps, and not just element latching Flows. A dialog box appears on the application to highlight the two types of Flows. Under **Choose step type**, select a Flow step based on your requirements: either **Attached to element** or **Free-floating**. > > > ![Studio switcher enables you to switch between 2 flow types: element-attached flow types and free-floating flow types](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Studio_Switcher_Flow_Types.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A03%3A36Z&se=2026-11-12T10%3A03%3A36Z&sr=c&sp=r&sig=IjBQrzIg3NUCytW4igqy2vP%2FEgj7TsNcITnGhZCW3U8%3D) > > > | Attached to element | Free-floating | > | --- | --- | > | When you select this type of Flow step, it remains attached to an element on your application. | When you select this type of Flow step, it remains flexibly positioned devoid of any element attachment. | > > > - For more information, see [Free-floating Flows](/studio/docs/free-floating-flows) and [Create a Free-floating Flow step](/studio/docs/create-free-floating-flows). > - Free-floating Flows 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. **Remove sensitive information using the Blackout feature** Remove personal or sensitive information using the Blackout feature. While creating a guide, use the Blackout feature to avoid capturing sensitive information such as email, phone number, username, and more. ![blackout feature2](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/blackout%20feature%282%29.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A03%3A36Z&se=2026-11-12T10%3A03%3A36Z&sr=c&sp=r&sig=IjBQrzIg3NUCytW4igqy2vP%2FEgj7TsNcITnGhZCW3U8%3D) **Use the Spotlight feature to prevent distractions for the user** Use the Spotlight feature to capture the user’s complete focus on the element where the tip is displayed. Users cannot interact with other elements when the Spotlight tip is active. ![Spotlight feature11](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Spotlight%20feature%281%29%281%29.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A03%3A36Z&se=2026-11-12T10%3A03%3A36Z&sr=c&sp=r&sig=IjBQrzIg3NUCytW4igqy2vP%2FEgj7TsNcITnGhZCW3U8%3D) **Don't exceed the maximum image width in a Tooltip** When inserting images in content, ensure that they don't exceed the width of the tooltip. Exceeding 270 pixels introduces a scroll bar. ![distorted image2](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/distorted%20image%282%29.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A03%3A36Z&se=2026-11-12T10%3A03%3A36Z&sr=c&sp=r&sig=IjBQrzIg3NUCytW4igqy2vP%2FEgj7TsNcITnGhZCW3U8%3D) **Reduce the number of steps in a Flow using Smart Tips** Instead of creating individual steps for each field in a form, [create Smart Tips](/desktop/docs/creating-smart-tips) that describe each field. This approach allows the creation of a single step for the entire form, prompting the user to interact with the fields for more information. This further reduces the total steps in the Flow. Also, the users can choose to view tooltip help only for the fields they need information about, rather than seeing information for every field in the Flow steps. Another benefit is that you can use Smart Tips to validate user inputs ensuring the right information is entered. For more information, see [Data Validation using Smart Tips](/desktop/docs/data-validation-using-smart-tips). **Use Optional Step to ensure Flow continuity** When a field or element in an application does not appear to a specific set of users, configure such steps as Optional to maintain the continuity of the Flow. If the field or element does not appear, the Optional steps are skipped and the Flow continues to the next step. If the field or element is present in the UI, then the Flow progresses as usual. There is no need to create a separate Flow and trigger it based on the appearance of the field or element. For more information, see [Define a step as optional](/desktop/docs/defining-a-step-as-optional). **Use contrasting colors to make the Tooltip stand-out** Use contrasting colors to make the Tooltip noticeable on your website or application. This approach ensures that the Tooltips are not lost in the interface, as they cannot be distinguished from the underlying application. For more information on contrast checking, see this [contrast checker website](https://webaim.org/resources/contrastchecker/) that could help you decide. ![Contrast color2](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Contrast%20color%282%29.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A03%3A36Z&se=2026-11-12T10%3A03%3A36Z&sr=c&sp=r&sig=IjBQrzIg3NUCytW4igqy2vP%2FEgj7TsNcITnGhZCW3U8%3D) **Author clear and concise content** Use simple words and sentences while creating Whatfix content. Keep the description in the Tooltip brief and to the point. ![Description simple2](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Description%20simple%282%29.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A03%3A36Z&se=2026-11-12T10%3A03%3A36Z&sr=c&sp=r&sig=IjBQrzIg3NUCytW4igqy2vP%2FEgj7TsNcITnGhZCW3U8%3D) **Choose an appropriate theme for the Tooltip** Select the most suitable Tooltip theme to ensure the UI of the Tooltip matches your website or application’s UI. ![Bestpractices_flow_tooltip](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Configure_flow_tooltip.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A03%3A36Z&se=2026-11-12T10%3A03%3A36Z&sr=c&sp=r&sig=IjBQrzIg3NUCytW4igqy2vP%2FEgj7TsNcITnGhZCW3U8%3D) For more information, see [Change the design of the tool tip](/desktop/docs/changing-the-design-of-the-tooltip). **Add an End Message** Add an end message to all Whatfix content to ensure users are well informed about the next course of action. For more information on adding an end message, see [Customizing the end message of a Flow](/desktop/docs/customizing-the-end-message-of-a-flow). ![Bestpractices_end_message](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Bestpractices_end_message.png?sv=2026-02-06&spr=https&st=2026-11-12T09%3A03%3A36Z&se=2026-11-12T10%3A03%3A36Z&sr=c&sp=r&sig=IjBQrzIg3NUCytW4igqy2vP%2FEgj7TsNcITnGhZCW3U8%3D)