As a member of the design system (DS) team at the Government of Alberta, I want to create a complex form pattern and templates that are readily available to use by designers and developers so that other teams have a starting point for building complex frequently used forms.
Assumptions
This will borrow many of the “small patterns” that have been created for the “simple form” (citizen-facing)
The large net-new component/feature that will need to be designed and developed is the vertical “stepper” for form navigation
Acceptance criteria
The template and its parts should be designed to be accessible, meeting the existing DS standards standards for accessibility.
Design should support steps and substeps
(If needed) Secondary “in-page” navigation
Save-in-progress work
Automatically
Manually
Support the following step statuses
In progress/edit
Not started
Complete
Error
Incomplete
Optional
Step “Descriptions”
(optional) Key modifiers, so expert users can navigate steps using keyboard “hotkeys”
Should should be responsive and considerate of the “mobile” experience.
User (developer) must be able to have control over certain sections of the form being “open” and/or “closed” navigation. (e.g. steps may be needed to be completed in sequence or out of sequence).
Design usage guidelines and design system website documentation should be created.
Both the technical and design documentation will be included on the design system website and should be designed accordingly.
Designs for website pages will follow the conventions first implemented by the “Simple form” documentation.
The designs should be validated by designers to verify their effectiveness.
Spark450
commented
7 hours ago
Background
As a member of the design system (DS) team at the Government of Alberta, I want to create a complex form pattern and templates that are readily available to use by designers and developers so that other teams have a starting point for building complex frequently used forms.
Assumptions
This will borrow many of the “small patterns” that have been created for the “simple form” (citizen-facing)
The large net-new component/feature that will need to be designed and developed is the vertical “stepper” for form navigation
Acceptance criteria
The template and its parts should be designed to be accessible, meeting the existing DS standards standards for accessibility.
Design should support steps and substeps
(If needed) Secondary “in-page” navigation
Save-in-progress work
Automatically
Manually
Support the following step statuses
In progress/edit
Not started
Complete
Error
Incomplete
Optional
Step “Descriptions”
(optional) Key modifiers, so expert users can navigate steps using keyboard “hotkeys”
Should should be responsive and considerate of the “mobile” experience.
User (developer) must be able to have control over certain sections of the form being “open” and/or “closed” navigation. (e.g. steps may be needed to be completed in sequence or out of sequence).
Design usage guidelines and design system website documentation should be created.
Both the technical and design documentation will be included on the design system website and should be designed accordingly.
Designs for website pages will follow the conventions first implemented by the “Simple form” documentation.
The designs should be validated by designers to verify their effectiveness.