De-stressing Booking.com's UX

A Chrome Extension inspired by the aggregator giant's dark patterns
4 minute read

Illusions of scarcity

I use Booking.com quite a lot. Since moving to the Netherlands my family, friends and often my work are an overnight stay away. And it's great– there are a huge range of options, and a simple booking process. I'm pretty reliant on it a lot of the time.

But using Booking.com makes me stressed, because regardless of how far in advance I'm planning, how many hotels are actually available or how off-season I might be, the site does its very best to make me feel like I'm dangerously close to having to sleep on a bench for my forthcoming trip to Munich unless I click the button NOW! NOW! NOW!.

From a recent experience booking a trip to Japan on Booking.com

I'm sure it didn't start like this. Airbnb for example also uses messages to indicate how busy a certain destination is looking, but theirs tend to feel factual and informative, not deliberately stress-inducing. I guess it started this way at Booking.com too and in fact some of the messages shown on their site are kind of helpful.

Though alarming, this message on Booking.com is useful.
I can see there are two rooms left, and the last booking was less than a day ago. I need to get my skates on if I want to book this one.
A more straight-forward message from Airbnb.com

But somewhere along the line perhaps these informative messages proved too effective in raising conversion rates to resist pushing further. They started to move into a darker territory, deliberately attempting to create a sense of scarcity where there really wasn't.

Consider this one:

What are we saying here, Booking.com? Some properties were just booked in Yamanouchi. Ok, when? For the same dates as me? And properties like the one I'm looking at have been booked. So not the one I was looking at, just one like it.

This is not helpful data, it's a tenuous statistic dressed up to make me think my accommodation options are running out.

The HTML code on the page marks out many of the messages using CSS classes the developers have named 'persuation' (sic).

This doesn't feel like a healthy way of selling. Apart from raising my anxiety levels during what should be the enjoyable process of planning a trip, if I'm being presented not with clear availability stats but unqualified red-alert scarcity warnings then I start to mistrust the site.

Of wider concern is that this approach is being increasingly emulated across the web, and various marketeers can be found applauding Booking.com for the effectiveness of their methods, touting their use to increase conversion rates.

Unqualified high-demand fluff on Easyjet.com
Last booked 3 minutes ago, but for what dates?
Outside of the travel industry, Chain Reaction Cycles provides an example of the same tactic in creating a sense of urgency

Begone, stressy messages

I decided it was time to fix Booking.com, at least for my own purposes.

I had been experimenting with Chrome Extensions for a while, and proudly launched a previous extension called Cole, which pulls objects from the V&A museum's collection, by using the new tab event trigger.

Handily, Chrome extensions can also be used to manipulate the content of the web page you're currently on, and herein lay the solution. Booking.com's CSS tags in the page's code are often named for their purpose, and called things like 'persuasion', 'urgency', 'scarcity' etc. This made them easy to find and through some simple CSS overrides, hide from the page.

One of the site's CSS class names, 'motivate-messages', and the CSS override in the Extension code which hides it.

Hiding the horrors

It took a few days of using Booking.com to note down all of the different nudges, alerts, notifications, pop-ups, etc (in the end there were 35 different class names across three pages, and multiple instances of each one) and get them hidden. Along with this, hotels that are already sold out for your chosen dates are hidden altogether, and various 'great value today' notices are silenced to further reduce noise.

A more positive tone of voice

The next step was to tweak some of the wording on the more useful items. Some of the language is unnecessary, scolding even. Look at this one, which appears if you hesitate on the check-out page for just a few seconds:

No red alerts here, but the page manages to squeeze in a notice that someone just looked for the same dates, and like a parent warning its child not to eat all the candy in one sitting, we are told "when it's gone, it's gone". Not helpful and not very pleasant either, especially on a page where I'm probably about to book anyway. So we can make this a bit nicer:

The 'calm' emoji marks out any text that's been manipulated by the extension, so the user is aware

The red warnings that are presented when a certain room type has gone were also improved, as were items like "See our last available rooms" on CTAs, which was changed to a more positive "See available rooms".

Throwing the bathwater, not the baby

As we've said, some of Booking.com's messages are useful, if a bit alarmist. How then to allow the helpful notices to get through, while still filtering out the unhelpful ones?

Taking the view that the 'x rooms left' notices are probably the best indicator of actual scarcity, I began looking at a way to allow messages to be shown if only one of a particular room was left. Unless I'm looking at the Ritz Piccadilly at New Year, knowing that there is more than one room available is probably enough for me not to have to panic-book.

However, that might depend on a few different factors, and personal preference. The answer then, might be to provide a user-setting to set the level of filtering.

4 levels of filtering are available: 0 means no 'x rooms left' notices are shown, and 4 means all are shown

This was achieved with Chrome Extension Settings, with Chrome Storage used to capture the prference. With a lot of fiddling and some Regex magic, certain notices were now allowed through depending on the level of filtering set.

The warnings themselves however still looked alarmist, so a bit of work on tone of the voice and the visual was needed here too. The end result is a lot calmer and more positive:

Before
And after

An overall more pleasant experience

The De-stresser is now live and if you're using Chrome, you can add it to your browser right now, fire up Booking.com and give it a spin.

It will turn your Booking.com pages from this:

into this:

and from this:

to this:

Try it out!

I really don't want to see all shopping sites go down the same path, and end up in a world where conversion is king at all costs, where dark patterns are ubiquitous and shopping online leaves with me a headache and a raised heart rate.

I encourage you to have a go with the extension and see how Booking.com could be, and how differently you might feel about the site once all the red alerts have gone and the 'motivational' language has been toned down.

I've been using the De-stresser routinely for a while now, and I'm a much happier, calmer booker 😌

Get the De-stresser extension here

Thanks for reading. If you've any comments, suggestions, or if you find a warning on Booking.com that the De-stresser has missed, please do reach out. You can email me at hello@alexcharlton.co, or tweet me at @_____alexc

A quick word on using the extension

In case it wasn't clear, the De-stresser extension is not provided by Booking.com and is in no way endorsed by anyone at Booking Holdings Inc. If you'd like to give it a go (as I hope you will), you should remember that this is an experimental product, and you should not attempt to make actual bookings on Booking.com while it's in use. This extension hides certain information from the Booking.com website pages, and therefore if you make a booking while this extension is in use it may violate the terms and conditions of the website. It's provided with no guarantees, and its creator will not be held liable for any problems arising from its use, including bookings made or attempted while the De-stresser extension is installed on your browser. It will not necessarily remove all the nudges that Booking.com presents, and it's possible that useful or important information may be accidentally hidden.

And finally, you might see a message like this when you install the extension. It won't read or change your data, but the permissions to do so are required to allow the page to be manipulate the displayed text.

It can, but it won't
Alex Charlton is a digital product and service designer

More case studies
Home / Work