20 Dark Patterns to avoid when designing products



Dark Patterns - dirty tricks to avoid when designing products
Dark Patterns - dirty tricks to avoid when designing products  

2 months ago I collected a crazy list of 84 cognitive biases that can be used to design better products.

The post received a lot of positive feedback, tons of backlinks, and was featured in numerous UX newsletters, but there were some readers who didn’t like the provocative title (using the term “exploit”) and thought that some of the examples (heck, I made over 40 design snippets that night!) were too manipulative and got into the gray zone of design, acting as dark patterns.

While I agree that some of the examples I used (especially the ones related to scarcity effect, loss aversion, and negativity bias) were a little bit manipulative, most for them were perfectly legit, and demonstrated how good design should take advantage of the human brain (with all of its' malfunctions) to convey a better message, emphasize the value of the product, improve conversion rates and establish trust with the users.

Since the term 'Dark Patterns' was brought up in those discussions, I decided to make another collection, a sequel, and this time focus on real dark patterns.
So here are 20 dark patterns: UI patterns that product designers, product managers, and UX people should be familiar with, in order to avoid.

What are dark patterns 

For the ones who are not familiar with the term, dark patterns are design tricks that make people do stuff they didn’t plan to.
While it’s somewhat OK to use clever psychological nudges to convince people to do something, dark patterns take it to the next level with visual tricks, deceptive UI, hidden information, and automated actions, to trick the users without their formal acknowledge.

Let’s dive into the 20 types of dark patterns:

BTW, this post includes a lot of visual examples - they were all taken from real examples that can be found on various forum discussions twitter threads.




Sneaking Techniques

Every product leader knows that building trust with the users is one of the keys to improve conversion rates and increase engagement. New products are guilty until proven otherwise, so it’s the product’s responsibility to build trust and prove that it’s good. Nevertheless, many products use sneaking techniques to gain short term wins (such as accidental opt-ins), at the cost of breaking the users' trust. While such dark patterns may result in higher short term numbers - they frustrate the users and create negative feelings.


1. Sneak Into Basket

Happens when a checkout process ends up with an additional item that sneaks unexpectedly into the basket, forcing the user to either pay for it or specifically decline it in advance of the billing.

Sneak Into Basket example. Dark patterns to avoid when designing products - the mobile spoon
The giant mug is free, the storage and packaging aren't...

While some users may miss the extra item that sneaked into the basket, others may prefer to continue with the checkout and save the extra burden because they have already invested time and effort on this activity.


2. Hidden Costs

Users love certainty and aim to minimize risks (check out Neglect of Probability and Zero-Risk Bias).
When products add unexpected (or uncommunicated) costs such as shipment, packaging, or insurance - they break the users' trust and damage the satisfaction level. This is why I always recommend to state all the additional costs upfront, or “announce” that there will be absolutely no additional fees.

And still, many products “surprise” the users with an extra shipping cost, or an additional packaging fee.

This dark pattern might pay-off in the short term (cause here, again, some users may continue regardless to the additional costs) but it will definitely negatively impact long term success and sink the product retention rate to the ground.


3. Deliberate Misdirection 

Happens when the design nudges users towards a specific option (a more expensive one or one that hides certain commitments) and intentionally distracts them from the standard option.
Examples include hidden checkboxes, buttons the standout but hide an extra (unwanted) option or a deceiving microcopy.

Deliberate Misdirection Example. Dark patterns to avoid when designing products - the mobile spoon

In the examples above, those CTA buttons that stand out are not acting as the users expect: on the left, the UI nudges the users to tap on the green button (with a donation which should have been presented as an optional checkbox), and on the right, users may think that the orange button is the one that cancels the subscription (as it uses the word ‘cancel’) while in fact, the button prevents the user’s original intent (to cancel the subscription).

Check out the YOUR most popular posts in here: 
The best of the Mobile Spoon 

4. Bait and Switch

This dark pattern uses a known convention or a popular UI pattern as a bait.
Users falsely assume the UI will act according to the convention, but it doesn’t, and instead, a different undesirable action happens.
One famous example (which was told 100 times already) was used by Microsoft: while getting a Windows upgrade recommendation popup, users clicked on the [X] button hoping to cancel the upgrade, but instead, the button actually started the upgrade process.


5. Disguised Ads

Disguised ads can be found everywhere but they truly shine in social media apps where promoted content looks almost identical to authentic posts.
 Disguised Ads Example - 20 dark patterns to avoid when designing products

Some users (me included) don’t mind seeing occasional ads here and there (I actually click some of those ads), but some users find this dark pattern very frustrating.


6. Fake Download Buttons

Did you ever click a download button just to realize it’s one of these buttons that do all sorts of things, but ‘download' is not one of them?
It’s a “pick a card” trap, and the dealer is no other than the joker.

Fake Download Buttons - 20 dark patterns to avoid when designing products
Just pick a 'download' button and see what happens...

In the example above, 3 download buttons, only 1 of them belongs to the product/website. Which one is it?


7. Deceiving Lists 

I’ve recently noticed this dark pattern when adding friends on Facebook and Instagram (different UI design, same pattern on both).
This pattern uses lists and I see it as a subset of ‘Bait and Switch’ pattern.
  • The users are prompt with a list of friend requests.
  • They start tapping the ‘Confirm’ buttons, repeatedly, one after the other.
  • At some point, the list starts showing friend suggestions instead of requests, but since the UI is almost identical, users easily miss this important difference, resulting in some unwanted friend requests.
Of course, by using this small UI trick, products like Facebook are able to nudge users to send more invitations and increase the network strength.

Deceiving Lists - 20 dark patterns to avoid when designing products


Recommended: 11 lessons learned while trying to build a data-driven company


Easy to get in, hard to get out

This category includes dark patterns that encourage the users to get-in easily, but then make is practically impossible to get out.


8. Forced Continuity

We all love free trials, but when a trial requires a credit card - that’s a dark pattern sign right there.
Unless you set a calendar reminder to cancel the trial on time - the first payment will remind you about it, but that’s usually 1-2 months too late…

A more sophisticated version of this dark pattern happens when a product has a free track, but the only way to subscribe to the free track is to add payment details and start the trial period. Then, when the trial period ends, the account turns automatically into a paid account, and the only way to shift to the free account is by proactively switch plans, which is, of course, something most users forget to take care of...

Sounds complicated? That’s exactly the idea.


9. Roach Motel

This design pattern is named after the “Roach Motel” cockroaches trap.
It happens when a website or an app makes it very easy to create an account (or subscribe), but incredibly difficult to delete it. The opt-out suddenly asks for some security questions, an old password nobody remembers, etc.
Roach Motel - easy to opt-in, hard to opt-out.
Let's see if you can unsubscribe from this one...

Easy to get in, very hard to get out...

Which reminds me: did you know you can subscribe to the mobile spoon and get my occasional posts directly to your inbox?
All you have to do is subscribe here, I promise it takes no more than 5 seconds to subscribe and there’s absolutely no way to unsubscribe. Ever.


10. Separated Licences/Members Model 

This pattern is very wicked: in almost every system out there, licenses are added and removed by adding (or deleting) members to the team. The model is quite simple: the more members you add to your team - the more licenses you need to pay for. The act of deleting members reduces the licenses automatically.

With a separated licenses/members model, this is not the case: while adding new members automatically adds licenses to the basket, deleting members doesn’t reduce those licenses, resulting in a bloated licenses pack and ever-growing costs.

Sounds dubious? You would be shocked to know that the beloved Dropbox does exactly that. See this forum discussion 'unable to delete Dropbox licenses' which is quite shocking…


11. Invisible Opt-Out 

This pattern is pretty simple (but very dirty), the design deliberately changes the standard link style in order to make the opt-out option look like a simple text.
When the opt-out doesn’t look like it’s clickable, more people are likely to miss it, keeping more people bounded to the product.

Invisible Opt-Out Example. 20 dark patterns to avoid when designing products.
Tap the button if you can

I really enjoy reading Andrew Chen's essays, but every time I get into an essay, a newsletter promotion popup appears, blocks me from reading and doesn't have a close button, which means I need to refresh the page (until the popup reappears).
Took me a few seconds to discover that the popup actually has a close button, but it's white, on a white background, which means it's pretty hidden and the only way to continue reading is by subscribing to the newsletter...


12. Same Sender, Different Address

Have you ever blocked a certain newsletter just to get a similar one from the same sender a few days later?
Spam emails are sent under the same display name (that’s the sender name you see in your inbox), but they use different email addresses, which makes them harder to block.
Talk about a simple opt-in mistake that turns into a never-ending saga.


Having fun yet? Keep reading, I’m just getting started…



Cheap Manipulations

Some dark patterns use cheap psychological tricks to make users do things they didn’t plan to. These dark patterns are using some of the cognitive biases people suffer from, but they take it to the extreme.


13. Confrimshaing and Guilt-tripping

Don’t know what confirmshaming is?
Continue reading…
Unless, of course… you prefer to remain dumb, forever lost in your endless stupidity…  
Got it?
Confirmshaming is when the product encourages the users to do something “positive” (like subscribing to a newsletter) by shaming them if they won't do it.

Confrimshaing and Guilt-tripping. 20 dark patterns to avoid when designing products

Here are a few fun examples (go ahead and search for confirmshaming images, there are thousands of them):
  • No thanks, I’ll be the last to know
  • No thanks, I hate good times 
  • I am a bad person 


14. Scaremongering

This pattern uses scaring techniques to scare people into doing something they didn’t plan to do.
Common use can be found in warning popups scaring people into downloading software that will protect their computers.

Scaremongering example - dark patterns to avoid when designing products



15. Confusing Terminology

This dark pattern uses confusing language, double negative or specific jargon to trick the users into selecting the more expensive option or accidentally add costs.
Examples are sometimes funny such as buttons saying: “Don't opt-out” or “Do not out-in” but can be very costly if the sentence tricks the users to accidentally commit to a $99/year for prime services as can be seen in the example below:

Can you guess how much does the FREE shipping actually cost?
Can you guess how much does the FREE shipping actually cost?

I’m sure many of you recognize this dark pattern from a few years back.

 

16. Privacy Zuckering

Named after Facebook CEO Mark Zuckerberg, this dark pattern happens when a product collects and shares more information about the users than they ever intended to share.
This dark pattern, like many others in this list, is now illegal due to new privacy regulations such as GDPR, but there’s still a long way to go until all privacy issues are addressed.

Check out my short, no-fluff, actionable guide to developing GDPR compliant products.


17. Growth Spamming 

AKA: A friend in need is spam indeed
The product asks for permissions to access your contact details or social media (in order to help you find your friends etc.) while in fact, it uses your address book to spam your contacts with messages that are claimed to be sent from you.
Haven’t seen this one for a long while now, which is a good thing.


18. Bad Defaults

Users expect products to select the default behavior that is the best for them (for example default security settings, or default installation options).
I’ve mentioned it in my 84 cognitive biases post (did I mention I wrote this brilliant post, and that it has over 40 visual examples?): users are looking for metal shortcuts and product creators should make sure their product can be used without messing around customizing the parameters.
While products are allowed to use this bias for the benefits of the business, dark patterns create bad defaults that trick the users into making bad decisions.
Reddit’s default notifications setting includes 1 daily notification about trending topics. While I’m sure this notification is designed to keep users engaged with reddit and increase retention, most users probably suffer from too many notifications anyway, and having one more is not something they would appreciate.
This example is pretty simple and harmless. but some products use defaults to trick users into making costly actions they didn’t plan to. 


Bad UI

These types of dark patterns use bad user interface design to achieve a hidden goal. They ruin the user experience of their already hooked users in order to gain an advantage.


19. Unnecessary paging

Have you ever wondered why some websites split relatively short articles into 10-20 tiny pages?
Don’t you hate it when it happens?

Unnecessary paging in UI - dark patterns.

While some websites do this to improve the loading time of individual pages, I’m pretty sure many websites are using this dark pattern just to increase page views and increase revenue driven by ads - the more pages you have, the more ads you can show, not to mention accidental scrolling and links to other pages.


20. Obscured Pricing 

This pattern is used to make it hard for users to compare prices between alternatives.
It’s often done by hiding the product price when it’s listed in search results and force the users to drill down to see product details and price (back and forth).
In airlines, the obscuration is done by hiding the breakdown prices of the trip, preventing the option to compare apples to apples when checking other alternatives.



Summary: 

Companies use dark patterns in order to achieve small wins, short term KPIs improvements and fake virality. but using dark patterns is unethical and doesn’t pay off in the long term.
It seems like it may achieve some positive results in the short term, but returns won’t ever be long-lasting. In addition, the negative effects on reputation and affinity may ultimately be much bigger than the short term benefits, and for most business owners and product leaders, keeping the long term reputation and building a positive brand should be much more important.

Hope you enjoyed this piece, and most importantly, if I forgot a noticeable villain in my photos - do let me know…

Before you go, check out the following:

Don't forget to subscribe to the mobile spoon and get my occasional posts directly to your inbox.
If you're not an email person - you can follow me on Twitter instead.  

Comments

Gil Bouhnick The Mobile Spoon
Brol9 said…
dude, your posts keep getting better and better.
keep it up!
Gil Bouhnick The Mobile Spoon
Mr. UX said…
The dropbox example goes beyond UI patterns, it sounds like a malicious plan...
Gil Bouhnick The Mobile Spoon
Anonymous said…
In some situations, it is much better to rely on hooks.
Gil Bouhnick The Mobile Spoon
Anonymous said…
Touche. Outstanding arguments. Keep up the amazing work.
Gil Bouhnick The Mobile Spoon
Anonymous said…
This site was... how do I say it? Relevant!! Finally I have found something that helped me.
Appreciate it!
Gil Bouhnick The Mobile Spoon
Anonymous said…
Some of those UI patterns are now illegal thanks to gdpr - but many websites still use them.
This is a very good list.