Cognitive Psychology for UX: Attention
How Attention Shapes Digital Experiences
In a world buzzing with notifications, endless scrolling, and multitasking, have you ever wondered why some apps feel effortless while others leave you overwhelmed? The answer lies in attention—a cornerstone of cognitive psychology that dictates how we interact with technology. Whether you’re reading this blog, navigating an email app, or mastering a new ERP software at work, the way a product guides (or hijacks) your attention shapes your entire experience. Let’s explore how attention works, why multitasking is a myth, and how UX designers can craft intuitive, frustration-free products.
How Attention Works: Active vs. Passive
Attention is our brain’s gatekeeper, it decides what to focus on and what to ignore. To design effectively, we must understand its two core modes:
Active Attention (Top-Down)
Controlled and intentional. Think of checking emails: you deliberately focus on reading and replying.Passive Attention (Bottom-Up)
Instinctive and reactive. Imagine a flashy pop-up interrupting your workflow—your attention is hijacked before you even realize it.
These modes intersect with two key types of focus:
Focused Attention: Also called selective attention, is like a spotlight. It allows us to concentrate deeply on one thing while ignoring distractions.
Divided Attention: Happens when we try to focus on multiple things at once, also known as multitasking.
In real life, we constantly switch between these types of attention. For example, while working on a project (Active Attention), a notification might pop up (Passive Attention), distracting us for a moment before we return to work. If we try to respond to a message while listening to a meeting, we’re engaging in divided attention, but in reality, we’re just rapidly switching between tasks.
The Truth About Multitasking
We’ve all bragged about multitasking, but here’s the truth, the brain doesn’t do two things at once; it switches back and forth between tasks. Each switch burns time and mental energy, leading to errors and fatigue. Except when tasks are deeply ingrained. Driving a familiar route while chatting? Prior experience and expertise allow us to perform certain tasks almost automatically, freeing up mental resources for other things. This is why learning and practice are crucial for reducing cognitive strain in complex tasks.
Attention’s Limits: Why Less Is More in UX
We mentioned earlier that attention is a limited resource. The harder a task is, the more focus it requires. If we try to do something complex in a distracting environment, our performance suffers. This is particularly important in crafting UX, especially when onboarding users. An interesting fact is that divided attention creates more excessive cognitive load than complex tasks, so making tasks less complex and avoiding multiple tasks at once are two key guidelines to remember.
Key limitations include:
Cognitive Load: Complex tasks demand more focus. Cluttered interfaces or confusing onboarding? Recipe for frustration.
Distraction Triggers: Unnecessary notifications or auto-play videos sabotage focus.
The Scanning Shortcut: Users don’t read—they scan. In fact, NNGroup research shows 79% of users skim in predictable patterns.
6 Scanning Patterns Every Designer Should Know
Because attention is limited, we tend to focus on the most important things. So it's natural to expect that people don't read everything on your website—they scan it, often overlooking important details. Let's take a look at some of the most common scanning patterns that we should know:
F Pattern: Skim headings and left-aligned text (common in blogs).
Z Pattern: Follows a zigzag path (ideal for landing pages).
Layer-Cake Pattern: Jump between headings/subheadings.
Spotted Pattern: Seek visual anchors (icons, bold text).
Marking Pattern: Users fixate on specific content while scrolling, occasionally pausing to absorb key information.
Bypassing Pattern: Skip dense text for relevant info.
Pro Tip: Place critical info (like CTAs) along these natural pathways.
Designing for Attention: 5 UX Strategies
There are many ways to design a product that aligns with the laws of human attention and leverages it to maximize desired results. A few worth mentioning are:
Positioning and grouping related items close together
Using simple and non-repetitive headlines and subheadlines
Placing important information and keywords at the beginning of the structure
As you probably already understand, all the different building blocks of our cognitive system work together, and we can’t isolate any single one from the system. That being said, the laws of perception (which I covered in my earlier blog post) and memory are two of the most important and helpful topics to read about when designing for human attention.
Final Thoughts
Understanding attention helps product teams create better experiences. By recognising how users focus, what distracts them, and how cognitive load affects performance, we can design products that are easier and more enjoyable to use.
Key facts to keep in mind:
Attention can be active or passive – Users either choose to focus on something or have their attention pulled by their environment.
Attention can be focused or divided – Users either concentrate on one thing or try to split their attention across multiple tasks.
Multitasking is constant task-switching – Instead of doing multiple things at once, the brain rapidly shifts between tasks, reducing efficiency.
Cognitive overload should be minimised – Too much information at once can overwhelm users, leading to frustration or disengagement.
Distractions should be reduced – Unnecessary pop-ups, notifications, or auto-playing media can pull users away from their primary task.
References & Further Reading
Hodent, Celia. "The Gamer's Brain: How Neuroscience and UX Can Impact Video Game Design, 1st Edition." 2017. Official Book Website: https://thegamersbrain.com/
Xuan, Yun. "The psychology of attention in UX design" 2023. Blog Link: https://uxplanet.org/the-psychology-of-attention-in-ux-design-b514b8234c2
Pernice, Kara. "Text Scanning Patterns: Eyetracking Evidence" 2019. Blog Link: https://www.nngroup.com/articles/text-scanning-patterns-eyetracking/
