Learn Custom Form Design Basics

Form Structure

Custom Forms require two sets of definitions in order to function:

• The Form Data Definition declares the data objects that will be submitted at the end of the form.  Every input you need from a user requires an associated object in the data definition.
• The Form Display Definition declares how those data objects are displayed to the end-user. In general, an object referred to in the Form Display Definition must exist with the exact same name within the Form Data Definition.

Form snippets

You can use prebuilt form snippets to easily add commonly used form objects.

1. Log into your Spoke Phone account portal online
2. Go to Other > Developers > Form Definitions
3. Click +Add custom form
4. Add a form name, description and form reference.
5. Scroll down the page and Select Insert form template or snippet
6.  Find a snippet you'd like to use and select the icon
7. The snippet is added into your form
8. Click save

Form Testing

By default, a form is set to not show within the Spoke Phone App.  You can use this feature to build draft forms, and as an administrator, you can see those draft forms within the Spoke Phone App.

Using this test feature gives you a chance to fill out the form to test how it displays and operates.  You can also test any required fields and error messages.

Test your form design

1. As an administrator, log in to the Spoke Phone App.
2. Tap on the profile menu icon at the bottom.
3. Tap settings.
4. Tap on Test draft forms.
5. Tap Select a draft form.
6. Choose a form you wish to test.
7. Scroll to the top and tap Submit.
   In 'Test' mode no form data is actually saved or submitted.
8. Scroll through the form and check any error messages you see.
9. Scroll to the bottom to the section marked Submitted Data.
   Here you can preview the data that will be sent when this form is live.

Test your form behavior on a real call

1. As an administrator, log in to the Spoke Phone App.
2. Tap the Call History menu icon at the bottom.
3. Select a call to submit a form against.
   Note: You will only be able to submit one form per call and you cannot remove a form submission.
4. Underneath the action buttons, tap Select conversation form.
   Note: You can also select a form during an active call, the submit button becomes available when the call ends.
   
5. Tap a form name you wish to test.
6. Complete the form and select submit at the top right of the call history screen.
7. The form is submitted in the live environment, webhooks are triggered and email is sent to the recipients of the form.

Next steps

• Custom forms: Getting started
• Learn Custom Form Design Basics
• Learn how to customize mobile forms
• Learn advanced mobile form building
• Learn how to collect and store mobile form data