Reorder screen examples

Polar

Dashboard with a modal overlay where the user selects and reorders up to five metrics to display on the overview.

• Edit
• Filter & Sort

Dock

Settings page where the user manages organizational hierarchy levels like C-Suite, VP, and Director, with options to create, edit, hide, and reorder them.

• Settings
• Edit

Mailchimp

Email design editor where the user manages the structure of their campaign by adding, reordering, and editing sections like header, body, and footer.

• Edit
• Drag & Drop

Cushion

Settings modal where the user customizes their sidebar navigation by reordering items and choosing visibility rules like show group, hide, or when badged.

• Settings

Bird

Design editor where the user builds a quiz by adding and organizing questions in a right sidebar while previewing the form on the left.

• Edit
• Form

Pocket Casts

List view where the user manages their podcast playlists, with options to search, create, reorder, and delete them.

• Files
• Edit

Lightfield

Settings page where the user configures and orders the opportunity stages for their CRM, including AI fill instructions.

• Settings
• Edit

Durable

Design editor where the user is customizing a website's business hours section with inline tools to restyle, reorder, or add new sections.

• Design Editor
• Edit

Okta

Settings page where the user reauthorizes a third-party connector by providing a username and password.

• Edit
• Confirmation

Attio

Settings page where the user manages custom and system attributes for the Products object, including creating, editing, duplicating, and reordering fields in a data table.

• Table
• Edit

Optimal

Study setup step where the user builds and organizes the hierarchical tree structure for an information architecture test.

• Edit
• Bulk Actions

Kinsta

Modal for creating a new pipeline stage where the user inputs a name and sets its order relative to existing stages like Dev and Production.