Lecture Topic Projects

1 Intro, schedule, and logistics

2 Applications of visual analytics
3 Basic tasks, data types Project #1 out
4 Data assimilation and preparation
5 Introduction to D3
6 Bias in visualization
7 Data reduction and dimension reduction
8 Data reduction and dimension reduction Project #2(a) out
9 Visual perception and cognition
10 Visual design and aesthetics
11 Cluster analysis: numerical data
12 Cluster analysis: categorical data Project #2(b) out
13 High-dimensional data visualization
14 Dimensionality reduction and embedding methods
15 Principles of interaction
16 Midterm #1
17 Visual analytics Final project proposal call out
18 The visual sense making process
19 Maps
20 Visualization of hierarchies Final project proposal due
21 Visualization of time-varying and time-series data
22 Foundations of scientific and medical visualization
23 Volume rendering Project 3 out
24 Scientific and medical visualization Final Project preliminary report due
25 Visual analytics system design and evaluation
26 Memorable visualization and embellishments
27 Infographics design
28 Midterm #2
https://askabiologist.asu.edu/rods-and-cones
What can you observe here?
 color (cones) in the
center
 grey (rods) outside, too
 more grey
 more green
 blind spot
Focus on the black circle for
a few seconds, then switch to
one of the white fields.

What do you see?

 While the retina can perceive a high range of intensities, it cannot
handle all simultaneously
 at any given time, each region adapts to a small intensity range determined
by the local intensity
 that is why you have to wait a while when you step from a bright into a
dark room (say, a dark movie theater from a brightly lit lobby)

eventually the bright area

intensity is unsaturated,
after moving the eye:
matches neighborhood
eventually adapted
(which was already adapted
range
here before)
currently adapted after moving the eye:
range new bright area saturates
intensity perception

current dark area

in picture falls here
 The reason lies in the center/surround organization of the
Ganglion cells in the receptive field

Ganglion 1 Ganglion 3
10/16 inputs 12/16 inputs
exposed to light exposed to light
8 are excitatory 8 are excitatory
2 inhibitory 4 inhibitory
-> 6 stimulated -> 4 stimulated

Ganglion 2
no exposure
-> no stimulation

Ganglion 1 senses brighter than ganglion 3

-> that’s why the line intersections appear grey
Why do the dark spots disappear as soon as you look directly
at them?

It’s because:
 our central vision is sharp and clear, allowing us to resolve details
with great accuracy
 ganglion cells close to the fovea have a very small receptive field,
with fewer inhibitory inputs
 therefore, at the fovea, there is less inhibition of the center by the
surround, and the dark spots disappear

Read more here

Local adaption level varies, which changes the relative
contrast of the objects in the local scene

Are these two strips the same or different?

Compare these three panels
 white background
 saturated background
 non-saturated background

Guidelines:
 use saturated colors sparingly
 they may cause undesired
effects
 neutral borders can help
Spectrum of Wavelengths
 Perception Curves

human color sensitivity curves

color generation by mixing RGB primaries (tristimulus)

Perceptual Color Spaces
The CIE Chromaticity Diagram
The CIE Chromaticity Diagram
The (irregularly shaped) Munsell tree has 3 axes:
 chroma (saturation): distance from the core
(values 0-30, with fluorescent colors having
the maximum 30)
 value (brightness): vertical axis (0– 10 (white))
 hue: 10 principal hues (R, YR, Y, GY, G, BG,
B, PB, P, RP)
 blue
magenta
cyan
white
green

red

yellow HSV
RGB

How to convert from RGB to HSV?

Difference of brightness in
adjacent regions of the image
 grey-level (luminance) contrast
 color contrast
Munsell tree – unwrapped color
 ignore the red circles
 look at what heights the
longest rows are

same image in grey-scale (brightness only)

Different wavelengths of light are focused at different
distances within the eye
 short-wavelength blue light is refracted more than long-
wavelength red light
 focusing on a red patch, an adjacent blue patch will be
significantly out of focus
 the human eye has no correction for chromatic aberration
 red object closer fixed focal point

red object
out of focus

would have to shift focal point to the left to bring red object into focus
in the case before, all objects were in the same plane but the focal point changed
the blurring effect is equivalent  need to change focal point to gain focus for either color
this is tiring to the eye and causes the problems
This is really painful
This is better
Visual cortex breaks input up into different aspects:
 color, shape, motion, depth
Deep Learning is Inspired by the Brain

Pathway of perception and

cognition in the human brain with
processing times

Pathway of perception and

cognition in a deep neural network
 Pre-Attentive Processing

If you want it or not: some features are always detected

And fast – within 200 ms or less
 Pre-Attentive Processing

Why is it so fast?

Well, because 50% of the brain is dedicated to vision

Vision is a MASSIVELY parallel processor dedicated to

• detect
• analyze
• recognize
• reason with
visual input
 Pre-Attentive Processing

Sensitivity to differences in:

• color, orientation, size, shape, motion, shading, 3D depth, …
 Pre-Attentive Processing

But there are limits: conjunctions don’t work well

quick: find the blue circle

 Pre-Attentive Processing

Some features/cues are stronger than others:

 Pre-Attentive Processing

Now try this (the left brain takes a break)

 Pre-Attentive Processing

Words are patterns, which form strong pre-attentive feature

• this would have been different if this had been done in Arabic

There are limits, however

• let’s see the next experiment
 Pre-Attentive Processing

Reading 1
Aoccdrnig to a rscheearch at an Elingsh
uinervtisy, it deosn't mttaer in waht oredr the
ltteers in a wrod are, the olny iprmoetnt tihng
is taht frist and lsat ltteer is at the rghit pclae.
The rset can be a toatl mses and you can
sitll raed it wouthit porbelm. Tihs is bcuseae
we do not raed ervey lteter by it slef but the
wrod as a wlohe
 Pre-Attentive Processing

Now, is tihs ture? Raed on….

 Pre-Attentive Processing

Reading 2
Anidroccg to crad cniyrrag lcitsiugnis
planoissefors at an uemannd, utisreviny
in Bsitirh Cibmuloa, and crartnoy to the
duoibus cmials of the ueticnd rcraeseh,
a slpmie, macinahcel ioisrevnn of
ianretnl cretcarahs araepps sneiciffut to
csufnoe the eadyrevy oekoolnr
 Pre-Attentive Processing

Reading 2
According to card carrying linguistics
professionals at an unnamed, university
in British Columbia, and contrary to the
dubious claims of the uncited research,
a slpmie, macinahcel ioisrevnn of
ianretnl cretcarahs araepps sneiciffut to
csufnoe the eadyrevy oekoolnr
 Pre-Attentive Processing

Reading 2
According to card carrying linguistics
professionals at an unnamed, university
in British Columbia, and contrary to the
dubious claims of the uncited research,
a simple, mechanical inversion of
internal characters appears sufficient to
confuse the everyday onlooker
 What To Learn From This

The human visual system (HSV) tolerates (visual) noise very

well
• it can read the randomly garbled text very well
• machines (equipped with computer vision) are poor at this
Humans have only limited computational capacity
• hard to execute a fixed rule to decipher text
• especially once the text gets longer (7±2 rule of working memory)
• this is where computers excel
The fact that computers deal poorly with noisy patterns is
exploited in CAPTCHA
• CAPTCHA: Completely Automated Public Turing Test to tell
Computers and Humans Apart
• used to ensure that an actual human is interacting with a system
• some examples:
- creating a new gmail or yahoo account (prevent spammer accounts)
- submitting files, data, email
 CAPTCHA

CAPTCHA: noisy and vastly distorted patterns that are difficult

to recognize by machines
 CAPTCHA

But computer vision algorithms have become more

sophisticated at CAPTCHA character recognition
• the latest approach is object recognition
Sensing
 the eye’s anatomy
 its intensity perception
 its shortcomings and imperfections (keep in mind)

Color
 spaces and representations
 perception and organization in the brain
 contrast (what to look out for)
 use for highlighting, pre-attentive processing
 recognition

Texture
 depth cues
 feature enhancement