Marks and channels

Definitions
Marks are basic geometric elements that depict items or links.
Channels control the appearance of the marks.
This way you can describe the design space of visual encodings as an
orthogonal combination of these two aspects that allows to analyze
and design the visual elements.
Channel synonyms: attribute, dimension, variable, feature, carrier.
Visual synonyms: graphic, perceptual, retinal.

Marks
Marks can be classified according to the number of dimensions
required for their representation:
Zero: points
One: lines
Two: surfaces
Three: volumes

Visual channels
Spatial position:
Alignment:
Depth (3D)
Regions:
Color:
Hue:
Saturation:
Luminance:
Size:
Length:
Area:

Volume:
Orientation:
Curvature:
Shape:
Stipple patterns:
Dots:
Dashes:
Motion

Example combining channels and marks

Attributes: qualitative and quantitative Two quantiative attributes

Three quantitative attributes

Three quantitative attributes and one qualitative

Channel types
Humans have two basic types of sensory modalities:
Channels related to what and where channels: provide
information about identity and location. Examples: shape, hue,
spatial patterns or motion.
Los canales relacionados con el qu y el dnde: proporcionan
informacin sobre la identidad y la ubicacin. Ejemplos: forma,
tono, patrones espaciales o movimiento.
Channels related to how-much: provide quantitative information.
Examples: length, area, volume, saturation, luminance,
orientation.

Mark types
In a table, a mark represents an item.
In a network, marks can be nodes or links. Links represent
relationships between items.
There are two types of link marks:
Connection marks: define pairwise relationships between two
items, using a line.
Containment marks (enclosure, nesting): define hierarchical
relationships using nested areas at multiple levels.

Using mark and channels

The use of marks and channels should be guided by the principles of
expressiveness and efficiency.
They allow the creation of a ranking of channels that are suitable for
visual encoding of the data types to be used.

Expressiveness principle
The expressiveness principle specifies that visual encoding should
express all, an only, the information in the dataset attributes.
It follows that the ordered data should be presented in a way that our
perceptual system detects it as an intrinsic order. Conversely, not
ordered data should never be displayed in a way that we perceive
some order.
What/Where channels are adequate for categorical attributes that
have no intrinsic order.
How-much channels are adequate for ordered attributes.

Effectiveness principle
The effectiveness principle indicates that the importance of the
attribute should match the salience of the visual channel, ie with its
noticeability.
The most important attributes should be encoded with the most
effective channels.

Channels ranking: ordered attributes

Spatial position (2D) on common scale:
Spatial position (2D) on unaligned scale:
Length:
Orientation:
Area:
Depth (3D position):
Saturation:
Luminance:
Volume:
Curvature:

Channels ranking: categorical attributes

Spatial region:
Hue:
Motion
Shape:
The attributes encoded with spatial positions will be the most predominant
in the mental model of users.

Criteria for defining the effectiveness

channels ranking
Accuracy.
Discriminability.
Separability.
Popout.
Grouping.

Criteria: accuracy
It determines how close is human perception to some objective
measure of stimulation.
Psychophysics is a subfield of psychology that studies the systematic
measurement of human perception.
The apparent magnitude of all sensory channels follow a potential
function based on the stimulus intensity: =
where S is the perceived sensation, I is the magnitude of the physical
stimulus. It is what is called the Stevens Law.

Criteria: discriminability
It determines it there are noticeable differences between different
items encoded with a particular visual channel.
The characterization of a visual channel should quantify the number
of bins that are available for being used, where each bin represents a
new level of discrimination from the previous bin.
The key factor is that the number of values of a given attribute dont
exceed the number of bins available in the visual channel.
If this restriction is not met, you will need to add values or choose
another visual channel.

Criteria: separability
You can not consider that all visual channels are completely
independent.
You can establish a continuous gradation between pairs of channels
ranging from those channels that are orthogonal and independent
separable to the channels whose combination is inherently integral
(not separable).
The visual coding will be easy to do if separable channels are used,
but it will fail if integral channels are used because users will not be
able to access the information required for each attribute, but they
will receive a combination of unwanted stimuli.

Fully separable: position and color

Significant interference: size (width and height)

Some interference: size and color

Major interference: colors red and green

Criteria: popout
Many visual channels provide a visual popout, by which an item
stands out from the rest immediately.
The great value of the auto attendant is that the time required to
identify the different object does not depend on the number of
distracting objects.
This process is performed by the human visual system unconsciously.

[Heyley]

20 items color encoded

Shape-based encoding

Many items color encoded

Visual encoding based on shape and color

Orientation

Spatial proximity

Size

Shadow direction

Shape

Paralelism

Criteria: popout
All visual channels previously presented support popout individually .
As a general rule, there should only be one channel at a time used to
popout items, although some combinations of pairs of channels also
respect this criterion: i.e. spatial position and color; movement and
shape.
In addition, popout is not a binary phenomenon (all or nothing): it
depends on the channel and the context in which the target item is
located.

Criteria: grouping
The perception of groups mainly arises from the use of link marks or
from what channels encoding categorical attributes.
Marks are based on using containment areas or lines connecting
items.
Containment is the more powerful cue for grouping. Then, it comes
connection.

Criteria: grouping
All items associated with a particular visual representation of a
categorical attribute are perceived as a group if we can focus our
attention exclusively on the categorical attribute selected.
This encoding is not as powerful as visual marks, but it doesnt
overload the image with additional marks that need to be
incorporated along with the data.
Another form of grouping is to use spatial proximity.
The last possible option is the similarity with any of the categorical
channels, mainly hue and motion, tone color and movement, and to a
lesser extent, shape.

Webers Law
Human perception is based on Weber's Law: the minimum detectable
amount of a stimulus intensity I is a fixed value K proportional to its
magnitude: = .
This Law holds for any sense perceived by human beings.
Esta Ley se cumple para cualquiera de los sentidos percibidos por los
humanos.
This must be taken into account when some criteria such as accuracy
or discriminability are analyzed.

Webers Law
For example: estimate the length with a common scale is much
easier to do that doing it without the common scale.

Unaligned
and unframed
rectangles

Unaligned
and framed
rectangles

Aligned
rectangles

Webers Law
For example: the perception of color and luminance depends on
contextual information, based on the contrast with the colors around
[Adelson].

References
Tamara Munzner. Visualization Analysis and Design. A K Peters Visualization
Series. CRC Press. Oct 2014.
William S. Cleveland and Robert McGill. Graphical Perception: Theory,
Experimentation, and Application to the Development of Graphical
Methods." Journal of the American Statistical Association 79:387 (1984),
531-554.
S. S. Stevens. Psychophysics: Introduction to its Perceptual, Neural, and
Social Prospects. Wiley, 1975.
[Healey]: www.csc.ncsu.edu/faculty/healey/PP/
[Adelson]:
http://web.mit.edu/persci/people/adelson/checkershadow_illusion.html