Optimizely Apps & IntegrationsExample: Creating a satisfaction survey form

The following example shows how to create a survey with satisfaction questions in multiple steps. The visitor Someone who visits a website using a web browser. In most cases, a visitor can use public functions and services but cannot create content and has limited access to community content. In an SEO context, visitor means the number of visits to a URL through channels (external referrers), direct arrivals, and internal links. (See also visitor groups.) selects answers from predefined choices. The form also the contains mandatory fields and displays a progress bar to let the visitor know how many questions remain. It uses the following form elements: Form step, Multiple or single choice, Text, Text area, Hidden visitor profiling, Hidden predefined value, and Submit button.

  1. From the assets pane, select Forms to list the existing form folders.
  2. From a folder's context menu, select New Form and give it a name such as Satisfaction Survey.
  3. Edit the form container settings in the All properties view as follows:
    PropertyConfiguration
    Form titleGive the form the title Satisfaction Survey.
    DescriptionEnter the description Take our survey!
    Confirmation messageEnter the confirmation message Thank you for taking our survey.
    Show navigation bar... Select the Show navigation bar... check box.

    Image: Satisfaction survey metadata

  4. Drag the following form elements onto the Form elements section in the new form container. Change the elements as follows (add your own Placeholder text) and publish each element:
    Form elementConfiguration
    Form stepLabel the form element Step 1.
    Multiple or single choiceAdjust the settings of the form element as follows:
    • Name the elementService satisfaction
    • Label text: How would you rate our service?
    • TooltipChoose from 1 (poor) to 5 (excellent)
    • Select the Required check box.
    • Under Choices, select Use manual input and add the following items:
      • Choice: 5 Excellent; Value 5.
      • Choice: 4 Great; Value 4.
      • Choice: 3 Neutral; Value 3.
      • Choice: 2 Lacking; Value 2.
      • Choice: 1 Poor; Value 1.
    Form stepLabel the form element Step 2.
    Multiple or single choiceAdjust the settings of the form element as follows:
    • Name the elementReturning customer
    • Label text: How likely are you to return?
    • TooltipHow likely are you to return?
    • Select the Required check box.
    • Under Choices, select Use manual input and add the following items:
      • Choice: 5 I'll be back!; Value 5.
      • Choice: 4 It is likely.; Value 4.
      • Choice: 3 Maybe yes.Maybe no.; Value 3.
      • Choice: 2 I don't think so.; Value 2.
      • Choice: 1 No way!; Value 1.
    Form stepLabel the form element Step 3.
    TextLabel the form element Email address (optional) and add a tooltip.
    Text areaLabel the form element Comments and add a tooltip.
    Hidden visitor profilingSelect Visitor Groups > Name.This field is used for internal purposes only and is not displayed to the visitor. Optimizely will log the visitor group each visitor (who fills in the form) belongs to.
    Hidden predefined valueEnter Satisfaction-survey in Predefined value.This field is used for internal purposes only and is not displayed to the visitor. You can use the predefined value to associate the form with a specific campaign or survey and so on.
    Submit buttonLabel the button Submit Survey and add a tooltip.
  5. Publish the form container. It appears in your Forms list.

    Image: Forms gadget

  6. Drag the Satisfaction Survey form onto a web page and publish the page.

Test your form

To test your form, go to the page on the website and enter data into the form on the page in View mode.

  1. Select an option and click Next Step.

    Image: Step 1 example

  2. Select an option and click Next Step.

    Image: Step 2 example

  3. Enter an email address and comments and click Submit Survey. A confirmation box appears. When you submit the data, it is stored in Optimizely.

    Image: Step 3 example

    Image: Example of confirmation box
    (Note: This Summary dialog box is styled this way because the Optimizely Forms Samples package has been installed. If you are using a default installation of Optimizely Forms without the Samples package, this dialog box will have a simpler, uncolored look.)

View form submissions

To view the results of your test, go to your Satisfaction Survey form in the Forms gadget and select Form submissions from the context menu. The Form submissions view appears with data submitted from the form.

Image: Survey form submissions