SlideShare a Scribd company logo
IMD09117 and IMD09118  Web Design and Development Unit 4 Visual contrasts and perceptual organisation
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
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
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
Visual contrasts Version A Unit 4   ©2008  Napier University  Size, dimension or scale
Visual contrasts Version A Unit 4   ©2008  Napier University  Value, relative lightness or darkness
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
Visual contrasts Version A Unit 4   ©2008  Napier University  Hue and saturation
Visual contrasts Version A Unit 4   ©2008  Napier University  Orientation or direction
Visual contrasts Version A Unit 4   ©2008  Napier University  Texture
Visual contrasts Version A Unit 4   ©2008  Napier University  Shape
Visual contrasts Version A Unit 4   ©2008  Napier University  Position
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
Effective visual variables Nominal Associative Selective Ordered  Quantitative Version A Unit 4   ©2008  Napier University  Scale of measurement
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
Effective visual variables Which dimensions are associative? Which dimensions are dissociative? Version A Unit 4   ©2008  Napier University  Associative perception
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
Effective visual variables Version A Unit 4   ©2008  Napier University  Selective perception Which dimensions are selective? Which dimensions are not selective?
Effective visual variables Version A Unit 4   ©2008  Napier University  K N K M K Z K K Z Z Z K N M N K
Effective visual variables Version A Unit 4   ©2008  Napier University  K N K M K Z K K Z Z Z K N M N K
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
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?
Effective visual variables Version A Unit 4   ©2008  Napier University  Ordered perception
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
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?
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
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.
Effective visual variables Version A Unit 4   ©2008  Napier University  Length of the variables Shape Position  Size and hue Value and texture Orientation
Perceptual organisation Version A Unit 4   ©2008  Napier University  Gestalt principles Proximity Similarity Continuity of direction Closure Common fate
Perceptual organisation Version A Unit 4   ©2008  Napier University  Proximity
Perceptual organisation Version A Unit 4   ©2008  Napier University  Proximity
Perceptual organisation Version A Unit 4   ©2008  Napier University  Similarity
Perceptual organisation Version A Unit 4   ©2008  Napier University  Similarity
Perceptual organisation Version A Unit 4   ©2008  Napier University  Similarity
Perceptual organisation Version A Unit 4   ©2008  Napier University  Similarity
Perceptual organisation Version A Unit 4   ©2008  Napier University  Continuity of direction
Perceptual organisation Version A Unit 4   ©2008  Napier University  Continuity of direction
Perceptual organisation Version A Unit 4   ©2008  Napier University  Closure
Perceptual organisation Version A Unit 4   ©2008  Napier University  Closure
Perceptual organisation Version A Unit 4   ©2008  Napier University  Closure
Perceptual organisation Version A Unit 4   ©2008  Napier University  Common fate
Perceptual organisation Version A Unit 4   ©2008  Napier University  Experience E
Perceptual organisation Version A Unit 4   ©2008  Napier University  Experience E
Perceptual organisation Version A Unit 4   ©2008  Napier University  Experience
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.
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

More Related Content

PPTX
Doing data visualizations with tableau
PDF
Towards Information-Theoretic Visualization Evaluation Measure: A Practical e...
PPTX
Dabbling with Data Visualisation
PPT
Crushing, Blending, and Stretching Data
PDF
Class 5
PPTX
Andy Kirk talk at Big Data World Europe, September 2012
PDF
Introduction to Visual Management
PDF
Richard Ellis: Digital R&D in the Arts Annual Forum
Doing data visualizations with tableau
Towards Information-Theoretic Visualization Evaluation Measure: A Practical e...
Dabbling with Data Visualisation
Crushing, Blending, and Stretching Data
Class 5
Andy Kirk talk at Big Data World Europe, September 2012
Introduction to Visual Management
Richard Ellis: Digital R&D in the Arts Annual Forum

Viewers also liked (18)

PPT
Scene 1.1 - Creative and Media Venues
PPTX
Visual art
PPTX
Infusing technology in the v isual arts classroom
PDF
Data visualization - see things differently. Natalie Yadrentseva
PPTX
Andhra cuisine by indianchefrecipe @ www.indianchefrecipe.com
PPTX
Organization in Architecture
PPT
The Importance of Visual Art in Food
PDF
Visual Art Law by Henry Lydiate
PPTX
Organization in the visual arts 1
PDF
Exploring the Potential of Visual Art in Negotiating Social Transformation at...
PPTX
Notes on visual representation
PPT
The creative media in our local scene
PPT
Dots, lines and planes
PPTX
Mandala assignment
PPTX
Sunrise Andhra Pradesh- Presentation by Mr. J. Krishna Kishore IRS, CEO of An...
PPTX
Foods Habits in Different parts of India
PPTX
Forms of Digital Art
Scene 1.1 - Creative and Media Venues
Visual art
Infusing technology in the v isual arts classroom
Data visualization - see things differently. Natalie Yadrentseva
Andhra cuisine by indianchefrecipe @ www.indianchefrecipe.com
Organization in Architecture
The Importance of Visual Art in Food
Visual Art Law by Henry Lydiate
Organization in the visual arts 1
Exploring the Potential of Visual Art in Negotiating Social Transformation at...
Notes on visual representation
The creative media in our local scene
Dots, lines and planes
Mandala assignment
Sunrise Andhra Pradesh- Presentation by Mr. J. Krishna Kishore IRS, CEO of An...
Foods Habits in Different parts of India
Forms of Digital Art
Ad

Similar to Week 4 - A Visual Contrasts (20)

PPT
Week 5 - Visual Hierarchies
PDF
Fundamentals of visual communication unit iii
PPT
Week 3 - A Presentation Visual Components
PPT
PDF
Intro to data visualization
PPTX
Visual composition slideshow - Rubina Chand
PDF
Principles of Design
PPT
Basic visual design principles
PPT
Perspective Principles
PPT
2012 skin & body senses-perception
PDF
SiriusCon2016 - Embrace the Power of Design. Core Principles for Creating Eff...
PPTX
Visual Media
PDF
The back of the napkin Presentation
PPTX
04 data viz concepts
PDF
Introduction to Information Visualization (Part 1)
PPT
Chapter 3 Psych. 1
PDF
Visual Principles of Experience Design: Blending Art and Science
PDF
Introduction to Data Visualization
PPT
Ch5andclips
Week 5 - Visual Hierarchies
Fundamentals of visual communication unit iii
Week 3 - A Presentation Visual Components
Intro to data visualization
Visual composition slideshow - Rubina Chand
Principles of Design
Basic visual design principles
Perspective Principles
2012 skin & body senses-perception
SiriusCon2016 - Embrace the Power of Design. Core Principles for Creating Eff...
Visual Media
The back of the napkin Presentation
04 data viz concepts
Introduction to Information Visualization (Part 1)
Chapter 3 Psych. 1
Visual Principles of Experience Design: Blending Art and Science
Introduction to Data Visualization
Ch5andclips
Ad

More from Graeme Smith (20)

PPT
Project Management - An Introductiuon
PPTX
Intro to the unit
PPTX
The CSS Box Model
PPTX
The art of presentations
PPTX
Typography, A Presentation
PPTX
Flip Book
PPT
Typography
PPTX
Typography and grids
PPT
Intro to Game Design
PPT
Composition, some basic rules of photography
PPTX
Form Validation
PPT
1 - Designing A Site
PPT
Personality Emotion
PPT
Personality Emotion
PPT
Information Design
PPT
Interaction Design
PPT
Colour
PPT
Web Functionality
PPT
Layout Principles
PPT
Layout Principles 1
Project Management - An Introductiuon
Intro to the unit
The CSS Box Model
The art of presentations
Typography, A Presentation
Flip Book
Typography
Typography and grids
Intro to Game Design
Composition, some basic rules of photography
Form Validation
1 - Designing A Site
Personality Emotion
Personality Emotion
Information Design
Interaction Design
Colour
Web Functionality
Layout Principles
Layout Principles 1

Recently uploaded (20)

PDF
7 ChatGPT Prompts to Help You Define Your Ideal Customer Profile.pdf
PPTX
VMware vSphere Foundation How to Sell Presentation-Ver1.4-2-14-2024.pptx
PDF
Empathic Computing: Creating Shared Understanding
DOCX
The AUB Centre for AI in Media Proposal.docx
PDF
Advanced methodologies resolving dimensionality complications for autism neur...
PDF
MIND Revenue Release Quarter 2 2025 Press Release
PPTX
Cloud computing and distributed systems.
PPTX
sap open course for s4hana steps from ECC to s4
PPTX
A Presentation on Artificial Intelligence
PDF
Network Security Unit 5.pdf for BCA BBA.
PDF
Reach Out and Touch Someone: Haptics and Empathic Computing
PDF
Assigned Numbers - 2025 - Bluetooth® Document
PDF
Peak of Data & AI Encore- AI for Metadata and Smarter Workflows
PPTX
20250228 LYD VKU AI Blended-Learning.pptx
PDF
Optimiser vos workloads AI/ML sur Amazon EC2 et AWS Graviton
PPTX
KOM of Painting work and Equipment Insulation REV00 update 25-dec.pptx
PDF
Per capita expenditure prediction using model stacking based on satellite ima...
PDF
The Rise and Fall of 3GPP – Time for a Sabbatical?
PDF
Review of recent advances in non-invasive hemoglobin estimation
PPTX
Programs and apps: productivity, graphics, security and other tools
7 ChatGPT Prompts to Help You Define Your Ideal Customer Profile.pdf
VMware vSphere Foundation How to Sell Presentation-Ver1.4-2-14-2024.pptx
Empathic Computing: Creating Shared Understanding
The AUB Centre for AI in Media Proposal.docx
Advanced methodologies resolving dimensionality complications for autism neur...
MIND Revenue Release Quarter 2 2025 Press Release
Cloud computing and distributed systems.
sap open course for s4hana steps from ECC to s4
A Presentation on Artificial Intelligence
Network Security Unit 5.pdf for BCA BBA.
Reach Out and Touch Someone: Haptics and Empathic Computing
Assigned Numbers - 2025 - Bluetooth® Document
Peak of Data & AI Encore- AI for Metadata and Smarter Workflows
20250228 LYD VKU AI Blended-Learning.pptx
Optimiser vos workloads AI/ML sur Amazon EC2 et AWS Graviton
KOM of Painting work and Equipment Insulation REV00 update 25-dec.pptx
Per capita expenditure prediction using model stacking based on satellite ima...
The Rise and Fall of 3GPP – Time for a Sabbatical?
Review of recent advances in non-invasive hemoglobin estimation
Programs and apps: productivity, graphics, security and other tools

Week 4 - A Visual Contrasts