✕
Admins / Developers / Flow

How to Create a Salesforce Screen Flow

By Andreea Doroftei

June 22, 2022

Salesforce Flow – now the hottest out-of-the-box tool available – caters for anyone administering a Salesforce instance, from complete beginners to experienced architects. 

There are multiple types of flow, and the sky’s the limit when it comes to choosing how simple or extremely complex they can be. We will begin with Flow basics, before focusing specifically on how you can get started using Salesforce Screen Flows. 

What Is a Flow in Salesforce?

Before jumping into screen flows, let’s talk about Salesforce Flow in general. Simply put, flows are the new best friend you didn’t know you needed. Since Salesforce recently announced that Workflow and Process Builder are being retired in favor of Flow, the demand (as well as curiosity) around this functionality has seen a drastic increase in the ecosystem. 

Salesforce Flow is an automation tool that can support most required business processes. It offers far greater capabilities and improved performance when compared to WorkFlow Rules or Process Builder. For example, flows can run before save (similar to Apex), which improves performance. There are quite a few types of Flow, which you can see highlighted below. Salesforce have done a great job of including a short explanation for each type (directly in the Flow Builder) to help you make the right choice before starting the build. You can also find more information about each type in the official documentation.

It’s important to note that, while you can opt to start from scratch, existing flows can be marked as templates for further development. Salesforce also provides some out-of-the-box templates for standard processes such as user provisioning. There are also many more free templates to try out on AppExchange. 

What Is a Salesforce Screen Flow? 

Screen flows provide a way to guide users through a business process; they provide instructions or call scripts, prompt users to complete certain fields, and then perform actions behind the scenes such as Record Create or Record Update. Your users will move through a series of screens that you have created – all without you having to write a single line of code. 

When I first heard about Salesforce Screen Flows, the functionality did seem very interesting. However, I never expected it to be so user friendly, especially when creating from scratch without being an experienced developer. Salesforce proved me wrong!

Layout and Features

The key element that differentiates this type of flow from all others is the Screen Element. This is what we will configure and what users will see.

As previously mentioned, a single Salesforce Screen Flow can have multiple screens. These displayed screens will sit on your Flow canvas alongside your other elements. You can find out more about each flow element here. 

On the screen flow, the components panel on the left represents the items available to be displayed within the screen element itself. This is where you will find standard components such as picklist and text, as well as custom components that have either been developed internally or come from managed packages. 

Here are a few examples of useful components:

  • Email: This component is very handy when an email address is needed from the user running the screen flow.
  • File Upload: Exactly as the name says, this will allow your users to import files directly through the screen flow. This is especially handy as users won’t have to navigate to other pages to add files. 
  • Toggle: A personal favorite of mine, this component is fun for the user experience within a screen flow as it can replace a checkbox or a yes/no picklist. 

We will not be using the Fields section during this post. However, you should definitely explore this further, as it allows the adding of fields directly from an object within the screen flow with some of the attributes already configured. This saves quite a bit of time, especially if you are adding a large quantity of fields. On top of this, as you will see in the image below, it reminds you about the required fields that should be completed for the record. You can find more information about this beta feature here.

Where Can a Screen Flow Be Used? 

I’d say everywhere! If the process can be broken down into steps that require user input (or acknowledgement) and it should be displayed for users based on record criteria or on previous choices in the flow, then a screen flow is appropriate. 

A Salesforce Screen Flow can be beneficial to many different types of users and teams. There are plenty of use cases for screen flows which can be accessed in different ways in Salesforce, including Lightning Record Pages, custom actions and buttons, or even a utility bar. 

One of the most common examples is using a screen flow to collect data in order to create a record. 

How to Create a Salesforce Screen Flow

Now that we have covered the basics of a screen flow, it’s time to get hands on! We’ll go through a step-by-step tutorial on how to create a screen flow, how to expose it to your users and, of course, how to make sure your flow works as expected. 

Create the Flow 

For this example, I have chosen to create a flow that will allow users to create a Contact. 

Keep in mind that while I have only used a few fields, multiple fields and screens can be added to support your use case. Don’t forget to account for any existing validation rules! 

42 STEPS

1. The first step is to open Flow Builder and choose Screen Flow.

Step 1 image

2. Click Create.

Step 2 image

3. I prefer to always switch to Free-Form, but you can always make use of Auto-Layout if you prefer.

Step 3 image

4. With your mouse, click and drag the Screen Element onto the canvas.

Step 4 image

4b. Drop

Step 4b image

5. Every component needs a Label which you can type in, and the API Name will be populated automatically.

Step 5 image

6. Optionally, you can also add a Description.

Step 6 image

7. Both the Header and Footer can be configured, but for this specific scenario we will only change the Footer. Click on Configure Footer.

Step 7 image

8. We’ll use a custom label instead of the standard Finish button.

Step 8 image

9. Enter whichever value you’d like for the button to display.

Step 9 image

10. We’ll also hide the Previous button. Click Hide Previous.

Step 10 image

11. From the Components panel, click and drag Lookup, then drop it on the screen.

Step 11 image

11b. Drop

Step 11b image

12. The Lookup component is what will allow users to choose an existing record to relate the newly created one. In this case, we will complete the details to display Accounts.

Step 12 image

13. For the Label, you can type in anything you want – in this case, the users will see Choose Account.

Step 13 image

14. Choosing the Account also needs to be mandatory, so it can be made Required, by setting the value in the field to $GlobalConstant.True.

Step 14 image

15. With your mouse, click and drag the Text component, then drop it under Choose Account. We will need two Text fields, to account for both First and Last Name.

Step 15 image

15b. Drop

Step 15b image

16. Click the first Text component, and set the Label to First Name (API Name will automatically be completed). Also, check the Required box for this information to be mandatory for users to input.

Step 16 image

17. Click the second Text component, and set the Label to Last Name (API Name will automatically be completed). Also, check the Required box for this information to be mandatory for users to input.

Step 17 image

18. Lastly, click and drag the Email component, then drop it under the last Text component.

Step 18 image

18b. Drop

Step 18b image

19. You will have to input an API Name and also change the Label if you’d like.

Step 19 image

20. The Email will also be Required, so the value in the field should be changed to $GlobalConstant.True.

Step 20 image

21. Note that you can also easily edit the Placeholder Text if needed.

Step 21 image

22. Click Done.

Step 22 image

23. With your mouse, click and drag the Create Records component, then drop it on the canvas.

Step 23 image

23b. Drop

Step 23b image

24. Similar to other components, a Label is needed, and the API Name will automatically complete.

Step 24 image

25. We will create only one record at a time so no change to the default value there, but in the How to Set the Record Fields section, click on Use separate resources, and literal values.

Step 25 image

26. Click Object and choose Contact.

Step 26 image

27. Now we will start assigning the values captured from the user on the screen for the new Contact.

Step 27 image

28. Click Value

Step 28 image

29. Start with the AccounId Contact field, which should be populated with the AccountId from the Lookup component which contains the Account the user chose. Click Account (API name given to the Lookup component) in the Screen Components section.

Step 29 image

30. Choose the Record Id.

Step 30 image

31. Click Add Field, and continue adding the Screen Components values : First Name, Last Name and Email.

Step 31 image

32. Check the fields are correctly mapped, then click Done.

Step 32 image

33. Optionally, the last thing we’ll add is a success screen. Click and drag the Screen Element onto the canvas.

Step 33 image

33b. Drop

Step 33b image

34. After adding a Label for the element, drag and drop the Display Text component.

Step 34 image

34b. Drop

Step 34b image

35. Type an API Name for the Display Text component.

Step 35 image

36. Write the message you’d like your users to see.

Step 36 image

37. You can then change the color, the alignment or even add images and hyperlinks.

Step 37 image

38. Keep in mind that you can also set the Component Visibility based on criteria if desired.

Step 38 image

39. Scroll down and click Done.

Step 39 image

40. If you have used Free-Form, make sure to connect the components between them prior to clicking Save.

Step 40 image

41. You’ll have to choose a label for the flow (API Name will get automatically populated) and a Description if desired, then click Save.

Step 41 image

42. The flow can now be activated. Click Activate.

Step 42 image

Here’s an interactive tutorial

** Best experienced in Full Screen (click the icon in the top right corner before you begin) **

https://www.iorad.com/player/1975344/How-to—Create-Screen-Flow-1

Make the Flow Available in the Interface 

As mentioned above, the flow can be accessed in a few different ways – we will explore one of them, but feel free to try any other option that suits your use case best.  

We will add the flow we just created to the Lightning Home Page within the Sales Lightning App. For the sales team in particular, it is important to make this process as seamless and accessible as possible (with the least number of clicks).

11 STEPS

1. For this example, we will add the flow to the Homepage in the Sales App. The first step is to navigate to Home and click the Setup Wheel.

Step 1 image

2. Click Edit Page.

Step 2 image

3. After the page loads, drag the Flow standard component, then drop it on one of the available spots on the Lightning Record Page.

Step 3 image

3b. Drop

Step 3b image

4. Click the Flow Component, and choose the newly created Create Contact Flow or another flow you’d like to add.

Step 4 image

5. Click Save.

Step 5 image

6. Click Back to navigate onto the Homepage we started from.

Step 6 image

7. The Screen Flow is now available, and we can take it for a spin!

Step 7 image

8. Choose an Account the Contact should be related to.

Step 8 image

9. Enter a First Name, Last Name and Email address. Once ready, click Create.

Step 9 image

10. Once the success message comes up, you can click Finish.

Step 10 image

11. If we navigate to the Account record which was chosen in the flow, we’ll see the newly created Contact.

Step 11 image

Here’s an interactive tutorial

** Best experienced in Full Screen (click the icon in the top right corner before you begin) **

https://www.iorad.com/player/1975422/How-to—Create-Screen-Flow-2

Test Your Screen Flow

Once the flow is ready, it should be thoroughly tested prior to reaching your user base in production. The easiest way to test the screen flow is to use it in the interface in a Sandbox and see if it works as expected. 

Considering the flow complexity, testing in a developer sandbox might be sufficient for a simple automation. But if a flow has broader impact, either on the existing implementation or on the user experience, testing should be completed A-Z including the UAT – as well as any integration testing, if needed. 

You should definitely use the Debug button which appears when the flow is opened within Flow Builder. The screen behavior will be the same as the interface (including the required fields), but it will give exact information as far as the values for each component are concerned, and any errors if they occur.

Note: If any errors appear while the flow is live in production (and even in the Sandbox when used from the interface), you will receive an email with details for you to troubleshoot. 

Don’t forget that Trailhead is also a great resource to learn. This trail not only includes information about Salesforce Flow, but also really fun hands-on challenges and even a module on testing. 

Note: Testing should be done for any flow or automation, not just for screen flows! 

Key Considerations

  • Salesforce Screen Flows always require some sort of user interaction. If you’d like a fully automated flow, consider one of the other flow types such as “record-triggered” or “scheduled” flows.
  • There is no actual limit as to how many screen flows you can have, but keep in mind that having multiple components will increase the load time. 
  • Screen flows can be accessed in many ways. They can be embedded into a Lightning Record Page, custom actions, custom Lightning Web components, Visualforce pages, and more. 
  • You can choose when and if a screen is actually displayed to the user running the flow by leveraging the conditional visibility.

Summary

Now that you have built your first Salesforce screen flow and are familiar with Flow basics, it’s time to get hands on and continue your journey. Be sure to keep practicing in a developer org and check out our other Flow articles to keep building your skills!

Here are a few suggestions to get you started:

If you want a complete guide to learning Flow, check out the Ultimate Salesforce Flow Foundation Course. This course covers everything you need to know to be successful at building Flows. The course includes written guides and instructor-led videos, plus step-by-step tutorials for creating both a screen flow and a record-triggered flow! 

Register your interest for 25% off.

You may also be interested in FlowFest – the world’s first live Flow competition, combining learning, fun, and just a little competitive spirit from the contenders! Watch FlowFest V2 here.

The Author

Andreea Doroftei

Andreea is a Salesforce Technical Instructor at Salesforce Ben. She is an 18x certified Salesforce Professional with a passion for User Experience and Automation. 

More like this:

Leave a Reply