How I Solved It: Powering #BobaBlazers with a Single Screen Flow

Key business problem

#Bobablazers (formerly #bobaforce) had its first official meeting at TraiblazerDX 2022! Organized by Jenh Vo, Jessica Kwok, and myself as leaders of the local WIT Sunnyvale and San Francisco Nonprofit User Groups, we felt uniquely positioned to host this in-person event for all boba-loving and boba-interested Trailblazers.

However, when hammering out the ordering process with our vendor, we quickly realized that their online catering form had some glaring logistical problems.

• There wasn’t a group cart option where people could place their own orders and have it charged to one of our credit cards.
• The form had no way to stop orders after a specific date and time, so we ran the risk of orders coming in after the RSVP cutoff.
• If we made everyone order in person, that would take away from socializing, which was one of the main goals of our event.
• The next option was to use a Google form. But, this meant that one of us would have to transpose each order one by one to the vendor’s order form (no, thank you!). Not only would we run the risk of entering someone’s order wrong, but as community group leaders, we’re only volunteers and our day jobs still needed our attention.

How I solved it

1. Spin up a free dev org, and get hands-on with Experience Cloud

We have an Experience Cloud site, powered by a free dev org, that acts as our one-stop shop for the San Francisco Nonprofit Group. Naturally, we put the order form here by creating a new page to host the screen flow. After that 5-minute task, we just had to build out the rest of the back-end components.

Create and activate your Experience Cloud site

• Here’s a great Trailhead project that shows you how to set up Experience Cloud. You can also use it as a site for your own personal portfolio!

Create a new Experience Cloud page that will eventually host your screen flow

• For page access, make sure it’s set to Public so that it’s visible to anyone who accesses it.

2. Create your object, fields, and email template

Objects and fields:

• We created a custom object called Orders.
• The object contained all new picklist fields except for:
  • Main Drink (formula field for reporting that shows the drink selected from one of the six drink categories)
  • Toppings (multi-select picklist)

Email template:

• • For our purposes, we created this email directly in the flow as a text template.
  • Pro Tip: To use an email template that exists in your org, call an email alert instead.

3. Assemble your flow!

• The following screenshots show the details of the components, with the completed flow at the end.

Password screen (wizard)

Password screen (details)

• Note the value in the formula field. “Password_constant” is a simple text element in the flow that contains the password value. If what the person enters in the screen doesn’t match the value in “Password_constant”, they get hit with the error message.

Boba order screen (wizard)

Create Contact Record element (details)

• We decided to create contact records for everyone who registered so that we could associate any future orders with them. (Who knows what else we could repurpose this screen flow for?) But, if you wanted to keep everything extremely simple, you could have these fields captured on the custom object instead.

Create Order Record element (details)

• This Flow element shows how we mapped everything from what the user inputted to the actual Order record that will be created in Salesforce. As you can see, if you keep your field’s API names matched to their labels, the mapping is much easier to understand (and debug later).

Get Order ID (details)

• Records, and their values, created within a flow are not automatically saved for use. To actually use the data from the record created above, you need to use this Get Record element to retrieve the record you just created.

“Send Email” core action (details)

• This Send Email element contains all the info we needed to send a confirmation email to the user once their order was placed.
  • Tip: The actual email template is {!ttEmailBody} which is referenced above when you create your object, fields, and email.
• The recipient's email address is the value we have from the Screen element where they placed their order.

Confirmation Screen element (details)

• It’s always nice to let people know their order was received and to play back their order to them.

Completed flow!

Business results

Lastly, we contacted the vendor to confirm it was okay to send them a nice Excel report, exported from Salesforce, instead of filling out their form individually, thereby saving us at least 60 to 90 minutes and countless headaches.

I have no doubt they agreed to this process only after seeing how neatly we separated out everyone’s requests and drink preferences. As organizers, we didn’t have to worry about anything order related after the form went live. We knew we could export the final results and get it to our vendor within 5 minutes of our RSVP cutoff time. So, a win-win for everyone.

Do try this at home

This example was real and it was used to simplify our event logistics to make our volunteer lives as event organizers, and the vendor’s life, just a little bit easier.

Although this was used to solve a non-work problem, you can definitely incorporate pieces of this solution in your work scenarios. I’m sure you can think of times when you need an email alert, a password screen to keep people out, or a neatly organized report.

Let us know what you thought of this solution on social, and tell us how you want to use it with #AwesomeAdmins #HowISolvedIt.

Resources

• Trailhead Module: Flow Builder
• Trailhead Module: Flow Troubleshooting
• External Site: Medium: How We Powered #bobaforce at TDX22 with a Single Screen Flow

Want to see more good stuff? Subscribe to our channel!