Exploration on standardizing patterns used for Settings UI
Proposal
Restructure the Settings pages/content to limit the number of progressive disclosure patterns and balance the amount of content presented to users
- Reduce the overwhelming amount of information on a page
- Introduce an explicit action to reveal area to add content #275969 (comment 457597275)
- Introduce a summary view of settings #275969 (comment 457597377)
- Use the side by side layout to help separate sections #275969 (comment 457831237)
- Align tables to a common layout #275969 (comment 467694098)
- Provide feedback when saving #275969 (comment 505565924)
- Improve discoverability of settings by showing all settings in a page
- Eliminate the need of the expand & collapse pattern #275969 (comment 457597426)
- Introduce a summary view of settings #275969 (comment 457597377)
- Navigating to settings
- Maintain familiarity of existing location of Settings and sidebar menu #275969 (comment 457598042)
- Introduce new ways to get to Settings within the product #275969 (comment 457598156)
- Introduce way to navigate back to original page from Settings #275969 (comment 457598156)
Prototype
I will help clarify the different points here over the next few days with images and prototypes of what settings would look like
Possible next step
To provide best practice guidelines and deliver on a potential area of impact for system usability scores (SUS) we would apply the guidelines mentioned above to "merge requests settings"
- Updating settings for Merge Request as a demonstrating of settings best practice #289976 (closed)
Tasks
-
Review of current patterns -
Identify patterns to move forward with -
Solution validation ux-research#1215 (closed) -
Document guidelines in Pajamas for layouts and best practices so that designers can leverage of more more guidance and reuse. gitlab-design#1499 (closed) -
Add Figma specs to Pajamas (https://design.gitlab.com/regions/settings)
Links
Edited by 🤖 GitLab Bot 🤖