Have you ever walked into a friend’s house and realized he has completely rearranged his furniture? Or gone to your favorite grocery store, only to find they reorganized the aisles, and your produce, pasta sauce and snacks are no longer in the same spot?
It’s jarring, right? "This isn’t how I remember things!" you might say to yourself. "This isn’t right!"
Humans are creatures of habit. Once we have a model for how a certain space should look in our head, finding that model altered can disorient us.
Our brains are hardwired to seek out familiar patterns, so when the recognizable becomes unrecognizable, we experience a sort of shock.
Online, we operate the same way, using fixed mental models. A website redesign produces the same unsettling effect in customers that a grocery-store reorganization does in hungry shoppers.
So website designers who are tempted to spruce up their sites or shift things around in the name of trend and aesthetics should proceed with caution. Think of how you would feel if you stumbled into your local Stop ‘N Shop only to discover you couldn't find a simple carton of milk.
Familiarity Breeds Content!
No one logs onto a website knowing they are applying mental models. It happens subconsciously, the same way you connect a name to a familiar face, or an action, like “Stop,” to a red, octagonal-shaped sign.
We organize our world by shapes, colors and various cues. Designers facing a creative urge need to balance their desire for uniqueness with their realization that customers simply prefer the familiar.
When we shop online we don’t realize we have a model for where the “Add to Cart” button or the “Support” and “Contact Us” links should be located, but we do. It’s a model based on all of our previous experiences online, and the standards and general trends applied to websites today.
When we interact with a website, we are doing much more than looking at prices, text and colors. We are scanning for the familiar, first seeking out clues like square-shaped boxes that give us baseline information before we apply higher-level cognitive processes like reading the text contained in those boxes.
A Call to Action or a Call to Confusion?
As a web psychologist for Clicktale, I have access to a wealth of data to help me analyze how visitors interact with different platforms. In my work, I don’t analyze how individuals interact with the world—I analyze how users interact on the World Wide Web.
To test these preconceptions, we ran a study of a major global ecommerce site whose Call To Action (CTA) buttons varied in size and shape across the site. By analyzing hundreds of user interactions with the site, we saw users presented clear indications of confusion, such as scrolling up and down and searching where to click.
Each button varied in design, which meant that it took users longer to rearrange to their mental models and understand how to react. That’s frustrating and, in the long run, detrimental to a company’s bottom line.
We recommend that the e-commerce site change their website so that all CTAs were consistent in both appearance and position. Once the change was implemented, our customer saw a dramatic jump in their conversion rates.
Who Moved My [Virtual] Cheese?
Human interaction with the world flows like an inverted triangle, in a form of mental processing called Top-Down processing. First we deal with the big stuff, like shapes, trends and categories. Only after we process those ideas can we tackle the smaller and more specific details.
But new experiences, like visiting a social network or dating website for the very first time, require a different type of process: the Bottom-Up process. Here, we take in the specific first and then the general, allowing our brains to become familiar with new structures and usability models. This sort of thought process is significantly more exhausting than Top-Down processing, so if we have an existing mental model in our minds, we will always defer to it rather than expend energy to build a new one.
This is where website designers need to tread careful in terms of innovation.
All of us know what websites look like. We interact with hundreds of pages each week and we already have mental models for almost every basic type of site—ecommerce, media, entertainment, social networking—set in our brains.
So when a visitor comes to a truly unique-looking site, his first reaction is not going to be a sense of wonder and awe at the beauty of its design. It will be frustration that things are not where they should be according to his mental model. "Who moved my cheese?" he will think, or more likely, "Who moved my “About Us” tab?"
When you mess with mental models, you run a major risk of slowing down and annoying your customers, and potentially losing them all together.
The Power of Prototypes
Mental models don't only exist at the alpha level. Not only do we have a mental model for the website’s layout, our brains also produce mental models for each individual category.
When we are exposed to a new website, if it follows the familiar scheme for its category, such as online shopping, media or banking, we are able to identify the website type after a brief exposure because we connect it to an existing online mental model and already have a general idea on how to use it.
When it comes to ecommerce, we are used to the Amazon prototype with the horizontal product arrangement. When one of our retail clients launched a page with products arranged vertically, session playbacks revealed a surprising pattern of behavior—the users kept scrolling horizontally even though it didn’t match the layout.
Curb Your [Creative] Enthusiasm
Humans are amazing energy-conservers when it comes to brainpower. Once we establish a mental model, we immediately store it as a default template for all similar schemes, saving us the valuable brainpower and energy required for recognition process in the future.
So whether you are a website designer, a major ecommerce site or just a small business owner looking to expand your web presence, keep these points in mind when it comes to creating and updating your homepage:
1. KISS: Keep it Simple, Stupid
Killer aesthetics are wonderful. Surprising and disorienting your customers is not. If you want to go funky and fresh on your website design, feel free, but make sure that no matter how wild your creative urge, you keep the standards—like Call to Action buttons and the placement of crucial tabs—simple.
2. Practice model behavior
If you’re unsure what your customers’ existing mental models for websites might look like, do a little research. A good rule of thumb is to start with the big boys. Are you an ecommerce website? Check out Amazon’s layout. Are you a publisher or media house? Scroll your way over to the New York Times and CNN.
The bigger the site’s user base, the more standardized their site will look like. Hence, the more likely that its basic features will be ingrained in most customer’s mental models.
3. Creativity may be key, but don’t forget the lock
Artistic license is an excellent tool to employ in order to stand out from the pack and make your site memorable. But be careful to strike a balance: Make sure your website has a flawless, clean skeleton that covers the basics of customer experience, and that the creative aspects are limited to excess dressing and design.
4. When in doubt, put yourself in your customers’ virtual shoes
When you're working on an exciting new website design, it's easy to get caught up in the glitz and forget what it feels like to be an average consumer logging on to make a simple purchase.
Always imagine yourself as a consumer, not a designer. If making the leap to virtual experience is too tough, break it down to a more basic experience. Remember, logging on and shopping on the web isn’t so different than driving to the corner store for a few basic groceries. And no one, no matter how sophisticated a shopper, likes it when they have to stroll the entire store just to find a pint of milk.