What Designers Often Forget: The Brain Has Its Own Rules

How People See Before Thinking

Human vision is astonishingly fast and powerful. Almost a third of the human cerebral cortex focuses on processing visual information, and it is faster than the areas that process hearing or touch. Humans can identify images in as little as 13 milliseconds, which is faster than a beat of a hummingbird’s wing. The brain quickly captures a snapshot of a screen and can immediately start making sense of it. In the initial instants before any conscious thought occurs, the human mind absorbs colors, shapes, and layout cues at lightning speed. We can attribute this speed to evolution because of the need to spot threats or food sources at a glance. This speed deeply affects how users experience a user interface.

In those fleeting milliseconds, our brain engages in what’s called a pre-attentive processing state, a flurry of subconscious activity that kicks in before we’ve even focused our attention, is massively parallel and extremely fast, and automatically detects basic visual features without any conscious effort. In this fleeting moment, certain elements stand out immediately as though screaming for our attention—for example, the single green blueberry in a sea of blue, shown in Figure 2.

Image source: Jessica Ruscello

In Figure 2, the lone green blueberry pops out immediately, almost as if it’s demanding our gaze. Our eyes snap to it immediately, as though this difference carries some hidden significance, because our brain’s pre-attentive system is at work and is attuned to detecting visual anomalies in a fraction of a second.

Just as our ancestors survived by spotting the one ripe berry on a bush or the glint of danger in the eyes of a tiger that is hiding in tall grass, our minds first prioritize what breaks the visual pattern. That’s why understanding how a splash of color, a unique shape, or an unexpected contrast can effortlessly guide users’ attention—without their even realizing it—is fundamental to UX design, especially when designing something like a call-to-action or a critical alert.

Why Familiarity Feels Right

Crucially, the brain is fast but is nevertheless a pattern-recognition machine. The psychologist Daniel Kahneman calls this speedy, intuitive mode of thinking, which is “fast at detecting simple relationships or recognizing patterns.” As users, we constantly, albeit subconsciously, compare what we’re seeing to what we’ve seen before. No user interface before us is ever truly new. Our brain immediately tries to fit it into familiar templates. Although UX designers often want to try something new, the brain naturally defaults to established design conventions and rightly so, as these conventions possess considerable power. Users have spent years browsing other Web sites and apps and carry those experiences with them. As UX legend Jacob Nielsen has observed, “Users spend most of their time on Web sites other than yours…. People expect Web sites to act alike.”

If almost every ecommerce site has a menu across the top, a Search icon on the header, and a Shopping Cart icon in the upper-right corner, a new site feels intuitively usable if it follows suit. Conversely, bucking such conventions can trip users up in a big way. We can conduct a simple thought experiment by taking an example of a navigation menu and placing it where people expect it to be: on a horizontal bar along the top of a Web page or a hamburger icon in the upper corner of a mobile app. Nobody has to think twice about how to start exploring. But hide the menu in an unusual spot and users would likely flounder. Therefore, familiarity is our friend when designing for the human brain. The use of familiar patterns in layout, style, and interactions across devices, as Figure 3 shows, gives people clues that the brain instantly associates with one another, reducing the cognitive effort that is necessary to use a product across devices.

The expectations that users develop through experience are their internal mental models, which are essentially what a person believes about how a system works. Users form mental models from both their real-world knowledge and their prior interactions. As with the earlier Microsoft example, a user experience that breaks with the user’s mental model results in disorientation. No matter how visually attractive a design is, it can still flop if it calls for people to unlearn their ingrained habits.

Why Icons Speak Louder Than Words

Nowhere is the reality that every digital user interface is built on metaphors and conventions clearer than in ecommerce user experiences, which rely on the user’s existing mental models. The Shopping Cart icon on an ecommerce Web site or app is a direct adaptation of a real-world concept. Online shoppers browse and add items to a cart because this interaction mirrors their real-world shopping experience.

Plus, users expect full control over this cart, just as in a real-world shop. If an online store were to break this paradigm by automatically adding an extra item or a fee to the cart, confusion and distrust would ensue. Moreover, if a travel site began preselecting insurance add-ons, it would violate users’ expectation that only they should add items to their cart, leading to user frustration and drop-offs. The power of the cart metaphor lies in how users can immediately understand it. They see the little icon, click it to review their purchases, and can easily check out. No tutorial is necessary.

The same goes for a host of other familiar UX design metaphors and conventions. For example, on a Web page, underlined text screams interactivity. Decades of browsing have taught us that an underlined word or phrase is most likely a hyperlink. As the article “How To Use Underlined Text To Improve User Experience” states, underlined links have become “one of the most recognizable features of our online experience”—to the point that, when users see underlined text, they “immediately assume it’s a link.”

While visual designers might frown at underlines marring their clean layouts, removing that cue risks eroding a fundamental user expectation and users’ trust. Certain icons have achieved near-universal recognition—for example a tiny house icon that universally means Home, a magnifying glass that means Search, or a gear that means Settings. These symbols have become so ingrained in users’ minds that using them gives users a head start. As the article “UI Icons: Explaining Every Single Type with Inspirational Examples” states, “Universal icons are the standard symbols for common actions…. Anything else may confuse the user.”

And, of course, whether in a desktop or mobile app, users widely understand the humble X, or Close box, in the corner of a window or modal dialog box to mean Close. Users might not consciously think clicking this X will close the window, but they’ve clicked enough of them in their life that it’s now an automatic reflex. Research also confirms that users commonly recognize the X, or Close box, as the cue for canceling an operation or closing a dialog box.

Speaking the Visual Language of the User

Conventions such as Shopping Cart icons, underlined links, and Close boxes form a kind of visual language that users barely notice. They just flow through an experience by doing what they set out to do—achieving their actual goal. However, when a UI design strays too far from this lexicon—perhaps because of a funky icon that nobody’s seen before, a crucial link that doesn’t look clickable, or a navigation system that defies conventions, users become acutely aware of the user interface—and not in a good way.

If users have to stop and ask, “What does this mean? Or how do I…?” every second of hesitation is a crack in the user experience. Senior UX designers know that their primary emphasis should be on improving usability in ways that let people see and interpret things naturally rather than creating new visuals just for the sake of it. As much as we love creativity, respecting the human brain’s biases and preferences usually creates effective user experiences.

During a critical workflow, when someone is navigating a bank’s user interface or trying to make a purchase, the way to their goal should be obvious, not obscure. When users are looking for direction, surprising them with unconventional UI patterns risks disrupting users’ expectations, possibly diverting them from the primary action we want them to take. Research suggests that consumers have become more impatient, so when users are making quick decisions and must think about the way to get where they want to go, this leads to confusion and drop-offs from a workflow—or worse, site abandonment. This can occur regardless of the overall quality of the product because of the friction that the experience creates.

As UX designers, it’s important to remember that we’re not the only ones solving similar problems or providing similar products. Even if your product is stronger than that of your competitor, if their user interface is clearer and more familiar, engendering few or no questions in the brain about how it works, users might choose it simply because it’s easier. That’s the reality of how users’ mental models shape the way they expect things to work and how they form positive or negative associations with the brand. When designers deviate too far from users’ expectations, they introduce unnecessary uncertainty that creates cognitive strain, and that strain, even if subtle, adds up.

It is essential to consider how many decisions we’re asking the user to make, and whether they add value to the user’s workflow. We need to remove any unnecessary decisions as we guide users to take the primary action we want them to take without second-guessing themselves.

Yes, branding matters deeply, and in many instances, matters equally or even more than the product itself by drawing customers to our products. But we should not justify adding a quirky icon or using a clever menu placement in the name of branding, while ignoring the fact that we’re leaving users with a feeling of frustration, confusion, or annoyance after they’ve interacted with the experience. Putting a tremendous amount of weight on visual identity alone cannot save us from making such a mistake. It just hurts the brand. Mistaking familiarity for a lack of creativity is the antithesis of a sign of respect for the user’s time, attention, and intent.

Designers might ask, “Why are we still doing something this way?” or “When is Apple finally going to change that?” These might seem like fair questions until we look at how deeply habits are wired into people’s mental models. Just because something seems outdated or illogical on the surface doesn’t mean it’s broken. In fact, many of the UI patterns we see today in Windows, macOS, or on Web sites persist because users have spent years learning how they work.

While it might be easy to view these designs making the presumption that no one else has thought of a better idea, changing such obvious things could cause neurological disruptions. Some disruptions are okay as change in and of itself implies some level of neurological disruption. However, in most cases, the cognitive cost of fixing something familiar is far higher than the reward of doing it in a slightly more logical way. Interruptions that might appear minor can cascade into behavioral shifts that ultimately negatively impact revenue far beyond the visible delta. This is one of the reasons why companies deliberately prioritize keeping things the same. This is a strategic decision.