Maximum Efficiency: Help users classify your data

Posted · 16,631 Comments

“Human Factors” are design principles devoted to understanding and applying how humans interact with products or processes. There are universal human factors that help guide good design, such as:

  1. Sensory Perception
  2. Pre-attentive Processing (the topic of today’s blog post)
  3. Integration of Prior Knowledge
  4. Metacognition
  5. Working Memory

In the coming weeks, each area will be discussed in depth.

For any design that is information-heavy, it is crucial that the designers understand pre-attentive processing and provide signals to the user so they can group similar items together. This will ensure the user does not feel overwhelmed or anxious at the vast amount of data in front of them.

Pre-attentive processing is where we can distribute automatic attention widely over a larger concentration of objects, rather than carefully focus on one object or subgroup. This is known as pre-attentive, or automatic, because it can be done without effort no matter how many distractors there are present. For instance, if you were asked to pick out all three red 9’s in the field below, you could do it at the same pace in both instances:




Essentially, people effortlessly segment a field into groups without classification of these objects. This is a primitive process that is done prior to making meaning of what we see. Similar to the last entry about sensory processing, pre-attentive processing evolved from the need to survive.

“This ability to orientate rapidly towards salient objects in a cluttered visual scene has evolutionary significance because it allows the organism to detect quickly possible prey, mates or predators in the visual world” (Itti & Koch, 2001)¹.

The main function of pre-attentive processing is how a person categorizes a field, which items are placed in what group. This could be done using contours, such as rounded edges and sharp edges, or other methods of sorting like color, size, proximity and alignment. Grouping is only possible in particularly dense displays where there is a lot of information to take in. The mind needs a way to make sense of this information efficiently.

Items that share the same features are perceived as going together. Below is the Yahoo! Finance stock market data, where our eyes can quickly start to group items as belonging together.

Screen Shot 2015-01-01 at 6.16.49 PM

Yahoo! Finance page allows for easy grouping by color, proximity, alignment, and contouring.


We can sort by color: blues, reds, greens and blacks. We can group by alignment: columns are grouped together. Proximity grouping would let put the top group of market movers together and in another group, the currencies at the bottom. The blocks of color with rounded edges can be categorized in their own group as well.

Pre-attentive grouping lets a user maximize the efficiency with which they take in a lot of information.

Another pre-attentive process is known as continuation. Good continuation, also referred to as contour grouping, is identifying contour elements that are near each other as part of a group, like a specific shape. In the picture below, even though there is no outline of a triangle, we can detect it because of good continuation. It makes more sense that there is a triangle laid over the circles, because we can match these up to shapes in our head.


We also have the ability assign the correct boundary to the corresponding shape, as shown below. We can look at the black borders and correctly attribute them to the shape they belong to:

bwcontin                 colorcontin

There are instances where an object may be partially hidden: with good continuation principles, we can fill in the details and link the shapes. The ability to group by contours is innate; babies can assume continuation when part of an object is hidden. However, continuation is not always detected when too much of a shape or its border is obscured.

Continuation is an important function to consider because there may be times when “interruption” of an object is necessary, so a designer may need to apply strategies to ensure the user still sees the object or shape within the design.


For more information, see links below:

Itti, L., & Koch, C. (2001). Computational modelling of visual attention. Nature reviews neuroscience, 2(3), 194-203.

Li, Z. (2000). Pre-attentive segmentation in the primary visual cortex. Spatial vision, 13(1), 25-50.

Sengpiel, F., & Hübener, M. (1999). Visual perception: Spotlight on the primary visual cortex. Current Biology, 9(9), R318-R321.

Treisman, A. (1985). Preattentive processing in vision. Computer Vision, Graphics and Image Processing, 31, 156-177.

Treisman, A., & Gormican, S. (1988). Feature analysis in early vision: evidence from search asymmetries. Psychological review, 95(1), 15.

Tversky, T., Geisler, W. S., & Perry, J. S. (2004). Contour grouping: Closure effects are explained by good continuation and proximity. Vision Research, 44(24), 2769-2777.

Watt, R. J., & Phillips, W. A. (2000). The function of dynamic grouping in vision. Trends in cognitive sciences, 4(12), 447-454.

Wertheimer, M. (1958). Principles of perceptual organization. Readings in perception.


Comments are closed.