Modal

Adj. A state where the interaction takes place within a ‘mode’, where the user cannot freely move to other parts of the experience without explicitly exiting.

Often a property of an Overlay. Sometimes exiting a modal state occurs via a positive action such as ‘Apply’ or ‘Save’ or ‘Accept’ or merely selecting an item. Sometimes exiting the modal occurs via an action such as ‘Close’ or ‘Cancel’. In the case of ‘Close’, whether changes are saved or applied depends on the implementation. Ensure the user understands what will occur when they select a specific means of exiting the modal.

 

Overlay

Noun A UI display on top of the base UI, obscuring part or sometimes all of the base UI. 

Often Modal, where the user cannot interact with the underlying UI until the overlay is dismissed. Sometimes Fixed To The Viewport.

Personalized

Adj. Content that the system presents based on prior user behaviour or selections.

Contrast with: Customize

Customize

Verb To modify the experience according to the user’s needs, tastes, or interests.

Distinct from personalization, which is the system presenting content based on prior user behaviour or selections. Customization is where the user explicitly indicates how they want the experience to look or function. Customization is often considered to be for more advanced users or those with specific needs. Consider how the default appearance or functionality might be able to accommodate both novice and advanced users.

Contrast with: Personalized

Browse

Verb To scan through a collection of items to consider and possibly choose one or more desirable ones.

Browsing is exploratory. Users don’t necessarily have something in mind. They may, but if they do, often searching is a more direct route to what they’re looking for. When browsing, much of the cognitive effort is done by the user. They’re looking to compare the available options and select a desirable one. For a large number of items, use categories, filters, and sorting to help narrow the choices.

Think about what needs to happen after the user has chosen their desired items. Do they immediately act on the item (navigate to a category, view product details, watch a movie) or need to save their choices while continuing to browse for others?

Contrast with: Search

See also: Filtering, Sorting

Search

Verb To enter an explicit term and view corresponding results.

Searching is when the user already has something specific in mind. Consider browsing when recognition rather than recall will help the user find what they’re looking for.

Typehead suggestions help the user to select a search term that corresponds to the language used for the items being searched or speeds up obtaining a specific result by avoiding a distinct ‘results’ view.

Contrast with: Browse

Persistence Between Sessions

Noun Settings or user selections that remain intact between site visits or opening an app, often without explicit user action to ‘save’ the selection.

Sometimes called ‘sticky’, which is also used to refer to Fixed to the Viewport. Ensure that having a user selection persist will make sense the next time the user visits. For example, in a flight search tool, remembering the user’s previous ‘From’ airport could be helpful, but remembering the previously selected departure date might not be.

Contrast with: Fixed to the Viewport

Filtering

Noun The ability to show/hide items based on certain properties of the items.

Distinct from sorting, where all items are shown but ordered according to certain criteria. Filtering items does not in itself indicate an order, though a sort order can also be applied to the items, including sorting that groups items by the properties used for filtering. Filters can correspond to multiple properties of each item.

Generally, more than one filter can be applied at the same time. UIs where the user selects between mutually exclusive options are better implemented via other patterns like tabs, segmented controls, or any sort of category navigation.

Often a ‘All’ option is useful to quickly select or deselect all filters. One implementation is where the relationship between the ‘All’ option and the entire set of filters is one of mutual exclusivity. The ‘All’ option, separate from the filters, deselects all filters when selected. The user can opt to select individual filters, toggling deselection the ‘All’ option it the process. Another implementation is where a ‘Select All’ option merely selects all filters and, ideally, a ‘Select None’ option allows quick deselection of the filters.

Always allow the user to select the filters they want to apply rather than having to deselect the filters they don’t want applied.

Contrast with: Sorting

Sorting

Noun The ability to change the order of items.

Distinct from filtering, where only items having specific properties are shown. Sorting shows all items ordered according to certain criteria, such as alphabetical, chronological, price, or popularity (e.g. number of views).

Often the ability to toggle the reverse order for a specific sort order is helpful. While the ability for users to apply cascading sort orders (first sort by price, then alphabetically) may serve some use cases, this is a feature for more advanced users. Generally, the system will provide a secondary sort order applied automatically when multiple items have the same primary sort characteristic.

Contrast with: Filtering