There are two types of panels in a workflow: Submit Panels and Answer Panels. Submission panels are used to capture information, such as a customer question. They usually include a single Submit button that does things like create a ticket and send a notification. These submission panels can be created for customer or agent use, depending on your use case. Agent submit panels can be included directly in the left navigation menu for convenient agent access. Agent submit forms also support direct assignment of tickets to an agent.
Answer panels are replacements for the standard answer panel shown in the action mode for an interaction (i.e., when answering an unresolved question). For example, purchase order requests may need to be approved or rejected before they are submitted to procurement. To simplify the process, you can provide a simple answer panel with an Approve and Reject button that automates the required actions.
Creating an approval answer menu
You can create an unlimited number of panels within your workflow. The settings for each panel are contained within an accordion style element that can be collapsed or expanded. The type of panel and details, such as the URL for the submission or topic that triggers the answer panel, are included within the panel name.
Workflow Panel Examples
Submission Panels
Customer and Agent submission panels are web forms that are submitted to create tickets or post data for processing. The primary difference between customer and agent submission forms is that only agent forms allow the user to assign questions to agents. Agent forms can also be included within the Custom Forms section of the left navigation panel for quick access by agents. Customer submit forms are displayed outside of the agent interface, such as within an iframe on your website or as a stand alone web page.
Submission forms have two primary sections: the form body and the form actions. The form body contains inputs for things like email address, subject line, and property values. The form actions are tied to buttons on the page.
When you create a new Customer Submit Form, the following screen is shown.
#
Element Name
Description
1
Enable Panel
Your form will be live as soon as you enable the panel.
2
Delete This Panel
You can review the panel from the workflow. Once it is deleted it cannot be recovered.
3
Form Name in URL
This value becomes part of the URL that is used to load the form. Use a value that is short and descriptive.
4
Frame Type
It's common to embed your submit form into a web page, like your company website. To include a form into an iframe you must specifically allow it to be embedded.
Not Allowed - the form will not load within an iframe.
Same Site - you can only embed the form into a page that has the same domain as your form. This would only be used to embed your form into a customer portal or other page that has the same domain as your iService tenant.
Any Site - use this setting to embed your form into a website with a different domain than your iService tenant.
Actions are attached to the button click on submit forms. There are three actions that submit forms can execute: Set Contact Properties, Create Ticket, and Email to Customer.
Submit Form Actions
Set Contact Properties - Use this action to save all of the contact properties entered in the form for the customer. The only input for this action is the To Address that will get the property values.
Create Ticket - Use this to create a new question from the customer. In Agent Submit forms, you can directly assign the ticket upon submission. For Customer Submit forms, questions are created with a status of unassigned.
Email to Customer - This action sends an email to the customer
The controls within the Submit Forms are used to create the content on your form. Content can generally be categorized as page structure and form inputs.
Page Structure
The main elements of the form layout are Static HTML, Buttons, and Tabs.
Static HTML - add sections to your form that contain any plain text or HTML.
Button Group - add a button group to include buttons on the form. There will be on default button in the group, and you can add additional buttons to the group.
Tab Group - the iService UI design uses tabs to contain related information. You can add tabs to your form to organize content, or hide/show content as needed.
Form Inputs
Before submitting forms by clicking buttons, users must input data such as their email address and other information. These inputs can be added inside of tabs, or directly on the page.
Options for inputs include:
Uploads - Add a file drop area and select file option to the form. The code required for saving the uploads is automatically added to the form. Uploads are limited to 10MB.
Interaction Property - You can add a segment interaction property of any type (case, question, or answer) or use a workflow property. Workflow interaction properties mimic the behavior of segment Case properties, but do not require any configuration outside of the workflow builder.
Email Address - Most submit forms require an email address to create the interaction. This is used to locate or create a contact for an interaction. The login/email for a contact is a special field within iService that enforces unique values and other attributes. You must use the Email Address field to save a value into a contact's login field.
Contact Property - Add any segment contact property to the form, such as first name or account number.
Single Plain Text - This creates a basic HTML Text Input field. This is a single line input.
Multiline Pain Text - This creates a basic HTML Text Area input field. This allows multiple lines of text, such as for typing the body of a question.
Multiline Rich Text - This functions like the plain text version, but includes a rich text editor with formatting controls.
SMS Opt-In - When added to an input form, you can automatically convert a mobile phone number to an Email to SMS login structured for Sinch Message Media.
A common use case for forms is a contact form that creates a customer ticket. To get started, create a Customer Submit panel by clicking the button.
Creating a customer submit form
Step 1 - Add a submit button
To see the required inputs for a customer ticket, add a button so you can attach the create ticket action.
Adding a button to the form
The required values for your button are shown below.
#
Form Element
Description
1
Button Color
Select a color for the button or select Text Link to create a standard hyperlink.
2
Label
This is the label displayed on the button.
3
Font Awesome Icon Class
(optional) You can use any font awesome icon for your button, or leave it blank.
4
Required Tab
If your inputs are within a tab, you can select the tab to require all of those inputs to be set when the form is submitted.
5
Add Action
After you format the submit button, you can add actions.
Set Contact Properties - This action will save any contact properties on the form to the contact that is entered. This requires that you have contact properties on the form and an email address to identify the contact.
Customer Ticket - Create a customer ticket when the form is submitted.
Email to Customer - Use this to send a notification to the contact when the form is submitted. For example, a custom message acknowledgment that is different from the standard acknowledgment configured for the topic.
Adding a submit button to a form
Step 2 - Add a Create Customer Ticket action
After the Submit button is created, we add Create Customer Ticket as the action.
Add Customer Ticket to button actions
There are eight input to the customer ticket to consider.
#
Form Element
Description
1
Destination Email Input ID
A customer email address is required for them to submit their question. After you add the email field to the form, select it here.
2
Topic Name
Every interaction is associated with a topic. You can preset the topic, or let the user choose one from the list of topics that are public.
3
Subject
This will be the subject of the ticket created. You can preset the subject line (including variables), or let the user input the subject.
4
Set Question Properties
If you have question properties as inputs, turning this switch on will save values into the properties. When off, you can add the properties into the ticket body but they will not be saved into the iService database as separate property values.
5
Save Case Properties
Similar to question properties, turn on this switch to save all inputs to case properties in the database.
6
Message Acknowledgment
To override the normal message acknowledgment, select No standard ack. Use this setting when you send a custom acknowledgment directly from the form action. For example, when the form is submitted you can send an acknowledgment that says "Thanks for submitting the xyz form." When the customer sends a new email into the topic, iService will then send the standard acknowledgment that says "We got your question."
7
Ticket Body
The ticket body can be preset by combining the form inputs into your own customer format. Or, the customer can type the full question body themselves in a text are input. If you use a preset ticket body, provide a name for the template in the Interaction Body Name input.
8
Result Name
You can save the ID for the interaction created with a friendly name, and then use it in other workflow steps.
Adding the Customer Ticket action
Step 3 - Add the required inputs
Now we'll add all the required input fields to the form. The minimum required inputs for the ticket action are:
1.Email address
2.Topic
3.Subject
4.Ticket Body
In our example, we also add some static HTML to the top of the form. Add these inputs to your form and arrange them as desired with the field input size and your custom labels. Select the inputs from the Add Control to Panel section shown below. In the example, we use a Multiline Plain Text area for the ticket body. You could also use the Multiline Rich Text input if you want to provide an editor.
After the inputs are added to the form and arranged in the proper order, the submit form looks like the below.
A completed customer submit form
Step 4 - Load and test the form
You're done! You can load the form from the URL specified and submit it as a test.
The URL for your form
Answer Panels
iService provides a standard answer panel for working with unresolved questions (unassigned or queued to an agent). The standard panel includes buttons for answering, resolving, forwarding and modifying an interaction in various ways. However, there are use cases where you know the agent must take a specific action. In those cases you can provide a custom user interface to the agent that exactly fits their needs. For example, approval requests that must be approved or rejected can include two buttons: Approve Request and Reject Request.
Answer panels can be presented to agents based on two settings: tags and topics. Tags are values associated with an interaction, like a property, that are not displayed to agents. They cannot be edited or removed directly from the user interface. Tags must be added an interaction when it is created, either via a filter or directly on a submit form.
To add an answer panel to your workflow, click the Add Answer Panel button.
Adding an Answer Panel
If your workflow has a tag value specified, you will see three options for triggering the panel: Tag, Topic, and Tag and Topic. The tag will limit the display of your custom answer panel to interactions that contain the tag value, regardless of the topic. For example, you might offer custom panels to agents that handle a form submission but use the standard panel for general questions that arrive into a topic.
Conditions for your custom answer panel
Answer panels are created using the same process as Submission Panels. Create the structure for the page with HTML, buttons, and tabs. Then add inputs and actions to the panel as needed using the same method as submit panels shown above. The primary difference between submit forms and answer panels are the controls used on the page.
There are many actions available for the agent buttons. Actions include button clicks that are within the standard answer panel, like the Send, Change Topic, and Forward. They also include workflow specific actions, like Agent Signature, that perform workflow specific tasks.
Answer Panel Actions
Standard Answer - If you provide a limited set of buttons, you might want to give the agent the option for loading the full answer menu. This will replace the workflow menu with the standard answer menu when clicked.
Agent Email Panel - This action will load the Agent Email panel (same panel as Agent Email in the View Mode).
Create Note Panel - This action will load the Create Note panel (same panel as Note in the View Mode).
Set Draft - When an agent is working on a response to a question, they compose a draft response that is then converted to an answer. The Set Draft action is used to create the draft response that can then be used with Send Leave Open, Send Resolve, Send Notification, Save Public Note, or Save Private Note.
Send Leave Open - This action replicates the Send button in the standard answer panel when the Leave Open option is checked. This action requires Set Draft to be set as the prior action.
Send Resolve - This action replicates the Send button in the standard answer panel, without the Leave Open option. This action requires Set Draft to be set as the prior action.
Save Resolve - This action replicates the Resolve button in the standard answer panel. This action requires Set Draft to be set as the prior action.
Save Public Note - This action replicates the Save Public Note button in the standard answer panel. This is different from the Create Note Panel, because the note will be created from the draft answer that is already present in the interaction. This action requires Set Draft to be set as the prior action.
Save Private Note -This action replicates the Save Private Note button in the standard answer panel. This is different from the Create Note Panel, because the note will be created from the draft answer that is already present in the interaction. This action requires Set Draft to be set as the prior action.
Change Topic - This action replicates the Change Topic button in the standard answer menu.
Assign To Agent - This action replicates the Forward to Agent action from the standard answer menu.
Unassign - This action replicates the Forward - Unassign action from the standard answer menu.
Send Notification - This action will send a predefined email to the customer using the body created in the Text Blobs tab.
Set Property - This action will set the value for an interaction property.
Agent Signature - This action is used in workflow that require evidence of approval. It requires an interaction property that has a text based description and a text value. When clicked, it will record the date and time plus the agent that clicked the button.
The controls within the Answer Panels are used to create the content of the agent user interface with taking action on an unresolved question. Content can generally be categorized as page structure and form inputs.
Page Structure
The main elements of the form layout are Static HTML, Buttons, and Tabs.
Static HTML - add sections to your answer panel that contain any plain text or HTML.
Button Group - add a button group to include buttons on the form. There will be on default button in the group, and you can add additional buttons to the group.
Tab Group - the iService UI design uses tabs to contain related information. You can add tabs to your answer panel to organize content, or hide/show content as needed.
Answer Panel Inputs
Some actions require inputs, such as selecting an agent or setting a value. These inputs can be added inside of tabs, or directly on the page.
Options for inputs include:
To Address - Some actions within the answer panel might require a TO email address. For example, you might add a notification action that sends email to the customer when the action is taken. Since a customer may have multiple email addresses, the agent must pick one of those from the To Address field. This field will automatically populate with a list of user logins that are email addresses or Email to SMS.
Uploads - Add a file drop area and select file option to the form. The code required for saving the uploads is automatically added to the form. Uploads are limited to 10MB.
Interaction Property - You can add a segment interaction property of any type (case, question, or answer) or use a workflow property. Workflow interaction properties mimic the behavior of segment Case properties, but do not require any configuration outside of the workflow builder.
Agent Picker - Actions such as reassigning a question require the user to pick an agent. The Agent Picker input is configured in the Object Mappings page with a specified list of agents for this list.
Case Properties - The Case properties input will display an editable list of all Case Properties associated with the interaction. This includes any value set, plus all properties associated with the topic of the interaction.
Preview Display - If you have an action on your form that composes a response using a Text Blog, you can preview that response before sending it in the Preview Display.
Original Question - In most cases, you will want to show the agent the original question (ticket body) they are working on. This control adds a quoted copy of the original question to the panel.
There are two types of panels in a workflow: Submit Panels and Answer Panels. Submission panels are used to capture information, such as a customer question. They usually include a single Submit button that does things like create a ticket and send a notification. These submission panels can be created for customer or agent use, depending on your use case. Agent submit panels can be included directly in the left navigation menu for convenient agent access. Agent submit forms also support direct assignment of tickets to an agent. 
