Chapter 3: Users Physical Capabilities
🎯 Learning Objectives
By the end of this study session, you’ll be able to:
- Explain the fundamental principle that drives all good interface design: understanding human capabilities and limitations
- Describe how the human visual system works and identify its key limitations (peripheral vision, color blindness, processing quirks)
- Apply knowledge of visual limitations to make better design decisions (avoid all-caps text, consider color-blind users, understand context effects)
- Understand human hearing capabilities and know when sound is helpful vs. distracting in interfaces
- Recognize the importance of haptic feedback and how touch enhances user experience, especially for accessibility
- Calculate and apply Fitts’ Law to predict movement times and optimize interface layouts
- Identify optimal target placement using concepts like infinite edge width and corner advantages
- Understand human reaction times and design systems that feel responsive (0.1s, 1s, 10s thresholds)
- Recognize how our senses interact and sometimes fool us (like the McGurk effect)
- Design interfaces that work within human physical constraints rather than fighting against them
🌟 The Big Picture
Here’s the golden rule that underlies everything in this chapter: “To design something for someone, we need to understand the CAPABILITIES and LIMITATIONS of that person.”
Think about it this way - you wouldn’t design a car without understanding how humans sit, reach, and see. Similarly, you can’t design effective computer interfaces without understanding how humans process visual information, hear sounds, feel textures, and move their bodies.
This isn’t just academic theory - it’s practical knowledge that directly impacts whether your users will love or hate what you create. Every design decision you make either works with human nature or fights against it. This chapter gives you the toolkit to consistently choose the “work with” option.
📚 Core Concepts
The Foundation: Why Human Limitations Matter
Human beings are incredible information processors, but we’re not computers. We have specific strengths and very real limitations. The key insight is that humans are limited in their capacity to process information, and this has massive implications for design.
Instead of seeing these limitations as problems to overcome, think of them as design constraints that actually make your job easier. When you know exactly what humans can and can’t do well, you can design experiences that feel effortless and natural.
We interact with computers through four main physical channels:
- Visual channel (our eyes and visual processing)
- Auditory channel (our ears and sound processing)
- Haptic channel (our sense of touch and physical feedback)
- Movement (how we physically interact and respond)
Let’s dive into each one.
The Visual Channel: How We See (And How We Don’t)
The Basics of Human Vision
Your visual system is amazing, but it has some quirky limitations that directly impact interface design.
Visual Reference (Slide 4): The eye works like a camera - light reflects off objects, passes through the cornea and lens, and gets focused upside-down on the retina. Your brain then flips this image right-side-up for you.
The Retina: Cones vs. Rods
Here’s where it gets interesting for designers:
Visual Reference (Slide 5):
Eye (top view)
┌─────────────────┐
│ Rods ────► │ (sides - detect motion, no color)
│ │ │
│ Cones ────► │ (center - detect color, details)
│ │ │
│ Rods ────► │ (sides - detect motion, no color)
└─────────────────┘
Cones are concentrated at the front/center of your retina and are great at detecting color and fine details. Rods are at the sides and are amazing at detecting movement but terrible with color.
What this means for design:
- Color detection works best when images are placed directly in front of the eye
- Your peripheral vision can’t see color well but is fantastic at noticing movement
- If you need to grab attention with something in a sidebar, use motion rather than just color changes
Peripheral Vision: Motion Detector, Not Detail Reader
Your peripheral vision is like having motion sensors around the edges of your vision. It’s evolutionary - you needed to quickly spot potential threats (like predators) moving at the edges of your sight.
Visual Reference (Slide 6): The diagram shows how peripheral vision covers about 180° horizontally but has very poor detail and color sensitivity.
Design implications:
- Elements outside central vision don’t need detailed color schemes
- If you need urgent updates in sidebars, use subtle motion instead of color changes
- Warning: Peripheral animation is extremely distracting! Avoid things like sidebars that constantly zoom in and out - they’ll drive users crazy
The “Seeing is Believing” Myth
Spoiler alert: Your eyes lie to you constantly, and understanding this makes you a better designer.
Visual Reference (Slide 9 - Motion-Induced Blindness): This shows a pattern of blue X’s with yellow dots. When the X’s move, the yellow dots seem to disappear even though they’re still there. Your brain is so focused on the moving pattern that it literally stops seeing the stationary objects.
Visual Reference (Slide 10 - Color Illusions): The optical illusion images show how context completely changes what you perceive. The same color can appear different depending on what surrounds it.
What this teaches us:
- Context is everything in visual design
- Moving elements can make users “blind” to important stationary information
- The same color can look completely different depending on its background
Color Blindness: A Reality Check
Here’s a sobering fact: 8% of males and 1% of females are color blind, with red-green being the most common type. A small percentage of people have no color vision at all.
For designers, this means:
- Never rely on color alone to convey important information
- Always provide alternative cues (text labels, icons, patterns)
- Test your designs with color blindness simulators
- This isn’t optional - it’s about making your interface usable for everyone
Context and Visual Processing
Your brain is constantly trying to make sense of what you see, and it uses context clues to resolve ambiguity.
Visual Reference (Slide 12-13): The classic example shows “A13C” and “12B14” where the middle character looks identical but your brain reads it as “B” in the first string and “13” in the second, purely based on context.
This demonstrates that context is used to resolve ambiguity - a crucial principle for interface design.
Size, Depth, and Visual Tricks
Your brain uses several cues to judge size and depth:
Visual Reference (Slide 14): The painting example shows how overlapping objects help create depth perception. Objects that overlap others appear closer and larger.
The law of size constancy means familiar objects are perceived as constant size regardless of distance. This is why a person in the background of a photo doesn’t look tiny to you - your brain automatically adjusts.
Sometimes this system gets “overcompensated” and creates optical illusions:
Visual Reference (Slide 15):
- The Ponzo illusion: Two identical rectangles on converging lines, where the top one appears larger
- The Müller-Lyer illusion: Two identical lines with different arrow endings, where one appears longer
Reading: Why ALL CAPS Is Terrible
Reading happens in stages:
- Visual pattern perceived (you see the shapes)
- Decoded using internal language representation (you recognize letters/words)
- Interpreted using syntax knowledge (you understand meaning)
Here’s the key insight: words can be recognized as quickly as single characters when you can see their shape. Familiar words are recognized by their overall silhouette.
Visual Reference (Slide 17): The scrambled sentence “The qcuik borwn fox jmup oevr the lzay dog” is still readable because the overall word shapes are preserved.
Visual Reference (Slide 18):
SHAPE SHAPE SHAPE SHAPE SHAPE
SHAPE SHAPE SHAPE SHAPE SHAPE ← All caps = no shape variety
SHAPE SHAPE Shape SHAPE SHAPE
SHAPE SHAPE SHAPE SHAPE SHAPE
SHAPE SHAPE SHAPE SHAPE SHAPE
Why ALL CAPS kills readability:
- Removes word shape clues that help recognition
- Forces readers to process letter by letter instead of word by word
- Significantly slows reading speed and accuracy
- Makes text look like shouting (which it basically is to your visual system)
The Auditory Channel: Strategic Sound Design
Human Hearing Capabilities
Humans can hear frequencies from 20Hz to 15kHz, but this range gets smaller as you age and varies with health conditions. Your hearing isn’t just passive - it’s an active filtering system.
The Cocktail Party Phenomenon
Ever notice how you can focus on one conversation in a noisy restaurant? That’s your auditory system’s superpower - you can attend to sounds over background noise. Your brain actively filters and focuses audio input.
When to Use Sound in Interfaces
Sound serves three main purposes in design:
- LOCATE things (spatial audio cues)
- Provide FEEDBACK (confirmation sounds)
- Attract ATTENTION (alerts and notifications)
Examples:
- ATM: Beeps confirm button presses
- Telephone: Ringtones grab attention
- Washing machine: Completion chimes provide feedback
- Air conditioner: Running sounds indicate status
Strategic Sound Usage Guidelines
Use sound for feedback and attention when:
- The information is short and simple
- For alerts and warnings requiring immediate response
- The visual system is already overburdened
- The user is moving around (mobile contexts)
- Poor illumination makes vision unreliable
The big caveat: Sound can be incredibly annoying and distracting. Use it thoughtfully, not constantly.
The Haptic Channel: The Power of Touch
Touch provides crucial environmental feedback and can be the primary sense for visually impaired users. Different body areas have varying sensitivity levels - your fingers are incredibly sensitive compared to your back.
Key principle: Keyboard design should provide adequate tactile feedback. The physical “click” sensation helps users know they’ve successfully pressed a key.
Visual Reference (Slide 23 - Tactile Watch): This shows an innovative watch designed for blind users with:
- Raised hour marks for easy touch reading
- Side ball bearing indicating hours
- Front ball bearing indicating minutes
- Textured major marks to distinguish from minor marks
This demonstrates how thoughtful haptic design can create entirely new interaction possibilities.
Design implications:
- Touch feedback affects both comfort and performance
- Consider tactile elements for accessibility
- Physical feedback can replace or supplement visual/audio cues
Movement: The Science of Human Response
Understanding how humans move and respond is crucial for creating interfaces that feel responsive and natural.
Response Time Components
When you see something and need to respond to it, your total response time includes:
- Reaction time (detect → process → initiate response)
- Movement time (physical motion to complete the action)
Reaction time varies by stimulus type:
- Visual stimuli: ~200ms
- Auditory stimuli: ~150ms (faster!)
Movement time depends on age, fitness, and the specific movement required.
System Response Time Thresholds (Nielsen’s Law)
These are the magic numbers every designer should memorize:
- 0.1 seconds: Feels like the system is reacting immediately
- 1 second: User notices delay but still feels in control
- 10 seconds: Limit for keeping user attention; beyond this, they feel the computer is slow
Design implication: Always aim for sub-0.1s for immediate actions, and provide feedback for anything longer than 1 second.
Fitts’ Law: Predicting Movement Time
This is one of the most practical laws in interface design. Fitts’ Law predicts how long it takes to move to and select a target:
Visual Reference (Slide 26):
T = a + b log₂(2D/W)
Where:
T = Movement time
D = Distance to target
W = Width of target
a, b = Device-specific constants
What this formula tells us:
- Closer targets are faster to reach
- Bigger targets are faster to hit
- The relationship isn’t linear - it’s logarithmic
Visual Reference (Slide 27 - Fitts’ Paradigm): The original experiment had people tap between two targets as quickly as possible, varying the distance between targets and target width.
Practical Applications of Fitts’ Law
Visual Reference (Slide 28): Compare these menu types:
- Wheel menu: All options equidistant from center
- List menu: Varying distances, with top items closer
Visual Reference (Slide 29-30 - Infinite Width Concept):
┌─────────────────────────────────┐ ← ∞ width
│ │
│ │ ← ∞ width
│ Content │
│ │ ← ∞ width
│ │
└─────────────────────────────────┘ ← ∞ width
The “infinite width” principle: Screen edges and corners can be considered to have infinite width because you can’t overshoot them. This makes them incredibly easy targets.
Design applications:
- Put frequently used items in corners (easiest to hit)
- Use screen edges for important controls (like taskbars)
- Make buttons bigger rather than just closer
- Consider the path users will take between interface elements
When Senses Interact: The McGurk Effect
Visual Reference (Slide 32): The McGurk effect demonstrates how visual and audio information combine in your brain. When you see someone’s lips making one sound but hear a different sound, your brain creates a third perception that’s neither what you saw nor what you heard.
What this teaches designers:
- Your senses don’t work in isolation
- Visual cues can completely change what users think they heard
- Consistency across sensory channels is crucial
- Mismatched audio-visual cues create confusion
🔄 Connections and Review
Let’s tie this all together with the big picture. Every single concept in this chapter supports one central theme: designing with human limitations in mind creates better experiences for everyone.
The Visual System teaches us to:
- Work with peripheral vision’s strengths (motion detection) and limitations (no color)
- Never rely on color alone
- Understand that context shapes perception
- Preserve word shapes for readability
The Auditory System reminds us that:
- Sound is powerful for feedback and attention
- Less is often more with audio
- Consider when users can’t rely on vision
The Haptic System shows us:
- Touch provides crucial feedback
- Physical sensations can enhance or replace other senses
- Accessibility requires multi-sensory thinking
Movement and Response gives us concrete tools:
- Fitts’ Law for optimizing layouts
- Response time thresholds for system design
- The power of edges and corners
Sensory Interaction warns us that:
- Senses influence each other
- Consistency prevents confusion
- Mismatched cues break the user experience
The ultimate takeaway? Don’t fight human nature - design with it. When you understand these physical capabilities and limitations, you can create interfaces that feel natural, accessible, and delightful to use. Your users might not consciously notice good human-centered design, but they’ll definitely feel the difference.