Mater of Arts in Communication Design

WEB DESIGN
Visual perception

Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

1
Visual perception is the ability to
interpret the surrounding environment
by processing information that is
contained invi...
Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

3
I see vs I feel

Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

4
1/3 of brain energy!
• We get 70% of information by vision

Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

5
Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

6
Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

7
Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

8
Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

9
Cones
• Sensitive to colors
• Concentrated in the center
• 6,000,000

Rodes
•
•
•
•
•

Sensitive to light intensity
Insens...
Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

11
Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

12
Sensitivity is not omogenueous
• Diferences in green
are are more
perceived then in
red area
• More pigment
addition neede...
Blind spot

Right eye
Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

14
Focusing

Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

15
Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

16
Geting older makes focusing less easy

Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

17
Optic chiasma

Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

18
Vision and thinking
Vision and thinking are
always interconnected
Data are continuously under
elaboration.
We recognize ob...
Automatic correction of brightness

On the sun

Into a room

White paper

120

6

Black ink

12

0.6

David Hubel
Titolo l...
EMOTION
Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

21
Synestesia
Synesthesia (also spelled synæsthesia or
synaesthesia, from the ancient Greek σύν
[syn], "together", and αἴσθησ...
WEB DESIGN NABA 2014 Roberto DADDA

Tina Modotti

Titolo lezione

23
WEB DESIGN NABA 2014 Roberto DADDA

Ansel Adams

Titolo lezione

24
WEB DESIGN NABA 2014 Roberto DADDA

Henry Cartier Bresson

Titolo lezione

25
Different distance or different dimension?

Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

26
Gustave Caillebotte (Parigi, 19 agosto 1848 – Gennevilliers, 21 febbraio 1894)
27
WEB DESIGN NABA 2014 Roberto DADDA
Titol...
Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

28
Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

29
Viewing point

Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

30
Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

31
Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

32
Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

33
Lateral inhibition (Mach effect)

Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

34
Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

35
Titolo lezione

WEB DESIGN NABA 2014 Roberto DADDA

36
Eye movements
• Saccade refers to a rapid jerk-like movement of the
eyeball which subserves vision by redirecting the
visu...
Some measured data
Action
Silent reading
Loud reading
Visual search
Image
inspection

Fixation time Saccade angle
ms
⁰
225...
Roberto Dadda
www.dadda.it
roberto@dadda.it
+39 338 775 22 03
Twitter, facebook, linkedin: robertodadda

Titolo lezione

W...
Upcoming SlideShare
Loading in …5
×

Visual perception

408 views

Published on

Visual perception fundamentals for web designers

Published in: Design
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
408
On SlideShare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
7
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Visual perception

  1. 1. Mater of Arts in Communication Design WEB DESIGN Visual perception Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 1
  2. 2. Visual perception is the ability to interpret the surrounding environment by processing information that is contained invisible light. Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 2
  3. 3. Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 3
  4. 4. I see vs I feel Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 4
  5. 5. 1/3 of brain energy! • We get 70% of information by vision Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 5
  6. 6. Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 6
  7. 7. Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 7
  8. 8. Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 8
  9. 9. Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 9
  10. 10. Cones • Sensitive to colors • Concentrated in the center • 6,000,000 Rodes • • • • • Sensitive to light intensity Insensitive to colors Night vision and movement Concentrated in the periphery 120,000,000 Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 10
  11. 11. Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 11
  12. 12. Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 12
  13. 13. Sensitivity is not omogenueous • Diferences in green are are more perceived then in red area • More pigment addition needed to feel a different color Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 13
  14. 14. Blind spot Right eye Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 14
  15. 15. Focusing Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 15
  16. 16. Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 16
  17. 17. Geting older makes focusing less easy Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 17
  18. 18. Optic chiasma Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 18
  19. 19. Vision and thinking Vision and thinking are always interconnected Data are continuously under elaboration. We recognize objects, even if we see them only partially and we some times we are deceived. Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 19
  20. 20. Automatic correction of brightness On the sun Into a room White paper 120 6 Black ink 12 0.6 David Hubel Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 20
  21. 21. EMOTION Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 21
  22. 22. Synestesia Synesthesia (also spelled synæsthesia or synaesthesia, from the ancient Greek σύν [syn], "together", and αἴσθησις *aisthēsis], "sensation") is a neurological phenomenon in which stimulation of one sensory or cognitive pathway leads to automatic, involuntary experiences in a second sensory or cognitive pathway Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 22
  23. 23. WEB DESIGN NABA 2014 Roberto DADDA Tina Modotti Titolo lezione 23
  24. 24. WEB DESIGN NABA 2014 Roberto DADDA Ansel Adams Titolo lezione 24
  25. 25. WEB DESIGN NABA 2014 Roberto DADDA Henry Cartier Bresson Titolo lezione 25
  26. 26. Different distance or different dimension? Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 26
  27. 27. Gustave Caillebotte (Parigi, 19 agosto 1848 – Gennevilliers, 21 febbraio 1894) 27 WEB DESIGN NABA 2014 Roberto DADDA Titolo lezione
  28. 28. Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 28
  29. 29. Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 29
  30. 30. Viewing point Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 30
  31. 31. Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 31
  32. 32. Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 32
  33. 33. Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 33
  34. 34. Lateral inhibition (Mach effect) Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 34
  35. 35. Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 35
  36. 36. Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 36
  37. 37. Eye movements • Saccade refers to a rapid jerk-like movement of the eyeball which subserves vision by redirecting the visual axis to a new location. (400⁰/s, 20-50 ms) • Fixation refers to keeping eye on a specific position. Vision is dependent upon the information taken in during fixation pauses between saccades: no useful visual information is taken in while the eyes are making a saccadic movement. • Scanpath the sum of those actions http://www.scholarpedia.org/article/Human_saccadic_eye_movements Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 37
  38. 38. Some measured data Action Silent reading Loud reading Visual search Image inspection Fixation time Saccade angle ms ⁰ 225 2⁰ (8 char) 275 1.5⁰ (6 char) 275 3⁰ 330 4⁰ Mean values Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 38
  39. 39. Roberto Dadda www.dadda.it roberto@dadda.it +39 338 775 22 03 Twitter, facebook, linkedin: robertodadda Titolo lezione WEB DESIGN NABA 2014 Roberto DADDA 39

×