Selective Attention

In every customer journey, hundreds of stimuli compete for attention—texts, images, buttons, notifications. The intuitive assumption is that people perceive what appears on the screen. Yet customers overlook important information, click the wrong buttons, and fail to notice errors. The question is: What determines which information is consciously perceived and which is ignored—and what evidence exists about this?

Studies

The Invisible Gorilla

Daniel Simons and Christopher Chabris conducted the most famous experiment on selective attention at Harvard University in 1999. A total of 192 participants watched a 75-second video in which two teams—one wearing white shirts, the other wearing black shirts—passed basketballs to each other. Their task was to count the passes made by the white team. After 44 seconds, a person in a gorilla costume walked through the frame, stopped in the middle, beat their chest, and exited—visible for a full 9 seconds. The astonishing result: 46% of viewers did not notice the gorilla. They were so focused on counting that a black gorilla in the center of the frame remained completely invisible to them. When shown the video a second time, they were shocked.

Door Study

Daniel Simons and Daniel Levin conducted a field experiment in 1998 on the Cornell University campus. An experimenter approached passersby and asked for directions. During the conversation, two workers carried a large door between them, interrupting visual contact for about one second. At that moment, another experimenter switched places with the first: different face, different clothing, different voice, but approximately the same height. Of 15 passersby, only 7 noticed the switch—53% simply continued talking to the new person as if nothing had happened. The astonishing finding: even fundamental changes like a completely different conversation partner can go unnoticed when attention is focused on a task.

Rubin's Vase – The First Figure-Ground Experiment

Edgar Rubin conducted groundbreaking experiments on visual perception at the University of Copenhagen in 1915. He presented test subjects with ambiguous images—most famously the Rubin Vase, in which a white vase on a black background simultaneously resembles two black facial profiles. The remarkable finding: subjects could NEVER perceive both interpretations at once. They saw either the vase (white as figure) or the faces (black as figure). Rubin documented that what is perceived as figure appears closer, contoured, and meaningful, while what is categorized as ground appears formless, more distant, and is not processed for content. This separation is binary and automatic—the brain cannot do otherwise.

Object-based attention

Robert Egly and Jon Driver conducted a series of reaction time experiments at the University of California in 1994. Forty-eight participants viewed two rectangles on a screen. A brief flash of light (cue) appeared at one end of a rectangle, followed by a target stimulus. The target could appear at the same location as the cue, at the other end of the same rectangle, or in the other rectangle. The surprising result: reaction times were faster when the target appeared within the same object (rectangle), even when spatial distance was equal. A target 10cm away within the same rectangle was detected 25 milliseconds faster than a target 10cm away in a different rectangle. The implication: attention follows not only spatial locations but also objects. What is grouped as a cohesive figure is processed as a unit.

The Rubin Vase

Edgar Rubin created the most famous demonstration of figure-ground ambiguity in his 1915 dissertation at the University of Copenhagen. He presented test subjects with a silhouette: when viewed as black against a white background, it appeared as a vase; when the white was perceived as the figure, two faces in profile emerged. Subjects reported spontaneously flipping between both perceptions—they could not perceive both interpretations simultaneously. The remarkable aspect: the identical physical contours produced completely different perceptions, depending on which element was interpreted as the figure. Rubin identified factors such as closure, convexity, and smaller area as predictors of figure perception.

Influence of Meaning on Figure-Ground Segregation

Mary Peterson conducted a series of experiments at the University of Arizona in 1994 demonstrating that not only form but also meaning influences figure-ground perception. She presented 48 students with ambiguous black-and-white images for just 200 milliseconds—too brief for conscious interpretation. Some contours formed recognizable objects on one side (e.g., a woman's silhouette) while showing only abstract shapes on the other. In 67% of cases, participants spontaneously perceived the meaningful side as the figure, even though formal factors such as size were balanced. The surprising finding: semantic knowledge influences basic perceptual organization in just 200ms—a top-down effect on what was presumed to be a purely bottom-up process.

The Invisible Gorilla in the Lung

In 2013, Trafton Drew, Melissa Võ, and Jeremy Wolfe at Brigham and Women's Hospital tested whether even experts are susceptible to inattentional blindness. Twenty-four radiologists examined CT scans of lungs for cancerous nodules—their everyday, highly trained task. In the final scan, the researchers inserted an image of a gorilla, 48 times larger than a typical cancerous nodule and displayed in a color contrast impossible for actual lung tissue. Eye-tracking data confirmed that the radiologists looked directly at the gorilla. Nevertheless, 83% of them completely missed this obviously anomalous object. When it was pointed out to them, they were stunned—the gorilla occupied a significant portion of the image. Their concentration on the primary task (finding cancerous nodules) had completely suppressed their perception of the unexpected.

Principle

Which principle for Customer Experience Design can be derived from this? The principle of selective attention demonstrates that successful customer experience design must strategically direct users' limited attention rather than assume all provided information will be perceived. Since people can only consciously process a small fraction of available information, the most important messages, features, and calls-to-action must align with users' current goals and expectations. This becomes particularly critical in complex digital environments, where information overload quickly leads to overwhelm and abandonment—whereas in simple, focused contexts, natural attention filtering can actually be beneficial. The following guidelines show how to implement this principle in practice.

Guidelines

One dominant action per screen

Define exactly one primary task per interface and design all other elements to be visually subordinate. Users automatically filter information based on their current intention. Multiple equivalent calls-to-action don't increase conversions—they cause users to overlook the relevant option. Establish an unambiguous hierarchy through size, contrast, position, and whitespace.

Place critical items in the task focus

Critical information such as errors, costs, or limitations should never be relegated to side notes. This information must appear where users' attention is already focused—in the immediate context of their current interaction. A notice tucked away in a sidebar will go unnoticed when users are focused on a button. Instead, use inline validation, cursor-triggered tooltips, and modal confirmations for critical decisions.

Progressive Disclosure over Completeness

Display only information relevant to the current task. Provide additional details on demand. Users miss important information in lengthy text because their attention is focused on the core task. Structure content in steps: first, enable the decision; then provide details for interested users. For example, present product selection without technical specifications, which appear on click when needed.

Movement and contrast only for important things

Motion and high contrast penetrate selective attention—reserve them exclusively for genuinely important information. Animated banners, flashing badges, and pop-ups condition users to ignore these stimuli (banner blindness). Apply motion sparingly: for error messages, time-sensitive offers, and feedback on user actions. Static elements attract attention through position and size, not animation.

Contrast for critical actions

Use maximum color contrast for the single action you want users to take. The primary call-to-action (CTA) must stand out from everything else—not just slightly brighter, but in a completely different color family. For example, if your page is blue, make the CTA orange or red. Test this with the grayscale method: convert the page to grayscale and check whether the CTA still stands out. Limit yourself to one high-contrast button per viewport.

Using white space as a figure enhancer

Surround important information with generous white space. The Gestalt law of closure ensures that bordered or free-standing elements are perceived as independent figures. A product image with ample white space around it is recognized as a distinct figure. The same image embedded in dense text disappears into the background. Use at least 50% more spacing around important elements than you use between unimportant elements themselves.

Preventing unwanted groupings

Ensure that important elements don't accidentally merge with unimportant ones and fade into the background. For example, a red sale badge placed directly beside red body text will be perceived as part of the text (ground). The same badge, when positioned at a distance from the text, will be recognized as a distinct figure. Visually assess your design: Which elements might be unintentionally perceived as a single unit due to proximity, similar color, or shape?

Visual layers for information hierarchy

Use shadows, borders, and overlaps to establish distinct information hierarchies. The brain automatically interprets elements that appear "closer"—through shadows or overlap—as figure. For example, a modal dialog overlaying the main content is immediately recognized as the primary figure, while content cards with subtle shadows stand out from the background. Critical consideration: Not everything can be figure. Define a maximum of three levels: primary figure (main action), secondary figures (important content), and ground (context).

Establish a clear visual hierarchy

Use strong contrasts in size, color, and white space to distinguish figure (action-relevant elements) from background (context). Avoid mixing hierarchy levels by giving them similar visual weight. A call-to-action button should never carry the same visual prominence as footnote text. In functional interfaces, clarity takes precedence over aesthetic complexity.

White space as a segregation signal

White space is not wasted space but an active design element. It signals to the visual system that one group ends here and a new one begins there. Surround important elements with sufficient white space so they are perceived as independent figures. Reduce spacing within related groups. The law of proximity states that what is spatially close belongs together and is perceived as one figure.

Targeted Ambiguity for Engagement

In marketing contexts, controlled figure-ground ambiguity can capture attention and generate engagement. A logo or key visual that permits multiple interpretations is viewed longer and remembered more effectively. This effect works because the brain actively attempts to resolve the ambiguity. Important caveat: This technique only works for non-functional elements. Navigation and forms must never be ambiguous.

Design background with minimal meaning

What is meant to serve as background must recede both visually and semantically. Avoid complex patterns, high-contrast textures, or meaningful symbols in the background, as these compete with the figure for attention and create ambiguity. A solid-colored or subtly textured background supports figure-ground separation. Product photos on white backgrounds work precisely for this reason: they offer zero competition and maximum clarity.

Integrate critical information into task flow

Place important information within the focus of attention, not beside it. When users fill out a form, display hints directly at the relevant field rather than in a sidebar. During checkout, integrate security notices into the process itself rather than presenting them in a separate box. The optimal position is where the user's gaze naturally falls.

Using Interruptions for Critical Matters

Use Interruptions for Critical Matters Only For truly critical information—security warnings, irreversible actions, legal notices—use deliberate interruptions. A modal that pauses the process can break through inattentional blindness. However, use this approach sparingly. Too many interruptions lead to banner blindness. Reserve this technique for moments when overlooking information would cause genuine harm.

Redundancy for important messages

Communicate critical information repeatedly across multiple touchpoints. A single notice—regardless of its visibility—is frequently missed when users are concentrating on a task. Display the same message before the action, during the action, and in the post-action confirmation. Leverage different sensory channels: visual cues combined with micro-interactions, color changes, or intentional brief delays.

Progressive Disclosure over Completeness

Display only what's necessary for the immediate next step, rather than presenting everything simultaneously. Divide lengthy forms into multiple brief stages. Conceal advanced options behind a "Show more" link. Each additional piece of information on screen increases cognitive load, even when optional. The guiding principle: multiple simple steps are preferable to a single complex one.

Lead explicitly rather than implicitly

Don't rely on customers to 'just find' important elements. Guide explicitly: arrows, text like 'Click here for...', onboarding overlays. What isn't actively shown will be overlooked. The following examples illustrate this guideline:

• Slack: New features are introduced with tooltips: An arrow points to the element, a brief text explains it. Attention is actively guided, not left to chance.
• Duolingo: Every step in the onboarding is a screen with one action. Visual focus (large buttons, subtle background), verbal focus ('Tap Get Started'). Impossible to miss anything.

Breaking patterns for what matters

Inattentional blindness particularly affects the expected. When important information is embedded within a familiar layout, it often goes unnoticed. For truly critical information: break the pattern. Use a different color, an unexpected position, movement, or a pop-up. The unexpected captures attention. The following examples illustrate this guideline:

• Stripe: Error messages are red and appear above the form – not in the gray sidebar where informational text is located. The pattern is broken, attention is guaranteed.
• Banking-Apps: Unusual transactions are highlighted with a red banner – not just hidden in the list. The pattern interruption signals: 'This is different, take a closer look.'

Offer curated selection

Limit choices to 3-5 carefully curated recommendations rather than displaying endless catalogs, and set the most appropriate option as the default selection. Each page should feature only one primary action—place advanced options behind a 'Show more' link. Reducing the number of decisions decreases cognitive load and increases conversion rates. The following examples illustrate this guideline:

• Netflix: 'Top 10 in Germany' – a curated list within the vast catalog. The pre-selection makes the decision easier for indecisive viewers.
• Amazon: 'Amazon's Choice' – a label that highlights one product per category. The customer no longer has to compare all 500 options.