Why Hybrid Selection is the right Selection Method for Grids

Openbravo 3.0 release candidate 4 introduces an entire new interaction paradigm for document manipulation. Using a multi-level master-detail page layout it will be possible to view parent and child records, in either grid or form view, simultaneously. Both forms and grids have been redesigned as well and are optimized for the full document life cycle: creating, editing, processing, searching and comparing. One of the most dramatic differences with Openbravo 2.50 is that these tasks now can be done for multiple documents at a time through the multi-tabs GUI, in-grid editing and multiple objects selection in grids. In this article, I´d like to tell you about the different methods for object selection in grids and which method works best for our grids.

Grids consist of rows and columns. Each row represents a record and each column represents an attribute of that record. A single select in a grid is simply done by clicking on a row. The row will be selected and the screen will update all related information (e.g. children) to the selection. It is common to highlight the row to give the user a visual cue of what is selected. Multiple, discontinuous rows can be selected using a CTRL- (Windows) or CMD- (Mac) click combination. Multiple, continuous rows can be selected using a SHIFT-click combination. A combination of the above is possible using these key-click combinations but this is not recommendable as it is very easy to lose the selected set by clicking or pressing wrongly by mistake. This is especially the case when the selected set is out of sight because of vertical scrolling.

This is where the use of check-boxes comes in handy. Traditionally the preferred choice for multiple selection, they became "out of fashion" in the last decade in favor of other multiple selection methods. Now they´re back and we want to use them in a way that combines different selection methods:

Object Selection: The simplest method of direct selection: The user selects one object and manipulates it directly. For example, you select a folder (icon) and drag it into the trash bin on your desktop. This was quite a revolution in 1984 when Apple introduced their first graphical user interface. Command line interfaces (the standard at that time) used an indirect way of manipulation where you first had to define the action and then point to the object, e.g. deltree c:\myfolder.

Object Selection in early Mac OS

Toggled Selection: The user selects the objects using check-boxes (or toggle buttons). This is the easiest way of discontinuous selection. After the objects have been selected, you can do something with them (delete, process, move, etc.). Selecting a row without ticking the check-box does not select it.
An example of toggled selection can be found in Windows XP in the Add or Remove Windows components dialog. Only the objects that are ticked will be added/removed, not the highlighted row.

Toggled Selection in Windows XP

Collected Selection: This concept revolves around placing and accumulating selected objects in a separate bucket. In large lists or lists that span multiple pages, this is an easy way to see which objects already have been selected. We intend to use this for the multiple objects selector that has been discussed earlier.

Multiple Objects Selector concept using Collected Selection

From a usability point of view, this method would also be appropriate in grid selection but less so from a practical (space) point of view. In the 3.0 grids, we will use a snippet of the collected selection method though, by displaying the amount of objects selected in the top left of the grid.

Selection counter

Hybrid Selection: This is a combination of Toggled Selection and Object Selection. This is what we will use for the Openbravo 3.0 grids. In most cases, the user will select one object only, view its children, edit its attributes and apply a process to it. This is object selection. In other cases, the user wants to select multiple objects in a grid via toggled selection. This is where the rows get checked.

Single row selected via Object Selection

Single row selected via Toggled Selection

Multiple rows selected via Toggled Selection

Hybrid Selection recombines the best of three worlds resulting in more efficient document manipulation and lower error rates.