Another very important concept to consider,
is the concept of contrast.
So, what is contrast?
We can define contrast,
as the difference in colors,
that make objects distinguishable.
So, let me give you an example.
That's the best way to introduce the concept. Look at this.
So, we have two different texts,
that are colored with different color,
but the same background color.
And as you can see, I think it's not hard to see,
in one of the images text,
is very easy to read the one at the bottom,
and the other one is much harder to read,
the one on the top.
So, that's a very good example of contrast.
The one on top is very little contrast between the background and the color,
that he's used for texts.
Whereas the one at the bottom, exactly the opposite.
There is a lot of contrast between the background color,
and the foreground color used in the text.
So, you may ask yourself,
why is contrast important in visualization?
There are a number of reasons.
But I would say that the main reason why you should be
aware of contrast effects in visualization,
is because visualization are often organized in layers.
There are multiple layers,
and the way you play with contrast,
to show these layers,
and to find good relationships within these layers, is very important.
So, what are examples of layers?
Like the difference between background colors, and foreground color?
So, background color and foreground objects?
Or even grids, that are used in charts?
Or the difference between labels and text and the rest?
Or in maps, when a map is used as the background,
and then there are visual marks depicted on top?
So, there are lots of examples out there,
where a given visualization is organized in multiple layers.
And contrast, is the main tool,
that you can use to separate these layers.
Let me give you a few examples.
So, here we have a scatter plot,
and the background color is fully white,
and the color used for the marks, is yellow.
But unfortunately, yellow is a very bright color,
and the white background is also very white,
so there's not a lot of contrast between these two.
But if I switch the background color,
and they keep the foreground color of the visual marks the same,
now I have a lot of contrasts,
because the background color is very dark,
and the foreground color used for the marks, is very bright.
So you have a lot more contrast between these two.
Let me give you another example.
So here, there is a grid,
and this is visualization that shows,
train stations and a timetable of trains between Paris and Leon,
is actually very popular visualization published in a book from Edward Tufte.
And here are two versions.
That's the original version,
and this is the version redesigned by Tufte.
It's exactly the same information,
but the grid that is in the background,
has been toned down,
by using a gray shade.
So look at the difference.
This is, you have the lines of the trains are very dark,
but the grid is also very dark.
Whereas in this one,
the lines that represent the trains,
are very dark and the grid is not dark at all,
it's just low saturation shades of grey.
And because of that, there is a lot more contrast between these two,
and you can see the lines much better.
The grid and the lines are not competing against each other.
So, these kind of effects are so often present in visualizations of all kind.
If you start looking for these kind of effects,
you'll find a lot of them,
in all sorts of visualizations,
and charts, and maps, and so on.
So, thinking about contrast,
is a very important concept for visitation.
Enrico BertiniAssociate Professor
Cristian FelixPhD. Candidate
