Sort Patterns

Sort patterns allow users to reorder displayed content by criteria like date, name, relevance, or custom fields.

stellae.design

Design Principles

Sorting lets users reorder content by criteria: alphabetical, chronological, by relevance, popularity, price, etc. Good sort UX clearly indicates the current sort criterion and direction (ascending/descending), uses table headers as sort triggers for tabular data, persists preferences, and defaults to the most useful order. Consider multi-level sorting for power users.

Why It Matters

Sort patterns define how users organize and prioritize information within lists, tables, and data-heavy interfaces. The right sort defaults and options dramatically affect whether users can find what they need quickly or feel lost in a sea of data. Thoughtful sort design reduces cognitive load by aligning information order with user intent and mental models.

Real-World Examples

Amazon's multi-criteria sort for product listings

Amazon offers sort options like relevance, price, rating, and newest arrivals, with relevance as the default for search queries. Each option maps to a clear user intent, making the choice straightforward. The active sort is displayed prominently in a dropdown, reinforcing the user's sense of control.

GitHub's issue sort with secondary grouping

GitHub lets users sort issues by date, comments, or reactions, and layer on filters for labels and assignees. This combination of sort and filter accommodates both quick scans and deep investigation workflows. The interface clearly communicates the active sort and filter criteria at all times.

Counter-example

A table with sortable columns but no visual indicator

A data table allows clicking column headers to sort, but provides no arrow or highlight to show which column is sorted or in what direction. Users click repeatedly, unsure whether anything changed. Without visible sort state, the feature is effectively invisible.

Role-Specific Guidance

Common Mistakes

• The most common mistake is choosing a default sort order based on what is easiest to implement rather than what aligns with user goals. Teams also forget to indicate sort direction, leaving users guessing whether a column is sorted ascending or descending. Another pitfall is offering too many sort options without grouping or prioritization, which overwhelms users instead of empowering them.