5 amazing UX Nudges to improve your website

How do we create a website that increases the number of conversions?

 

Is it just about designing a good-looking website? Or is there something deeper we need to consider?

 

UX (User Experience) nudges are all about making subtle design choices that get visitors to complete specific actions.

 

Believe it or not, there is a lot more thought that needs to go into how your website converts than just including a ‘contact us’ button.

 

Research shows that what we choose, often depends on how choice is presented to us. So even the smallest changes to the decision-making environment can impact the path we take. It can impact whether or not we convert.

 

UX nudges aim to influence the visitor to a website, to help guide them on that path.

 

In this article, I reveal some of the UX nudges we use here at Epix and others you might have seen around the web.

 

But first, let’s just explore how people actually make choices. What goes on in our mind when we’re deciding to do something, or not.

Now, there are plenty of models out there that explain how we make choices.

 

My personal favourite is the Fogg Behaviour Model founded by Dr. BJ Fogg at Stanford University. Why do I like this model? Because it simply states 3 areas that we, as web designers, can control to influence behaviour.

 

The Fogg Behaviour Model shows that three separate criteria needed for a behaviour to be made:

 

 

Quite simply, whether someone actions a behaviour (such as subscribing to an email newsletter) is dependent on their motivation to do it (is it worth it?), how easy it is to do it (is the process complicated?) and how tempting the prompt is (do I want to do it?).

 

As web designers, we can influence all these areas.

 

We can design pages and write copy to motivate the user. We can make those processes easier to accomplish. We can design prompts that can increase conversion.

 

First things, first.

 

Goals. We need to know what we’re shooting for. What the purpose of the website is.

 

We’ve discussed previously – how defining a single goal for your website can help focus the design.

 

This can be absolutely anything that helps your business:

 

• Achieve sales
• Get Sign Ups
• Generate Leads
• Provide information
• Increase downloads of an eBook

 

Anything! Once defined though, this can help ensure your website has a purpose, a meaning. The design can then focus on achieving this goal.

 

After this, we need to define the user. Understand who we’re designing for can help influence what UX nudges will be the best fit and how they can be applied to direct your website visitors to achieve the goal.

 

Without this information, applying UX nudges to your website will likely be unsuccessful because you’ll be missing the first piece of the puzzle – and fail to implement changes around the users’ motivation.

 

So, let’s have a look at a few different types of these UX nudges and how they can be applied.

 

1. Anchoring

 

I recently bought a new acoustic guitar. I ended up going for a blue one with input for plugging it into my amp. My other half, she hates it. I think for my lack of skill over anything. But oh well!

 

Now, if I were to tell you that it cost £130, what is your initial reaction?

 

If you’ve never looked at the price of a guitar before, you might think “Blimey, that’s a lot”.

 

But why would you think that if you have never looked at the price before?

 

It is because you have nothing to ‘anchor’ your perception of the price against.

 

(Incidentally, the prices range from around £40 to well over £5,000.)

 

An anchor allows you to understand if what you’re purchasing has value. It can also allow the user to understand what the ‘default’ option is in any situation.

 

Example: take the brightness setting on a mobile phone. Typically, this is automatically set around 50%. This setting allows you to understand what the normal setting for your screen is. And adjusting it up or down from there will make it brighter or darker.

 

Anchoring can, therefore, help influence people’s behaviour, it enables them to understand what the norm is and then assess value up or down from there.

 

We did this for a car finance company, Dorsia. As part of the user experience we introduced a finance calculator:

 

Rather than leaving the calculator blank, waiting for the users’ input, we pre-populated it. 24 months is the average length of a deal, meanwhile, the amount to borrow is set to a level that communicates that this is a financing company for prestige cars. Both of these help to set anchors that communicate value. 

 

Behave.org carried out a split test for Oxfam on their online donations. The initial version was a webpage that simply had a ‘donate now’ button. Meanwhile, the second version showed a field that was pre-populated with an amount: 

 

 

The results saw that anchoring version saw a 23% increase in subscribers.

 

Why?

 

Because the anchoring removed a cognitive load on the user. They didn’t have to think about what price they should donate. They’re already being told that £4 a month is the norm. And they are able to adjust their donation from this ‘default’ option.

 

The most common form of anchoring you will see relates to discounts in pricing.

 

The above example, we can see how this laptop is on offer through Amazon. But is the offer worth it?

 

By stating the existing price of £599.99 and marking it out, what Amazon is doing is anchoring the user into how much the normal price is. This then allows their mind to anchor whether the offer is good or not.

 

2. Tunnelling

 

Distractions are all around us. The problem with distractions is that they, well, distract us.

 

Here’s one you most definitely come across.

 

Social Media share buttons on product pages on ecommerce websites.

 

 

Make sense, right? You want users to share the product they found in hope for others to take an interest. Right?

 

But… isn’t the aim of a product page meant to be convincing the user to purchase the product?

 

In which case, why are pushing share buttons on product pages? Are they just causing a distraction?

 

This is the exact question that Finnish company Taloon asked themselves. They decided to remove the social media share buttons from their product pages.

You see, when trying to persuade and influence a user’s journey, we want to ensure they don’t leave the path that we’ve set out for them.

 

That’s where tunnelling comes into play.

 

You might never have heard of it, but you’ve definitely seen it.

 

Tunnelling is a process of removing any detours that a user can take whilst completing a task. The best case you would have seen this is in joining a website, completing an online form or placing an ecommerce order.

 

How do we do this?

 

Typically, we remove any form of navigating away from the page.

 

For example, this is Asos’s sign-in page on this website:

 

 

Notice how everything on this page is dedicated to you signing in.

 

There’s no navigation bar at the top where I can get distracted shopping for another checked shirt. All this page simply wants me to do is sign in and nothing else.

 

As mentioned previously, you’ll see this mainly take place on checkout pages on ecommerce sites. Why? Because the purpose of the user journey at this point is to get that sale.

 

 

Above is a screenshot from the checkout page for Sodastream. Once again, notice how there is no navigation links. All you can do is simply follow the process to place the order with no distractions to end up elsewhere on the website.

 

3. Micro-copy

 

Simply put, micro-copy is small bits of text on a website. Often seen in headings and button text.

 

But what makes micro-copy special is that it is an incredibly powerful UX nudging tool.

 

Why is this? As we’ve mentioned before (on more than one occasion), people do not read websites.

 

They scan read. Hoping to find the information they are looking for. And micro-copy plays a big part in this.

 

You see, scan reading tends to mean people just read headings and buttons to give them an idea of what the content is about. If the headings and button content motivates them, then they are more likely to read the content within.

 

One of the things I regularly rant about with website design is button text just saying “click here” or “read more”. And this is because these small bits of text should be your secret weapon. Giving context to your users and leading them on their journey.

 

And the results from paying attention to your micro-copy can be astonishing! Take for example this case from Veeam. They noticed that visitors were calling or emailing them asking for pricing (something they couldn’t show on their website due to third-party agreements). However, their website did have ‘Request a quote’ micro-copy:

 

 

They decided to change this micro-copy to ‘Request pricing’:

 

 

The results:

 

Veeam saw a 161.66% increase in click-through rate to their lead generation page!

 

But micro-copy doesn’t just apply to buttons! There’s plenty of places you can apply it.

 

 

In the above instance, we’ve used micro-copy in the form of eyebrow headlines.

 

These are small bits of micro-copy that sit above a section to categorise the information below in a succinct and contextualised way.

 

This reduces the burden on the heading having to provide all the context for scan readers. Users can literally just glance at the eyebrow heading to understand what the section is about and if it is relevant to them. Letting the headline provide further information or communicate juicer benefit-driven messages.

 

 

Micro-copy can even be used to reduce barriers to conversion. The above example shows how incorporating micro-copy in the form of a tooltip can give reassurance to the user. And reassurance can be a key part of the power of micro-copy.

 

In the following example, Betting Expert were looking to increase the number of signups they could achieve. To sign up a user had to enter a username, email and password.

 

They discovered that one of the barriers preventing people from signing up was a hesitancy to provide their personal information. And not knowing how it would be used.

 

Betting Expert decided to introduce a small bit of micro-copy onto their call-to-action that simply states “We guarantee 100% privacy. Your information will not be shared.”

 

 

The results?

 

A 19.47% increase in signups. Simply by adding a small bit of micro-copy.

 

4. Social Proof

 

People are social animals. We take cues from others on whether to do something or not. Their views and actions influence our behaviour. We’ve actually looked at this previously from a psychological perspective which you can read here.

 

It’s common for websites to feature things such as review stars, Trustpilot score and testimonials – these are all great, tried and tested, ways to demonstrate social proof.

But social proof can be implemented in other ways too. Streak CRM applies social proof to their pricing table by literally stating what the most popular products are.

 

 

This clearly helps the user know what option other people typically go for – similar to anchoring, it sets a benchmark.

 

Basecamp is another company that employs social proof in an alternative way

 

 

Here on their sign-up page, they state how many companies got started with Basecamp in the previous week.

 

A strong takeaway here is that social proof nudges don’t necessarily have to be just reviews or testimonials. Find out what other statistics or evidence you can use to prove your worth to prospective customers, and tie them into your calls-to-action.

 

5. Multi-step Forms

 

Let’s be honest. Do you like filling out forms?

 

I don’t particularly. Especially if they’re long and have lots of steps.

 

The purpose of most website forms is to generate leads. The problem is, so many forms require more information than is really needed at the point of enquiry.

 

For example, Expedia found out that a single form field asking users to input a Company name was costing them $12million a year. The field wasn’t really needed for lead generation.

 

An expensive mistake!

 

The problem with long forms is that they overwhelm the user. They add friction to the experience.

 

And every element of friction can cause a user to abandon a process.

 

So, in an ideal world you want to reduce your forms down as much as possible. Making the process quicker and easier for users.

 

But what if you need to collect lots of information from a user?

 

This is where multi-step forms come into play.

 

These break down the process into smaller steps across multiple pages or parts. This prevents the user from becoming overwhelmed by the process, thus reducing friction.

 

And the results can be amazing.

 

Take Just Eat for example. In 2016 they decided to break their checkout process into a multi-step form:

 

 

As a result, they ended up increasing orders by 2 million per year.

 

In fact, research by Conversion Fanatics has found that introducing multi-step forms can increase conversions by nearly 53% on average.

 

———

 

These are just 5 techniques for creating UX Nudges within website design. The ultimate aim is to help your users navigate toward achieving both your business goals and their user objectives.

 

Websites should be something you test and regularly update based on the results. Hopefully, these tips have given you some actionable ideas to improve your website experience and increase conversions.