A multi-column list (MCL) allows users to quickly scan through data both vertically and horizontally.
Typically, a MCL is composed of column header and tiles with inline information. If needed, checkboxes can be added at the very left, allowing users to select list items.
MCL shall be optimized for reading comprehension by alternating background colors and adding a fleuron to mark the end of a list.
MCL should always have a list menu to perform actions on items and customize the list.
The menu is generally located under a default style “Options” button on the left of the list headline.
If the list is displayed in the result pane, the menu is found under the pane menu dropdown.
Changing display preferences
Users can customize MCL in the “Display preferences” section found in the list dropdown. It allows them to hide/show columns as well as changed how items are sorted.
Sorting MCL can also be done by clicking on a column header.
If actions need to be performed, the MCL should have checkboxes to select items.
When no items are selected, default actions shall be displayed.
When items are selected, users should see both default actions and actions related to the selection.
When the MCL is used in an edit screen, a delete and add icon could be added at the end of each list items so users could perform those actions in a quick and easy way.
Selecting a tile
When users select an item, the background color changes to a darker blue with a light blue outline. It allows users to know when a tile is selected.
When panes resize, MCL items become cards.