Sensory Shift Slides SENSORY SHIFT
From Raw Data to Meaningful Reality
Lesson 1: Sensation vs. Perception
The Visual Switch
Hook
Look closely...
Can you see the Vase?
Can you see the Two Faces?
Try to switch between them as fast as possible. What is changing? The light hitting your eye, or the way your brain is organizing it?
Sensation
The Input
The physical process of collecting raw data from the environment through our five senses.
The Biology
Light waves, sound vibrations, or chemical molecules hitting our receptors.
Think of it like:
Pixels on a screen
(Just dots of light, no meaning yet)
Perception
Think of it like:
The Movie on the screen
(The story your brain tells with the pixels)
The Interpretation
The mental process of organizing and interpreting raw sensory data into something meaningful.
The Filter
Influenced by our experiences, expectations, and context.
How do we process?
Bottom-Up
Starting with the raw details and building up to a complete picture.
Data-driven
New experiences
"What is this?"
Top-Down
Using past experience and expectations to interpret data.
Concept-driven
Familiar situations
"I know what this is!"
Lab Station Prep
We are about to rotate through three "Sensory Stations." Your goal is to identify when your brain is doing the work vs. when your eyes are just recording light.
"The whole is something else than the sum of its parts." — Kurt Koffka
Sensory Shift Lab Report PERCEPTION LAB REPORT
Experiment 01: Sensory Shift
Name:
Date:
Objective
To distinguish between raw sensory input (sensation) and the mental interpretation of that data (perception) through a series of ambiguous visual stimuli.
1
The Rubin Vase
Attempt to switch your focus between the Vase and the Two Faces as quickly as possible. Record your experience below.
Observation A: Faces
What specific physical details do you see when focused on the faces?
Observation B: Vase
What specific physical details do you see when focused on the vase?
Synthesis Question:
Did the image itself change while you were looking at it? Explain how this proves the difference between sensation and perception.
2
Ambiguous Figures
Observe the image provided by your instructor (e.g., Young Girl/Old Woman). Without talking to neighbors, write down what you saw first.
Initial Perception:
Once your classmates describe the other image, try to "find" it. What mental shift was required to see the other version?
Analysis: Processing Models
Scenario 1: Reading a messy note
You are handed a handwritten note where some letters are smudged. You can still read it because you expect certain words based on the context of the sentence.
This is:
Bottom-Up
Top-Down
Scenario 2: Hearing a new song
You listen to a song in a foreign language you don't speak. You notice the pitch, the rhythm, and the volume of the singer's voice, but the words have no meaning to you.
This is:
Bottom-Up
Top-Down
Lab Conclusion
In your own words, summarize why "The whole is something else than the sum of its parts" (Gestalt theory) is true based on today's lab.
Figure Ground Slides HIDDEN IN SIGHT
The Art of Figure-Ground Relationships
Lesson 2: Figure vs. Ground
Survival Logic
Hook
Imagine an image of an owl perfectly blended against tree bark.
Can you see it?
When camouflage works, the Figure (the animal) becomes indistinguishable from the Ground (the environment).
Why does our brain try so hard to separate them?
Evolutionary answer: To avoid being eaten or to find food.
The Fundamentals
Figure
The part of the visual field that has meaning. It is usually smaller, more detailed, and appears to be "in front."
Ground
The background. It is usually larger, less distinct, and appears to continue behind the figure.
Figure (Circle) vs. Ground (Square)
What helps us separate?
Contrast
Difference in color or brightness makes the figure "pop."
Sharpness
Clear edges define figures; blurry edges feel like backgrounds.
Size/Surround
Small objects surrounded by larger areas are naturally seen as figures.
WORKSHOP TIME
You will be given a series of abstract patterns. Your task is to manipulate your focus to "force" different parts of the image into the foreground.
1
Identify the Intended Figure
2
Identify the Ground
3
Attempt the Flip
Hidden Figures Workshop Activity HIDDEN FIGURES
Workshop: Figure-Ground Dynamics
SUBJECT:PSYCH-02
STUDENT:_________
DATE:_________
01
The Primary Split
Initial Observation
When you first look at this image, what is the Figure and what is the Ground ?
Write here...
The Variables
Which variable is most responsible for this organization?
Contrast
Size
Complexity
02
Camouflage Breakdown
In many animal species, the figure (the animal) mimics the texture and color of the ground (the background).
Survival Analysis:
How does "breaking the figure-ground relationship" help a predator hunt?
Visual Strategy:
If you were a bird looking for a moth hidden on a tree, what visual cues would you search for to "find" the figure?
03
The Reversal Experiment
Mastering the Switch
Focus your eyes on the white areas above. Force them to become the "Figure." Then, switch back to the black areas.
Describe the physical sensation in your eyes or brain when the image "flipped":
Summary Conclusion
Why is Figure-Ground considered the most fundamental rule of perception? Could you perceive anything without it?
Grouping Laws Slides THE POWER OF PROXIMITY
Grouping Laws: Proximity & Similarity
Lesson 3: Laws of Grouping
Rapid Fire!
Hook
How many groups do you see?
You didn't count them. Your brain just grouped them instantly.
01. Proximity
The Rule
Objects that are close together are perceived as a group.
Why?
The brain assumes physical closeness implies a shared relationship or category.
Three columns? Or six single lines?
02. Similarity
Do you see rows? Or columns of circles vs. squares?
The Rule
Objects that look alike are perceived as a group.
Visual Cues
Similarity can be based on color, shape, size, or orientation .
The Battle of the Laws
What happens when Proximity and Similarity clash?
Does your brain prioritize distance or appearance?
Activity Task:
Open your Pattern Predictor worksheets.
You will analyze 10 visual arrays and predict how a "typical" brain will group them.
Prediction is a key skill in UX (User Experience) Design!
Pattern Predictor Activity PATTERN PREDICTOR
Visual Grouping Workshop
NAME:
DATE:
Challenge 01: Proximity
1. How many columns do you perceive instantly?
2. Explain why your brain groups these as columns rather than 18 individual dots.
Challenge 02: Similarity
1. Do you perceive vertical columns or horizontal rows?
2. Which "Rule" is stronger here: Proximity or Similarity? Why?
Challenge 03: UX Application
Designers use these laws to help users find information. Imagine a website with "Add to Cart" buttons. If every button is a bright orange circle, which law are they using to help you find them?
Scenario: Phone Apps
When you group your apps into a folder, the phone draws a small square around them. Why is this necessary? Which Gestalt law does it reinforce?
Scenario: Bulleted Lists
Why is a list with extra spacing between items easier to read than a giant block of text?
Pattern Conclusion
Predict what would happen if a designer put two unrelated buttons (e.g., "Delete Account" and "Order Pizza") right next to each other with identical styling. Use terms like misperception and Gestalt laws .
Mind the Gap Slides MIND THE GAP
Closure & Continuity
Lesson 4: Completing the Picture
What is missing?
Hook
The WWF Panda
There are no lines connecting the top of the panda's head or back. Yet, you see a solid animal.
Why?
Your brain hates incomplete information. It "closes" the gaps to create a whole object.
01. Closure
The Rule
The brain tends to fill in gaps to perceive complete forms even when they are partially hidden or missing.
"The eye sees what the mind expects."
Do you see a white triangle?
02. Continuity
Do you see two intersecting lines? Or four segments meeting in the middle?
The Rule
The eye follows the smoothest path. Once it starts looking in a direction, it continues until it sees something else.
Logo Logic:
Designers use continuity to lead your eyes exactly where they want you to look.
LOGO LOGIC
How do multi-billion dollar companies exploit your brain's laziness? We are going to deconstruct 5 famous logos to find out.
IBM
AMAZON
UNILEVER
Logo Logic Worksheet LOGO LOGIC
Case Study: Closure & Continuity
NAME
DATE
"Design is not just what it looks like and feels like. Design is how it works." In this activity, we deconstruct how marketing firms use Gestalt principles to create memorable identities.
Mockup: Horizontal Strips
Case 01: The IBM "8-Bar" Logo
The IBM logo is made of eight horizontal stripes. There are no solid letters "I," "B," or "M."
Psychological Principle:
Closure
Continuity
Analysis:
How does your brain "create" the letters? Why is this more memorable than a solid font?
Mockup: The Arrow
Case 02: The Amazon "Smile"
The orange arrow starts at 'a' and points to 'z'.
Psychological Principle:
Closure
Continuity
Analysis:
How does the arrow guide the movement of your eye? What message is this pathway sending?
The "Missing Piece" Challenge
Imagine you are designing a logo for a new brand called O R B I T. Use the principle of Closure to suggest the shape of a planet without drawing a full circle.
Sketch Here
Explain your design:
Which specific parts did you leave out? How will the viewer's brain fill them in?
Master Design Slides DESIGN DOCTOR
Synthesizing the Gestalt Principles
Lesson 5: Final Synthesis
The "Bad Design" Hunt
Hook
Why is this layout confusing?
When Laws Clash
Confusion happens when Gestalt Laws work against each other. For example:
Similarity vs. Proximity: Items look the same but are far apart.
Poor Figure-Ground: Text blends into a busy background image.
Broken Continuity: A button points to a different section of the page.
Your Toolkit
Figure-Ground
Separating subject from background.
Proximity
Grouping based on distance.
Similarity
Grouping based on appearance.
Closure
Filling in missing gaps.
"Good design is invisible. Bad design is all you can see."
The Mission
1
Pick an Artifact
Find a website, a game UI, or a social media layout.
2
Diagnose the Rules
Identify at least 3 Gestalt principles being used to guide the user's eye.
3
Prescribe a Fix
Propose one change that would improve the visual organization.
Assessment Criteria:
Correct use of terminology
Specific evidence from artifact
Logical "prescription" for fix
Ready, Doctors?
The world is messy. It's your job to explain how the brain makes it clean.
Start Analysis
Design Doctor Activity Sheet DESIGN DOCTOR
Final Perceptual Analysis Report
CASE NO:_________
ANALYST:_________
STATUS:OPEN
1
Artifact Identification
Selected Item:
(e.g., Spotify Playlist UI, Nike Home Page, Minecraft Inventory Screen)
Intended Audience:
Attach Screenshot or Sketch of Artifact Here
2
Perceptual Diagnosis
Identify three Gestalt principles at work in your artifact. Explain how they help the brain organize the information.
Principle 01
Evidence & Analysis
Where exactly is this law used? How does it guide the user?
Principle 02
Evidence & Analysis
Explain the visual impact...
Principle 03
Evidence & Analysis
Explain the visual impact...
3
Medical Prescription (The Fix)
Evaluation:
Is there a "Perceptual Conflict" in this design? Is anything confusing or poorly grouped? If so, what? If the design is perfect, explain one thing that could go wrong if a Gestalt rule was removed.
Final Prescription:
Propose one specific change to improve the "Perceptual Flow" of this artifact.
Gestalt Master Key & Rubric Teacher Toolkit: Master Keys
Architects of Perception Unit
Lesson 1: Sensation vs. Perception
Processing Model Scenarios:
Reading messy notes:
Answer: Top-Down. The brain uses context (previous knowledge) to fill in the smudges.
Hearing a foreign song:
Answer: Bottom-Up. The brain only perceives raw sensory data (pitch/rhythm) because it lacks the "Top" (language meaning).
Lesson 3: Proximity vs. Similarity
Challenge 02 Clash:
In the "Challenge 02" grid, Similarity (Color) often wins over Proximity if the colors are distinct enough. Students should observe that they see columns of blue and black dots rather than rows of alternating colors.
UX Application:
App Folders: Proximity (closeness) plus Common Region (the box). By putting apps together and boxing them, the brain perceives them as a single functional "group."
Design Doctor: Project Rubric
Category Mastery (4) Proficient (3) Developing (2-1) Terminology Identifies 3+ Gestalt laws correctly and defines them accurately in context. Identifies 3 laws, but definitions may be slightly vague or textbook-heavy. Identifies fewer than 3 laws or misidentifies the laws present. Evidence Uses specific visual markers from the artifact (e.g., "the 5px gap between the logo and header"). General references to the layout (e.g., "the buttons are near each other"). Fails to connect principles to the specific artifact selected. Prescription Proposes a fix that specifically utilizes a Gestalt principle to solve a friction point. Proposes a fix that improves look/feel but doesn't explain the psychological shift. No clear fix proposed or fix ignores Gestalt logic.
Grading Note:
The goal is for students to see "Gestalt" not as a list of definitions, but as a lens through which they view all visual communication. High marks should go to students who can explain *why* the designer made those choices, even if the designer didn't know the formal Gestalt names.
