Settings Web app

For account management and experience customization.

7 checks · 3 content groups

Checklist contents

Review progress

Information and structure

Compare information and presentation in context of use.

Group according to needSeparate accounts, security, notifications, and appearance with easy-to-find headings.Edit a field and then move to another set of settings. Make it clear whether changes are saved immediately or require confirmation; When necessary, keep edits or discard intentional changes.Example The “You have unsaved changes” dialog box has “Continue editing” and “Discard changes”; Don't use an ambiguous close button.Allow correction of personal informationShows the current value and explains the verification step when changing credentials.Email changes need to indicate which addresses are being verified and which addresses can still be used to log in during the waiting period.Protect important changesWith password or two-step authentication, have appropriate verification steps and clear feedback on results.Require re-verification at the time of saving sensitive changes, but keep imported data if the verification session expires.

Actions and status

Try the operation, change the status and continue working.

State the effects of each choiceExplains the switch, shows the current status, and separates each notification type or channel.Adjust each channel and notification type. For language or time zone, explain the scope of application and preview the results.Specify how to save changesDistinguish self-save from save button; Error message and warning when leaving the page with unsaved data.In the autosave group, it says saving and error right next to the change; In the manual save group, the save button must reflect unsaved data.Separate tasks that are difficult to undoSet your account or data to be deleted separately and explain the consequences before the confirmation step.The confirmation notice must state the object being deleted and the related data; Don't use the same warning for every task.

Complete the experience

Check for details that are easy to miss when putting the design into use.

Make billing accessible from settingsIf the product has paid plans, show who can manage the plan and provide access to invoices or payment methods in the appropriate settings group.Members without payment permissions should see who's in charge or how to request support, instead of a button that will always give an error.

Progress is saved automatically in this browser.

GUIDANCE

How to review

Check for unsaved changes when switching items

Edit a field and then move to another set of settings. Make it clear whether changes are saved immediately or require confirmation; When necessary, keep edits or discard intentional changes.

EXAMPLES

Usage examples

Leave the form being edited

The “You have unsaved changes” dialog box has “Continue editing” and “Discard changes”; Don't use an ambiguous close button.