Introduction

When creating Intuiface experiences, it is possible to capture user data at runtime and save it for future reference.

For example, perhaps you would like someone interacting with our experience to be able to enter their first name, last name, e-mail address, and additional comments. When the user touches a "Submit" button, this information is stored in a persistent way that can then be accessed in the future.

Create the form

Form layout

Imagine a simple Contact Form with the following elements and associated requirements:

• Name: mandatory input field, needs to be text with a minimal number of characters
• Company: optional input field, no format requirement
• Email: mandatory input field, needs to be text with an x@y format
• Message: mandatory input field, needs to be text with a minimal number of characters
• Submit: button to save the form data. Disabled if any of the above-required fields aren't completed, enabled once everything is OK

In order to create the form we'll use Text Assets for labels, Text Input Assets to permit data entry, and a Button Asset in order to submit the form.

 

Entry validation

Now we need to meet our requirements for each input.

Mandatory fields

The simplest way to make a field mandatory is to set a Text Input Asset's "Min Characters" property to a value greater than zero. We've set it to 3 for Name and 10 for Message.

 

Format requirements (e.g. email)

For the email Text Input Asset, we need to ensure a valid email format. To do that, we'll use a regular expression. In the Properties panel of the Text Input Asset, in the "Behavior" section, check the "Use custom regular expression" box and insert the appropriate expression.

 

NOTE: There are plenty of sites providing regular expression patterns for validating email addresses, phone numbers and more. For example, here is one site with prebuilt regex patterns.

Enable the Submit Button

In order to enable the Submit button, we are going to use the following technique to determine when all three fields contain properly formatted text:

• For each of the three required fields (Name, Email, and Message) we are going to add a hidden Toggle Button Asset to the scene.
• The status (disabled/enabled) of the Submit button is bound to the "Checked" property of a fourth hidden Toggle Button.
• When any of the three Text Input Assets contains properly formatted text, we check its associated Toggle Button. Whenever the condition is not met, we uncheck its associated Toggle Button. To determine if the text is valid, we use the Input Text Asset triggers "Validates the entered text" and "Identifies invalid text"
• When all three Toggle Buttons associated with the three required fields are checked, the fourth Toggle Button is checked as well, making the Submit button clickable.
• Every time one of the three Toggle Buttons associated with a required field is unchecked, we uncheck the fourth Toggle Button, disabling the Submit button.

Note:

• To inform the user if his/her input is valid, we display text messages whose visibility is linked to the validation triggers. 
• The Toggle Buttons should be placed outside the scene. They should not be visible as they are only being used to facilitate enablement of the Submit button.

 

Sample experience to try it out

You can download a sample here that illustrates how to build a Contact Form. This example also uses Intuiface Analytics feature for data capture and storage, as explained in the next section.

Storing Form Data Using Intuiface Analytics

The first - and preferred - method for capturing user information at runtime is use of Intuiface Analytics. With Analytics you can log virtually any information about any event - user action, data input, environmental info, e-mail, etc. - that is accessible in your experience. Why is this the preferred method? It's simple, works both online and offline, and is scalable as it can be used with any number of displays.

In this case, every time the Submit button is tapped, a Log Event action is called to capture all form data. This form data is uploaded to the Data Hub where it can be stored and later retrieved in a variety of formats, including as an Excel spreadsheet.

In addition to information like form data, Intuiface Analytics also makes it possible for you to identify the habits and demographics of those who use the interactive content. This data can even be collected in an environmental context, meaning you can capture information like location and weather, potential influences on user decisions. Any information accessible on the device can be consumed by Intuiface.

To see how Intuiface Analytics works, watch this video for a demonstration.

Storing Form Data Using Excel

Another method for capturing user information at runtime is to use a local Excel file. Have a look at the video below to discover how you can leverage the Excel Interface Asset, the Text Input Asset and the Intuiface binding mechanism to fulfill this need.

IMPORTANT NOTE

When creating an Excel Interface Asset in Composer, the Excel workbook containing the referenced spreadsheet is copied and placed into your project at the following location:

C:\[Project_Path]\[Project_Name]\Files\InterfaceAssets\[Your_File]_xlsx\[Your_File].xlsx

All modifications achieved through the use of the Excel IA's Add row action are applied to this local copy. If you want to retrieve the user data collected at runtime, you need to open the local copy of the Excel workbook, not the original. (The iPad is not very friendly re: browsing its file system for the retrieval of files. To get the Excel workbook off an iPad, see this article.)

Please note that if you have multiple Players deployed, collecting all local Excel files and (manually) collating them into one giant Excel file might be a very tedious, error-prone and time-consuming process. Ergo the first method above using Intuiface Analytics.

Downloading the experience used in the video example

If you would like to get your hands on this experience, download the Intuiface project from here.

Storing Form Data Using Your Own Storage Environment

An Intuiface-based form can be bound via a Web Service API, .NET dll, or Javascript application to any local or cloud-hosted data storage. See this article for details about how to create this kind of connection.

Video explanation - Collecting form data using Analytics

You will find in the Quarterly Q&A Live - Summer Edition 2022 video, a detailed example of how to collect form data using the Intuiface Analytics.

Video explanation - Validating form fields

You will find in the Quarterly Q&A Live - Winter Edition 2022 video, a detailed example on how to validate form fields.