Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Element

Details

Images

Header

  • The header describes the Wizard’s purpose and expected results.

Steps navigation panel

  • Shows all of the steps in the wizard.

  • Indicates which step the user is currently on, and the steps which have already been covered.

  • Enables jumping between steps.
    This differs between Create and Edit modes. See Interaction below.

Step content area

  • Displays relevant content for the selected step, including a step header, input fields, and content to support decisions.

  • The content area contains a form which can include all input fields types, such as Radio buttonsButtons, Check Boxes, and Drop-down Menus.

Actions Row

  • Contains Previous and Next Dialog Buttons.

  • In the last step, the Next button will change to show the final action which will occur. For example, Create statistic Set.

  • In the first step, the Back button will be disabled.

  • Additional action buttons may be included.

  • If one of the fields contains an error, the Next button will be disabled and a guiding message will be shown.

...

Validations are shown inside each step, both for individual fields and the entire step as a whole. See Field Validation.

Image Removed
Image Removed

Transitions

  • When moving between steps, a transition will be used in the navigation panel, if technically possible.

...

  • the overall task isn’t complex.

  • users are advanced and might be frustrated by a wizard, which can be rigid and limiting.

Future Version (TBD)

  • Visual representation on warning in the navigation.

  • Wizard viewing mode.

  • Dynamic branching.

Accessibility compliance

...