Maximum Efficiency: Help users classify your data

Posted · 24 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.


24 Responses to "Maximum Efficiency: Help users classify your data"
  1. Hello there! I know this is kinda off topic however I’d figured I’d ask.
    Would you be interested in trading links or maybe guest authoring a blog post or vice-versa?
    My site covers a lot of the same topics as yours and I believe we could greatly benefit from each other.

    If you might be interested feel free to send me an e-mail.

    I look forward to hearing from you! Great blog by the way!

  2. I am really impressed with your writing skills as well as with the layout on your blog.
    Is this a paid theme or did you modify it yourself? Either way keep
    up the nice quality writing, it is rare to see a
    nice blog like this one these days.

  3. Greetings I am so excited I found your web site,
    I really found you by accident, while I was researching on Yahoo for something else, Nonetheless I am here now and would just like to say
    many thanks for a incredible post and a all round entertaining blog (I also love the
    theme/design), I don’t have time to read it all at the moment
    but I have saved it and also added your RSS feeds, so when I have time I will
    be back to read much more, Please do keep up the great job.

  4. You need to be a part of a contest for one of the most useful
    blogs on the internet. I will highly recommend this website!

  5. I love your blog.. very nice colors & theme. Did you make this website yourself or did you hire someone to do it for you?
    Plz respond as I’m looking to design my own blog and would like
    to find out where u got this from. thank you

  6. minecraft says:

    These are truly fantastic ideas in on the topic of blogging.
    You have touched some fastidious factors here.

    Any way keep up wrinting.

  7. Good info. Lucky me I discovered your site by chance (stumbleupon).
    I have saved it for later!

  8. Keep this going please, great job!

  9. I’m really impressed along with your writing talents as neatly as with the structure to your blog.
    Is that this a paid theme or did you modify it your self?
    Either way keep up the nice high quality writing, it is rare to peer a nice weblog
    like this one nowadays..

  10. Hey! Quick question that’s totally off topic.
    Do you know how to make your site mobile friendly? My
    blog looks weird when viewing from my iphone4. I’m trying
    to find a template or plugin that might be able to correct this issue.
    If you have any suggestions, please share. Thank you!

  11. Greetings from Idaho! I’m bored at work so I decided to browse
    your blog on my iphone during lunch break. I enjoy the info
    you provide here and can’t wait to take a look when I get home.

    I’m shocked at how fast your blog loaded on my phone .. I’m not even using WIFI, just 3G
    .. Anyways, amazing site!

  12. Please let me know if you’re looking for a article writer for your blog.
    You have some really great articles and I think
    I would be a good asset. If you ever want to take some of the load off, I’d really like to write some articles
    for your blog in exchange for a link back to mine. Please send me an e-mail if interested.

  13. I was very pleased to find this site. I need to to thank you
    for your time just for this fantastic read!! I definitely really liked every bit of it and I have
    you book marked to see new things on your web site.

  14. You actually make it seem so easy with your presentation but I find this topic to be really something that I think I would never understand.
    It seems too complex and very broad for me. I am looking forward for your next post, I will
    try to get the hang of it!

  15. quest bars says:

    I blog quite often and I truly thank you for your content.
    The article has really peaked my interest.
    I’m going to book mark your blog and keep checking for new details about once a week.
    I subscribed to your Feed too.

  16. I think this is one of the most vital info for me. And i am
    glad reading your article. But want to remark on few general things,
    The website style is perfect, the articles is really excellent : D.
    Good job, cheers

  17. Excellent, what a website it is! This web site provides helpful information to us, keep
    it up.

  18. pop music says:

    Awesome blog! Is your theme custom made or did you download it from somewhere?

    A design like yours with a few simple adjustements would really make my blog jump out.

    Please let me know where you got your design. Cheers

Leave a Reply

Your email address will not be published. Required fields are marked *