week 4 - a visual contrasts
TRANSCRIPT
![Page 1: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/1.jpg)
IMD09117 and IMD09118 Web Design and Development Unit 4
Visual contrasts and perceptual organisation
![Page 2: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/2.jpg)
Visual contrasts
Version A Unit 4 ©2008 Napier University
Visual contrasts are established by changing the perceptual qualities of the 8 retinal variables
These changes are perceived immediately and effortlessly
![Page 3: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/3.jpg)
Visual contrasts
Version A Unit 4 ©2008 Napier University
size, dimension or scale, the relative size and measurement of an image
value
hue and saturation, the make up of colour co-ordination of value with added component of chroma
![Page 4: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/4.jpg)
Visual contrasts
Version A Unit 4 ©2008 Napier University
direction or orientation
texture, optical or tactile, the surface characteristic of visual materials
shape
position
movement
![Page 5: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/5.jpg)
Visual contrasts
Version A Unit 4 ©2008 Napier University
Size, dimension or scale
![Page 6: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/6.jpg)
Visual contrasts
Version A Unit 4 ©2008 Napier University
Value, relative lightness or darkness
![Page 7: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/7.jpg)
Visual contrasts
Version A Unit 4 ©2008 Napier University
Expresses emotions, form, space, movement as well as the illusion of light
Dark areas represent gloom, mystery,drama and menace
Light areas represent happiness, fun, gaiety, warmth and closeness
Value
![Page 8: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/8.jpg)
Visual contrasts
Version A Unit 4 ©2008 Napier University
Hue and saturation
![Page 9: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/9.jpg)
Visual contrasts
Version A Unit 4 ©2008 Napier University
Orientation or direction
![Page 10: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/10.jpg)
Visual contrasts
Version A Unit 4 ©2008 Napier University
Texture
![Page 11: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/11.jpg)
Visual contrasts
Version A Unit 4 ©2008 Napier University
Shape
![Page 12: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/12.jpg)
Visual contrasts
Version A Unit 4 ©2008 Napier University
Position
![Page 13: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/13.jpg)
Effective visual variables
Number of dimensions
Scale of measurement for each dimension
Length
Version A Unit 4 ©2008 Napier University
Information in a visual display is characterised by
![Page 14: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/14.jpg)
Effective visual variables
Nominal
Associative
Selective
Ordered
Quantitative
Version A Unit 4 ©2008 Napier University
Scale of measurement
![Page 15: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/15.jpg)
Effective visual variables
A visual variable is associative if it does not affect the visibility of other dimensions
Otherwise dissociative
Version A Unit 4 ©2008 Napier University
Associative perception
![Page 16: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/16.jpg)
Effective visual variables
Which dimensions are associative?
Which dimensions are dissociative?
Version A Unit 4 ©2008 Napier University
Associative perception
![Page 17: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/17.jpg)
Effective visual variables
Version A Unit 4 ©2008 Napier University
Selective perception
A visual variable is selective if it effortless to isolate one particular instance of a variable
![Page 18: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/18.jpg)
Effective visual variables
Version A Unit 4 ©2008 Napier University
Selective perception
Which dimensions are selective?
Which dimensions are not selective?
![Page 19: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/19.jpg)
Effective visual variables
Version A Unit 4 ©2008 Napier University
K
NK
M
K
Z
K K
Z
Z
Z
K
N
M
N
K
![Page 20: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/20.jpg)
Effective visual variables
Version A Unit 4 ©2008 Napier University
K
NK
M
K
Z
K K
Z
Z
Z
K
N
M
N
K
![Page 21: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/21.jpg)
Effective visual variables
Version A Unit 4 ©2008 Napier University
Ordered perception
Objects should be able to be put into ranked order based on the visual variable
Immediately obvious and easy
No need for a key
![Page 22: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/22.jpg)
Effective visual variables
Version A Unit 4 ©2008 Napier University
Ordered perception
Which variables are ordered in human perception?
size, value, hue, orientation, texture, shape or position?
![Page 23: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/23.jpg)
Effective visual variables
Version A Unit 4 ©2008 Napier University
Ordered perception
![Page 24: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/24.jpg)
Effective visual variables
Version A Unit 4 ©2008 Napier University
Quantitative perception
Viewer can see the relative value differences based on the visual variable
Immediately obvious and easy to calculate
No need for a key
![Page 25: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/25.jpg)
Effective visual variables
Version A Unit 4 ©2008 Napier University
Quantitative perception
Which variables are quantitative in human perception?
size, value, hue, orientation, texture, shape or position?
![Page 26: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/26.jpg)
Effective visual variables
Version A Unit 4 ©2008 Napier University
Length of the variables
The visual variables differ in length
Number of discernibly different measurement levels each can support
![Page 27: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/27.jpg)
Effective visual variables
Version A Unit 4 ©2008 Napier University
Length of the variables
Arrange the visual variables size, value, hue, orientation, texture, shape or position in order of their length.
![Page 28: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/28.jpg)
Effective visual variables
Version A Unit 4 ©2008 Napier University
Length of the variables
Shape
Position
Size and hue
Value and texture
Orientation
![Page 29: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/29.jpg)
Perceptual organisation
Version A Unit 4 ©2008 Napier University
Gestalt principlesProximity
Similarity
Continuity of direction
Closure
Common fate
![Page 30: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/30.jpg)
Perceptual organisation
Version A Unit 4 ©2008 Napier University
Proximity
![Page 31: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/31.jpg)
Perceptual organisation
Version A Unit 4 ©2008 Napier University
Proximity
![Page 32: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/32.jpg)
Perceptual organisation
Version A Unit 4 ©2008 Napier University
Similarity
![Page 33: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/33.jpg)
Perceptual organisation
Version A Unit 4 ©2008 Napier University
Similarity
![Page 34: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/34.jpg)
Perceptual organisation
Version A Unit 4 ©2008 Napier University
Similarity
![Page 35: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/35.jpg)
Perceptual organisation
Version A Unit 4 ©2008 Napier University
Similarity
![Page 36: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/36.jpg)
Perceptual organisation
Version A Unit 4 ©2008 Napier University
Continuity of direction
![Page 37: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/37.jpg)
Perceptual organisation
Version A Unit 4 ©2008 Napier University
Continuity of direction
![Page 38: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/38.jpg)
Perceptual organisation
Version A Unit 4 ©2008 Napier University
Closure
![Page 39: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/39.jpg)
Perceptual organisation
Version A Unit 4 ©2008 Napier University
Closure
![Page 40: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/40.jpg)
Perceptual organisation
Version A Unit 4 ©2008 Napier University
Closure
![Page 41: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/41.jpg)
Perceptual organisation
Version A Unit 4 ©2008 Napier University
Common fate
![Page 42: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/42.jpg)
Perceptual organisation
Version A Unit 4 ©2008 Napier University
Experience
EE
![Page 43: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/43.jpg)
Perceptual organisation
Version A Unit 4 ©2008 Napier University
Experience
EE
![Page 44: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/44.jpg)
Perceptual organisation
Version A Unit 4 ©2008 Napier University
Experience
![Page 45: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/45.jpg)
Summary
Version A Unit 4 ©2008 Napier University
Perceptual qualities: size, value, hue, orientation, texture, shape, position and movement.
Visual display can be characterised by the number of dimensions, their length and the scale of the measurement.
![Page 46: Week 4 - A Visual Contrasts](https://reader033.vdocuments.us/reader033/viewer/2022052823/5557508ed8b42aa8378b51f4/html5/thumbnails/46.jpg)
Summary
Version A Unit 4 ©2008 Napier University
Scale of measurement can be associative, selective, ordered or quantitative.
Perceptual organisation considers the grouping of objects including proximity, similarity, continuity, closure and common fate. Experience is also used