How to create a Kiosk Flow - General Flow

This article will walk through the process of creating a new Kiosk Flow.

Start by navigating to the Patch portal and logging in. Select the ‘Kiosk’ module from the left sidebar menu.

Then select the (+) button in the lower right corner to ‘Create a New Kiosk Flow’.

When creating a new Kiosk flow it will ask to name the flow. After naming the flow, select ‘OK’.

The Kiosk flow editor will open after clicking ‘OK’ to save the Kiosk flow name.

By default, the Kiosk editor will automatically include the ‘Welcome’ page. The ‘Welcome’ page must be the first page in every Kiosk flow.

To get started, we will first cover the overall layout of the Kiosk Editor, and then we will dive into building a complete flow.

Note: Be sure to save your work regularly using the Floppy Disk icon in the top right corner. Building Kiosks Flows can often take time and if you build the entire flow without saving as you go there is a risk that servers can timeout and you may lose your work. Saving often throughout this process will help prevent this from happening and in the event it does the amount of work lost will be limited.

Before we dive into the overview and details about setting up the Kiosk Flow it’s important to note that most standard Kiosk Flows will consist of the following pages:

• Welcome
  • Begin Checkin/Sign In 
• Splash
  • Loading…/Thank You
• Fields
  • Collect Customer Data/Complete their Customer Profile
    • • Name, Birthday, Email
• Selection
  • Custom configure buttons that may be selected or unselected in any order/quantity (select 1 or many). Each button can have one or more actions tied to it such as setting a value on a data field or adding additional points to a punch card, and is also used for collecting options for email and/or SMS.
• Offers
  • Show all available offers for both Loyalty and Promotional
• Message
  • A basic page with a place for a header and paragraph text.
• HTML
  • Add custom HTML to your flow
    
• Camera
  • Utilize the on-device camera to capture an image and save it on the Contact's profile.
• Video
  • Provides the ability to show contacts a video and record whether they watch it entirely. 
• Waiver
  • Include your waiver within your flow to collect paperless signatures on legal documents. 
• Chance
  • Add a chance page that allows you to include a spin-the-wheel engagement game which you can award prizes.

Kiosk Flow Editor Overview

The top bar of the screen consists of the following elements:

Kiosk Flow Name: Use this input field to edit the name of the flow as needed.

Enable Toggle: Use this once your flow is complete and ready to turn on.

Device Icon: Use this to deploy your flow and/or changes to the flow to your devices.

Lock Icon (Only for multi-location accounts): Used to set Permissions between Parent and Child type accounts. This will ONLY apply to a business with more than one location and is used to determine which location will be able to use this flow and/or edit the flow.

Save Icon: The ‘Floppy Disk’ icon will Save your current Kiosk flow.

Left Side-Bar

Preview Cards

The left side of the editor consists of a preview card for each page of the flow. Changes will be reflected in this preview card upon saving your edits.

Each card has varying icons present with unique functionality and/or to help you identify various details about individual page settings.

Icons:

Sync: Helps you identify that this page pings the Patch servers to create or update data stored on the Contacts Profile.

 Set Data: This helps you identify that this page sets a value for the specified data point on the Contact Profile.

 Duplicate: Used to create a copy of the current kiosk page and add it to the flow.
Trash: Used to delete the specified kiosk page.

 Timeout: This helps you identify that this page is using the setting ‘Auto Force Transition Time’ for a certain interval of time.

 Filter: This helps you identify that this page has a Filter set that determines if this page shows or doesn’t show for a Contact based on a set of rules.

 Person: This helps you identify that this page is collecting Contact Data which is then stored on their Contact Profile.

 Lock: Permissions - For accounts that utilize our Parent/Child feature which is specific to our Enterprise/Franchise organizations. This determines if an account is allowed to use the kiosk flow and/or make changes to the flow. 

Arrange Kiosk Pages

The preview cards on the left sidebar have click-and-drag capability for arranging/rearranging your cards as needed based on your flow desires.

Preview Card Page Identification

Each preview card has a label in the orange pill shape to help you identify what page type was used for each page displayed.

You also have the ability to name your page so you can better identify what the page is built for and since the page type is built in you can customize the naming as needed.

Add New Page

To add a new page click the purple plus icon at the bottom of the preview sidebar. You will then be presented with a screen to select which page type you want to add.

These are the pages you can add and use in a Kiosk flow:

Welcome: First page in every Kiosk flow. This is where your customers sign in to begin the check-in process.

Fields: Allows for capturing data from your customers such as marketing opt-ins, date of birth, other marketing preferences, geographics, demographics, and much more!

Offers: Include available offers for your customers to redeem based on their customer status. Offers include both Loyalty and Promotional offers.

Splash: Commonly used as a Thank You or Loading page, or as a branded placeholder while customer data syncs with your Patch account.

HTML: A custom HTML page offers both flexibility and control. It can be highly tailored to fit the unique requirements of a business.

Message: Use the Message Page to display crucial updates, such as changes in store hours, ongoing promotions, or upcoming events.

Selection: Allows you to create selectable buttons that collect varying types of information that you can then use to trigger certain actions, set data on a customer profile, or add points to a customer’s loyalty punchcard.

Chance: Please consult with Customer Success before utilizing this page. This page is built for accounts that participate in a gaming system.

Camera

Utilize the on-device camera to capture an image and save it on the Contact's profile.

Video

Provides the ability to show contacts a video and record whether they watch it entirely. 

Waiver

Include your waiver within your flow to collect paperless signatures on legal documents. 

 

Right Side-Bar

On the right side are two main tabs that allow you to adjust and customize each page within the Kiosk Flow you are creating. Note: Each page will have varying setting options based on the intended functionality of the page type.

Page Settings: This tab includes 3 subsequent tabs for different categories of sub-settings.

Flow Settings: This is in one single tab that includes settings based on the page type.

Page Settings

There are 3 sections within the Page Settings:

Design
Page
Advanced

Design Tab

Background Images

Click the add images button to add one or more than one background image and also adjust the amount of time (in seconds) between multiple images to cycle. Recommended background image sizing: 2048 X 1536

 

Colors
By default, your account’s Brand Settings are built into all of your Kiosks flows. You can edit any of the style settings manually for each flow to override the Brand Settings as needed. Note: Any selected color that has the red slash through it means that it is pulling from Brand Settings. If you override the default color the square will change to said color and include an ‘x’ at the top right corner which then allows you to clear the manually set color choice and revert back to the Brand Settings.

 

Sign In Choices

Most accounts use a Contact’s phone number as the primary unique identifier because of this Patch recommends using the phone number instead of email to sign in.

By default, if ‘phone number’ is the only data field selected under Sign In Choices then the number pad will be the selected method for the check-in process.

If you add email as an alternate sign-in option and keep both phone number and email then a second button will appear on the device to switch over to sign in with email.

If you add ‘email’ and then remove ‘phone number’ the device will switch the UI to ‘email’ only.

If you want to use a different contact data point other than Phone or Email use the edit icon on the existing field and then select the appropriate contact field from the middle dropdown and then label it accordingly. 

 

Welcome Page Settings

By default, the checkin button displays ‘CHECK IN’, if you want to change what the button displays enter it in the ‘Checkin Button Text’ field.

 

Terms & Conditions

By default, Patch includes a Terms & Conditions link on the Welcome page of every Kiosk Flow. The text of the link displays as “We do not sell customer data. Click for terms.” and then links to this page: https://patchretention.com/terms-and-conditions

If you want to hide this link from the page altogether you will want to check the box “Hide Terms & Conditions link”.

Alternatively, if you want to change the displayed link text or the link itself to navigate to your own website you may do so by utilizing the “Terms Link Text” input field and the “Terms URL” input field. You can update one or both, please note this is not required but is based on the preference of the business itself.

 

Page Tab

Page General Settings
For all page types, this is the section where you will need to name the page accordingly within the Kiosk flow and have the option to deactivate a page if needed.

Depending on the page type these are additional settings available including:

• Rename the ‘Next’ and ‘Back’ buttons
• Enable/Disable the “Show this page while the previous page is communicating with the Patch servers”
• Enable/Disable the “Hide top menu bar”
• Enable/Disable the “Hide back button”
• Enable/Disable the “Hide next button”
• Set an “Auto Force Transition Time”

Note: Based on page type, the defaults for each setting will vary based on the intended use of the page. You will need to decide if the default needs to be changed based on how you choose to configure your flow. If you have questions about best practices or would like recommendations please reach out to our Customer Success Team.

Page Filter Settings
Depending on the page type this section may be present. If it is you can use the filter options available here to show or not show this page to customers who match the rules set.

By default when available the Edit Fields will show as “Currently Empty”.

Once a Filter rule has been set the button will update and display as “Filter is Active”.

To edit an existing filter click the “Edit Fields” button, make your changes, and click ‘SAVE’. To remove the filter rule(s) set altogether click the “Edit Fields” button, use the trash icon to delete each rule that is present then click ‘SAVE’.

 

Advanced Tab

Sync Settings

You will need to include the ‘Sync with the server when this page is completed’ option at certain points within your Kiosk Flow. Selecting this checkbox means that the Kiosk flow will connect to the Patch servers and update the contact profile based on the selected event.

By default, the Welcome Page has this setting ‘Enabled or Checked’ and uses the ‘Start Checkin’ event. 

This setting pings the Patch servers and will update the Contacts profile by logging a ‘Checkin Started’ event. As the Customer continues through the flow you may need to include additional Sync events to continue to update this Contacts profile based on the data collected or set within the flow.

Then when the flow is considered complete, you will need to set a final Sync event for ‘Finish Checkin’. This will communicate with the Patch servers and log that the Contact completed the entire flow, it also tracks stats like how long it takes for them to check in and allows you to report against the ‘check-in finished’ event to see how many Contacts have not finished the process which can aid in troubleshooting and/or making business decisions later down the road.

By logging these events (Checkin Started, Contact Updated, and Checking Finished) on every Contacts who uses your Kiosks you can then use these events to trigger Automations, Activate Offers, Deactivate Offers, Add/Remove Loyalty Points, Send Messages (SMS/Email) and so much more.

Require Contact to Exist and DO NOT allow new contacts to be created: Patch Rep Feature Only. If you are interested in using this feature please reach out to Customer Success.

 

Identity Verification (Welcome Page Only)

This is an optional step that can require a contact to utilize a 4 or 6-digit PIN in order to verify their identity and start the check-in process.

This additional layer of security can be used in an effort to help prevent abuse and ensure that only the authorized user can access their protected data.

If you would like to use this option within your processes you will first need to create a new Contact Data Field within your account. This can be done using the Fields Settings which is located in your Account Settings. The Field will need to be a Number type field, this field is where the created PIN will be stored for each Contact. Then once the Field is created, return to your Kiosk flow, and in the ‘Verification Field’ dropdown select the PIN field you just created from the list. Finally, you will need to choose from either a ‘6 Digit PIN’ or a ‘4 Digit PIN’.

Then when the Contact checks in for the first time they will receive a text message providing them with a temporary PIN, they can then change that PIN after the fact. Once set, the Contact will be prompted to enter their PIN every time they check-in. This will prevent others from using someone else's profile to redeem offers and/or use their points, etc.

 

Automatically Set Field Values

This feature allows you to insert a value into a specified data field on a Contact’s Profile based on passing this page, answering questions, providing information, taking action, or starting/completing the check-in process.

A common example of using this feature is to apply a Tag to the Contact, add the Contact to a Group, or set an opt-in status like SMS = Yes or Email = Yes.

To set a data field value on the contact is available on all page types.

To build this out, click the button labeled ‘Edit Fields’ a dialog will then open with a button to ‘+ ADD NEW FIELD’. Click this button and you will see a dropdown selector appear, click this and select from the available options, if you do not see the data field you want to use check the Fields setting page under Account Settings to ensure it has been created, if not create it and return to the Kiosks flow page editor.

Once you select the appropriate Data Field, additional inputs will appear. One is to choose the operation type, the options in this dropdown are based on the Field type. Usually, you will see ‘Insert’, ‘Remove’, ‘Set To’, ‘Clear Value’, etc. Once you choose the operation type add the value which you want to place into this field unless you are using the ‘Clear Value’ option in which this is not needed.

Once you are done click ‘SAVE’. The ‘Edit Fields’ button will update to show the total number of values being set in parentheses.

If there are existing data fields being set on this page, it will say how many values are being automatically set. To edit or remove these fields click edit and edit the data or use the trash icon to remove, and then click ‘SAVE’.

Here are examples that are commonly used on the Welcome Page:

The example below shows that upon a check-in event, it will set the:

Contact Checkin Date’ to the ‘current day of the checkin’

‘Contact Checkin Day of the Week’ to the ‘day the checkin occurred’

‘Contact Checkin Hour’ to the ‘current hour of the checkin’

 

Security Codes
These codes apply to only this Flow Page and will be used for any feature that requires a security code on this page. You can also require this security code to be input in order to continue to the next page in the Kiosk Flow. 

If you want to add a security code, select the option at the bottom: ‘Add New Code’

If a Security Code is entered here on the settings for Page Settings > Advanced > Security Code > Flow Page Security Code it will apply to this individual page ONLY. If you want to have a Security Code for the entire flow you will set this under the Flow Settings tab.

 

Flow Settings

All of the settings available under this section are considered global settings for the entire flow. The settings available will apply to all pages and are not specific to any particular page.

Back / Next Button Colors

If needed you can change the colors of the text and background of the back and next buttons for the entire flow.

Idle Timeout

If a customer begins a check-in but does NOT complete the check-in, you can set what actions you want to take place.

Timeout Actions:

Sync: This can be set to save the check-in info up to that point and then reset the Kiosk flow back to the start.

Reset: This will simply reset the Kiosk flow back to the beginning WITHOUT saving any data input up to that point.

Or it can be set to Do Nothing

‘After Inactive for: Can be set to the desired time frame.

Ping Event: This can set the ‘Idle Timeout’ event to be a Checkin Finished event or an Update Contact event.

 

Flow Security Codes

Adding a security code in this section will apply to the ENTIRE Kiosk flow, and not just this page.

If needed you can add multiple security codes. To add a new flow security code, select ‘Add New Code’.

Now we will review each of the different types of Kiosk Flow Pages available for you to use. 

 

Available Kiosk Pages

Fields Page

You can add an optional ‘Header’ to this page

Under ‘Form Options’ you can add the fields you want to use to collect customer data.

This page is used to capture customer data. Ex. First / last name, email address, birthday, zip code, etc.

Any existing Contact Data Field can be used here. If you do not see the Data Field you can create new Fields under your Account Settings.

You can also allow fields to be required or not.

For complete details on configuring a ‘Fields Page’, click here.

 

Offers Page

Add SmartOffers to the Kiosk flow here on this page.

You can edit the default images being used for offers under this section.

Adding offers to this page allows customers to redeem offers directly from the Kiosk.

Also, be sure to use the specific location’s ‘Loyalty Punchcard’ if there is more than one.

For complete details on configuring an ‘Offers Page’, click here.

 

Splash Page

The ‘Splash Page’ can be used for a variety of reasons.

Common uses are for a ‘Loading page’, ‘Thank you’ page, or to even have a particular graphic or message appear during the check-in process!

For complete details on configuring a ‘Splash Page’, click here.

 

HTML Page

The ‘HTML Page’ is very similar to the ‘Splash Page’ yet the difference is that it includes the ability to use custom HTML.

For complete details on configuring an ‘HTML Page’, click here.

 

Message Page

The ‘Message Page’ has space on this page to include a special message during the Kiosk flow.

This is similar to the ‘Splash’ page and ‘HTML’ page, with the minor difference being that there is a place for a ‘header’ on this page.

An additional common use for this page, the ‘HTML’, and ‘Message’ pages, is to use a ‘Sync’ event.

Under the ‘Page Settings’ and the ‘Advanced’ option, you could include the ‘Contact Updated’ event. This will take the information input on the Kiosk flow so far and update the contact profile with our servers.

For complete details on configuring a ‘Message Page’, click here.

 

Selection Page

This ‘Selection’ page is used primarily for allowing customers to ‘opt-in’.

You can add ‘selections’ and arrange them on this page, as well as adjust their respective settings accordingly.

Adding a ‘New Button’ or editing a button allows you to add a field to be selectable from the page. By default, this opt-in page will be associated and set their SMS and Email opt-in status.

For complete details on configuring a ‘Selection Page’, click here.

 

Camera

Utilize the on-device camera to capture an image and save it on the Contact's profile.

 

Video

Provides the ability to show contacts a video and record whether they watch it entirely.

 

Waiver

Include your waiver within your flow to collect paperless signatures on legal documents.