Progressive disclosure in CMS Lite Forms

Progressive disclosure is a method of revealing form questions as needed and relevant. It is often used to make a form experience as short as possible.

Progressive disclosure is similar to branching in that it hides questions until they are revelant. It's different in that it allows questions to be skipped.

Imagine a garden path from point A to point B. The path is straight, but there are a number of closed gates (questions) along the way. As you open and pass through a gate (answer a question), one or more other gates may automatically open (representing questions that don't need answering). 

Things to note:

• Progressive disclosure is useful when you have one or more conditional questions you (may) need to ask.
• You can use progressive disclosure as a way to 'walk' a person through a form 'step-by-step'.
  • Skill tests, where you want a user to answer a question before moving on to the next, are a good use case for this.
• You can combine progressive disclosure and branching to provide more functionality.
• You can apply progressive disclosure to sections that contain multiple questions by applying the Visibility formula to the Section.
• Consider indenting conditional questions to visually separate them from the 'main' series of questions. (Used in our example below.)

Sample scenario:

Description:

You are asking users to choose a car type and (conditionally) a body style.

• The first question asks for the body type:
  • 2-door sport car
  • 4-door sedan
• If the user selects a '2-door sport car', an additional question asks for the style:
  • Coupe
  • Convertible
• The next and subsequent questions are the same regardless of the previous answers.

Visual map:

This scenario can be depicted in the following way:

Setting up:

1. Note the Control Name of the first (triggering) question.
   In this example, it'll be carType.
2. Note the Values for the radio button control carType.
   In this example, they'll be 2D and 4D.
3. Create the conditional question.
   In this example, it'll be bodyStyle.
4. Create the Values for the bodyStyle radio buttons.
   In this example, they'll be coupe and convertible.
5. Set the Visibility to the bodyStyle control to only be visible when the answer to the first question is 2D.
   In this example, the formula for Visibility is $carType='2D'.
   (See illustration below.)
   
6. Click the Apply button.

Results (pre-trigger):

Results (First question answered and conditional question triggered):

Results (First question answered and conditional question not triggered):