U and I: a love story (and the X that everybody hates)

U and I: a love story (and the X that everybody hates)

Join us as we explore the importance of cognitive load, and how it should be considered in web design.

Written by Adrian Illescu

5 min read

The landscape of ecommerce is rapidly changing, with the supposed death of the high-street or Amazon overtaking Google (well, not really) and becoming its own search engine when it comes to many customer journeys. It was always a very flexible and adaptable space where innovation sat at its centre and shaped the direction of it.

And in such a competitive space, with new markets emerging everyday and tech-giants muscling into the area of services that used to be very niche, your only salvation is your brand, or at least it feels like it. But is this true?

Look, I get it: everyone wants that eye-popping, award-winning, superb website that does more than the job, does justice to your brand and helps your users enjoy a fairy-tale like journey through all the different categories of your products, spending hundreds of pounds at a time.

The truth is, there’s no such thing as a frictionless system that does everything for everyone, otherwise nobody would ever complain about anything and the entire customer service sector would go tits-up. But what we can do is to start looking at these systems that we create as opportunities, and take advantage of that friction.

And so I welcome you to part one in a series of love/hate stories between User Interface and User Experience:

Chapter 1 - Cognitive Load

What is it? Where can you get it? Is it viral 👀?

NN group describes cognitive load as “the amount of mental resource that is required to operate the system. Informally, you can think of mental resource as "brain power" — more formally, we're talking about slots in working memory.”

The term "cognitive load" was originally coined by psychologists to describe the mental effort required to learn new information. Though web browsing is a much more casual activity than formal education, cognitive load is still important: users must learn how to use a site's navigation, layout, and transactional forms. And even when the site is fairly familiar, users must still carry around the information that is relevant to their goal.

I still don’t get it

Imagine that you wake up one morning, go towards the bathroom to start your routine, try to pick up your toothbrush and realise that you need to assemble it first, add a battery and register it with the DVLA. Pretty frustrating, right? But we’re not there yet, because while you were doing this, you never even thought to check if you have any toothpaste to clean your teeth with. Because there isn’t any.

Annoyed out of your mind, you go to your cabinet to get a new tube of toothpaste, but come back to realise that the old tube was there all along, hidden between an old dying plant and your mirror, where you leave it every...single...morning.

What happened is this: your brain got distracted by the tedious task of assembling the toothbrush, which not only threw you off what is normally an automated task your brain easily performs every day, but even made you question your own initial intentions.

Now, if brushing your teeth wasn’t such an important habit, would you still do it every day after that whole experience?

That’s what I thought.

OK, I get it now, but how does this affect me?

You see, when your potential customers get frustrated, they won’t think twice about abandoning their journey if they can’t find what they came for quickly. Just like in the toothbrush scenario, when your users find themselves unable to understand the user interface, your conversions will start to suffer.

But this is not just devastating for your conversion rate; cognitive load also impacts how your potential customers feel. The worst consequence of bad UX is that users will start distrusting your brand, and once they’re out, they won’t come back.

When a website feel like hard work, we resent using them, we resent going back to them and we’ll eventually find a better alternative.

Your users don’t owe a thing to you. However much you want to lie to yourself that you have the best product in the market and that it’s better than what Palmolive has been doing in the last 20 years - as true as this might be - it means nothing, because your potential customers don’t owe you a thing.

There is so much choice and we have so many options these days that we won’t hold back when the hurdle appears in front of us. Unless you’re selling Fabergé eggs for a tenner, there is absolutely nothing worth pursuing for a user in a sea of ecommerce websites, better designed apps and so many product options.

How can I eliminate cognitive load?

Well, our purpose will never be to eliminate cognitive load entirely, first of all because it’s not possible to do so. And even if it was possible, it is not what we’re striving for. After all, your users are on your website to learn about your products, to absorb the information that you’re putting in front of their eyes, and most likely learn something new. But there is a difference between willingly educating yourself and trying to untie knots, and they’re defined as intrinsic and extraneous cognitive load.

Intrinsic cognitive load can be defined as the effort of understanding new information, keeping track of where you are and why you’re there. This is your brain’s ability to keep track of your goals and to make sense of the information that you’re absorbing.

However, extraneous cognitive load is what we, as product designers, are trying to minimise, because this is what harms the UX of your website. ECL is all about the processing that spends mental resource, but doesn’t offer anything back in return: there’s no learning involved, it doesn’t help the users understand the content and it just makes everyone confused about what should happen.

(Although we can all agree that Ling’s a legend, this is an example of how NOT to do it, btw, not a guideline in any way.)

Clever. But I really like that cat GIF on my website, what can I do to minimise cognitive load so users buy my products?

Different font styles that don’t have a clear purpose, multiple buttons next to each other that all look the same and seem to have the same level of importance, elements that don’t convey any meaning (like a cat GIF when you sell cement), that pop-up appearing right before adding a product to cart: these are all things that can load the working memory of an individual to a point of no return. It’s like that time your computer freezes because there’s no RAM left.

Have you ever tried to buy cement online while your computer doesn’t respond? You force quit everything, right?

And that’s what your potential customers will do too when they become frustrated with your website. The good news? There are actions that you can take to minimise cognitive load, and it won’t take you too much to identify them.

Avoid visual clutter: while links, images, text and typography are all key design factors, incorrectly or over-using them can negatively impact the user experience and risk driving them away from your site. Keep it simple!

Use existing user patterns as a foundation: people already understand existing website conventions and structures, based on years of using them. If you use labels and layouts that they’re already familiar with, you reduce the need for them to learn new things to simply get around your site.

Reduce tasks: identify anything that means users have to make decisions, remember things or read additional information. Try to use easier alternatives: can you use an image or set a default instead? Every task you can remove leaves your user with more capacity for essential decisions - like purchasing a product.

To conclude, cognitive load is a part of life. The trick is to minimise extraneous cognitive load where we can, in order to create as smooth a journey as possible for our users. By keeping things simple, clear and familiar to the user, we can remove many hurdles that stand between them arriving at your homepage, adding a product to the cart, and clicking the ‘buy’ button. In fact, we can actually use our knowledge to steer them down this path, making ecommerce better for your business and your customers: a win-win situation.

At Eastside Co we build ecommerce websites that are not only beautiful and functional, but take into account best practice when it comes to the user experience. If you have a store on another platform that you’d like to migrate to Shopify, an existing Shopify store that needs a fresh new design, or want to discuss marketing strategies so we can help take your revenue to the next level, why not get in touch?

Who we are

We are one of the world’s most trusted and experienced Shopify Plus Partners. A full-service, fully in-house digital agency of over 50 talented people, we’ve helped hundreds of ambitious brands exceed their goals.

About Eastside Co

What we do

Eastside Co leads the way in UX-focused Shopify web design, results-driven marketing strategies, and best-in-class Shopify applications and software. We help online businesses escape the ordinary and achieve ecommerce success.

Discover Services
Over 500 Shopify builds.

Let's work together to build your store.

Get In Touch