As a follow-up to a prior blog post on the “Top 7 Data Visualization Best Practices”, I wanted to go into a bit more detail about “visual features”. In the prior blog, we discussed “intuitive” data visualizations and how that stems from your brain pre-attentively processing visuals. While it’s not technically accurate, many people think of pre-attentive processing as subconsciously understanding a visual. However you describe it, it is fast! On the order of 40-50 milliseconds for the average person. To put that in perspective, a single flap of a hummingbird’s wings is about 20 milliseconds. Alternatively, the human brain perceives anything around 30 milliseconds as “continuous”, which is how “motion pictures” work. So 40 milliseconds would be around the speed of a single frame in a movie.
Unfortunately, not all things can be processed pre-attentively. Text and numbers cannot be processed pre-attentively, nor can 3D images. Of course, this begs the question, what *CAN* be processed pre-attentively?
Visual features that can be processed pre-attentively fall into four basic categories: form, colour, position, and motion.
Form: How shapes appear in terms of shape, size, orientation, etc.
Colour: How shapes appear to eyes in terms of combinations of red, blue, and green.
Position: Where shapes appear in relation to each other.
Motion: The direction in which shapes move compared to each other.
Naturally these four categories of visual features help us to classify pre-attentive visual features, but they don’t really help us understand exactly what each one is. Luckily we have a list of the various visual features that belong to each type. Everything in this list can be processed very quickly by your end users.
For all of the following visual features, the average person can spot the “difference” in 40-50 milliseconds. For some of these visual features the term used may not be self-explanatory, so a brief description is provided below the term.
The majority of pre-attentive visual features fall into this category. This category includes the following:
Orientation
Length/width
Size
Enclosure
Density
Curvature
Shape
Concave/convex
Of this list, concave and convex are not normally used due to their three dimensional appearance.
So while concavity/convexity can be processed pre-attentively, it is not generally best practice to include this when visualizing data.
There are only two visual features related to colour that can be processed pre-attentively, and they are intensity and hue.
Intensity (lighter variation of a colour already present)
Hue (a colour different from other colours already present)
In positional visual features, there are only two that can be processed pre-attentively, and they are two-dimensional (2D) position and stereoscopic depth.
2D Position
Sterioscopic Depth (appearance of one object being “deeper” or “further away” than another)
While it is possible to pre-attentively process motion, the use of motion can also be very distracting when visualizing data. The visual features in this type include flicker, direction of motion, and velocity. These three are presented for completeness of theory, but use of motion should be kept to a minimum, if used at all. This is mainly due to the fact that motion when combined with other pre-attentive visual features, normally results in post-attentive processing. While some visual features can be combined without difficulty, motion cannot generally combine with other visual features and remain pre-attentive.
Be careful when using pre-attentive visual features, as not all go well together, and use of too many pre-attentive visual features actually forces the brain to process the visual post-attentively, which is considerably slower. For example, look at the following images:
Velocity
Direction of Motion
Flicker
Be careful when using pre-attentive visual features, as not all go well together, and use of too many pre-attentive visual features actually forces the brain to process the visual post-attentively, which is considerably slower. For example, look at the following images:
Image A
Image B
As another example, in the following image, find the three red squares.
Or in this image, is there a red circle?
These last two questions take considerably longer than 40-50 milliseconds, so they would be considered post-attentive, meaning they take focused attention to view, perceive, and comprehend.
There you have it… the official list of pre-attentive visual features. I’m not normally one to memorize things, but when it comes to data visualization, I recommend committing the list of pre-attentive features to memory. In addition, memorizing the list of visual feature effectiveness by data type from my previous blog is also a huge help when designing data visualizations.
