{"id":5128,"date":"2021-06-03T12:00:00","date_gmt":"2021-06-03T10:00:00","guid":{"rendered":"https:\/\/careerfoundry.inbearbeitung.de\/en\/blog\/uncategorized\/dark-patterns-ux\/"},"modified":"2021-08-05T11:48:00","modified_gmt":"2021-08-05T09:48:00","slug":"dark-patterns-ux","status":"publish","type":"post","link":"https:\/\/careerfoundry.inbearbeitung.de\/en\/blog\/ux-design\/dark-patterns-ux\/","title":{"rendered":"What Are Dark Patterns in UX Design?"},"content":{"rendered":"<p>A <strong>dark pattern<\/strong> is a deceptive user experience that takes advantage of the way people habitually use websites and apps in order to get users to do something they didn\u2019t intend to.<\/p>\n<p>The term \u201cdark patterns\u201d was coined in 2010 by Harry Brignull, a user experience specialist, when he also started a <a href=\"https:\/\/www.darkpatterns.org\/\" target=\"_blank\" rel=\"noopener\">website dedicated to naming different dark patterns<\/a> and calling out companies that use them. He\u2019s been busy ever since. Brignull\u2019s reasoning for wanting to spotlight dark patterns is simple. As he explains:<\/p>\n<p>\u201cWhen you use websites and apps, you don\u2019t read every word on every page\u2014you skim read and make assumptions. If a company wants to trick you into doing something, they can take advantage of this by making a page look like it is saying one thing when it is in fact saying another. You can defend yourself by learning about dark patterns\u2026\u201d<\/p>\n<p>In this guide, we\u2019ll explore why companies use dark patterns, describe the 12 different kinds of dark patterns identified by Brignull, and explain what to do instead of using these dark patterns.<\/p>\n<ol>\n<li><a href=\"#why-do-companies-use-dark-patterns\">Why do companies use dark patterns?<\/a><\/li>\n<li><a href=\"#kinds-of-dark-patterns\">Kinds of dark patterns<\/a>\n<ul>\n<li><a href=\"#friend-spam\">Friend spam<\/a><\/li>\n<li><a href=\"#forced-continuity\">Forced continuity<\/a><\/li>\n<li><a href=\"#disguised-ads\">Disguised ads<\/a><\/li>\n<li><a href=\"#confirmshaming\">Confirmshaming<\/a><\/li>\n<li><a href=\"#bait-and-switch\">Bait and switch<\/a><\/li>\n<li><a href=\"#hidden-costs\">Hidden costs<\/a><\/li>\n<li><a href=\"#roach-motel\">Roach motel<\/a><\/li>\n<li><a href=\"#privacy-zuckering\">Privacy zuckering<\/a><\/li>\n<li><a href=\"#misdirection\">Misdirection<\/a><\/li>\n<li><a href=\"#price-comparison-prevention\">Price comparison prevention<\/a><\/li>\n<li><a href=\"#trick-questions\">Trick questions<\/a><\/li>\n<li><a href=\"#sneak-into-basket\">Sneak into basket<\/a><\/li>\n<\/ul>\n<\/li>\n<li><a href=\"#what-to-do-instead-of-using-dark-patterns\">What to do instead of using dark patterns<\/a><\/li>\n<li><a href=\"#key-takeaways\">Key takeaways<\/a><\/li>\n<\/ol>\n<p><img decoding=\"async\" title=\"Dark Patters in UX: Why companies use them\" src=\"\/en\/wp-content\/uploads\/old-blog-uploads\/darkpatterns-uxdesign-why-min.jpg\" alt=\"A man sitting at an office workstation with his hand on his head, staring at his laptop in frustration\" \/><\/p>\n<p>Photo by <a href=\"https:\/\/unsplash.com\/@punttim?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText\" target=\"_blank\" rel=\"noopener\">Tim Gouw<\/a> on <a href=\"https:\/\/unsplash.com\/s\/photos\/frustrated-tech?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText\" target=\"_blank\" rel=\"noopener\">Unsplash<\/a><\/p>\n<h2 id=\"why-do-companies-use-dark-patterns\">1. Why do companies use dark patterns?<\/h2>\n<p>In theory, a UX designer\u2019s job is to champion the user, creating user interfaces that enable them to seamlessly navigate through information and tasks. In practice, however, <a href=\"https:\/\/www.fastcompany.com\/3060553\/why-dark-patterns-wont-go-away#:~:text=Dark%20patterns%20might%20result%20in,brands%20trying%20to%20retain%20customers.\" target=\"_blank\" rel=\"noopener\">UX designers work for managers<\/a> who are focused on growth and numbers, leading them to demand designers implement dark patterns. The managers\u2019 reasoning is simple: dark patterns work, at least in the short-term. And for managers tasked with meeting specific metrics, like doubling the number of user accounts on a social media platform, using dark patterns enables them to meet that goal quickly without having to spend time coming up with a solution that would appeal to users.<\/p>\n<h2 id=\"kinds-of-dark-patterns\">2. Kinds of dark patterns<\/h2>\n<p>There are\u00a0<a href=\"https:\/\/www.darkpatterns.org\/types-of-dark-pattern\" target=\"_blank\" rel=\"noopener\">12 kinds of dark patterns<\/a>, and it\u2019s best to avoid all of them: Friend spam, forced continuity, disguised ads, confirmshaming, bait and switch, hidden costs, roach motel, privacy zuckering, misdirection, price comparison prevention, trick questions, and sneak into basket.<\/p>\n<p>Now if the names aren\u2019t enough to have you intrigued, let\u2019s look at each of these in a little more detail. Chances are you\u2019ve encountered most of these in the not-too-distant past.<\/p>\n<h3 id=\"friend-spam\">Friend spam<\/h3>\n<p><img decoding=\"async\" title=\"Dark Patters in UX: Friend spam\" src=\"\/en\/wp-content\/uploads\/old-blog-uploads\/darkpatterns-uxdesign-friendspam-min.jpg\" alt=\"Screenshot of Apple icons for Google, email, and phone, with a badge app icon indicating 20 unread emails\" \/><\/p>\n<p>Photo by\u00a0<strong><a href=\"https:\/\/www.pexels.com\/@tdcat?utm_content=attributionCopyText&amp;utm_medium=referral&amp;utm_source=pexels\" target=\"_blank\" rel=\"noopener\">Torsten Dettlaff<\/a><\/strong>\u00a0from\u00a0<strong><a href=\"https:\/\/www.pexels.com\/photo\/black-and-gray-digital-device-193003\/?utm_content=attributionCopyText&amp;utm_medium=referral&amp;utm_source=pexels\" target=\"_blank\" rel=\"noopener\">Pexels<\/a><\/strong><\/p>\n<p>A social media platform or other product asks for your email address or permission to access your social media account in exchange for a desired outcome like finding your friends or letting you access a service. In truth, however, the product spams all the contacts it\u2019s been given access to with messages that look like they came from you.<\/p>\n<p>This dark pattern was famously <a href=\"https:\/\/www.fastcompany.com\/3051906\/after-lawsuit-settlement-linkedins-dishonest-design-is-now-a-13-million-problem\" target=\"_blank\" rel=\"noopener\">used by LinkedIn<\/a>. When someone signed up for LinkedIn, the social media site used to spam all the new users\u2019 contacts with invitations to join the social network. Users weren\u2019t able to opt out and this led to a class-action lawsuit that eventually required LinkedIn to pay a $13 million penalty for this deceptive practice.<\/p>\n<h3 id=\"forced-continuity\">Forced continuity<\/h3>\n<p>If you\u2019ve signed up for a streaming service recently, you\u2019ve probably run into this dark pattern where your credit card is automatically charged as soon as a free trial comes to an end. While the companies who do this would argue that it enables users to continue to access their service uninterrupted, users receive no warning that their card is about to be charged, often causing them to be billed unexpectedly. Streaming platforms like Netflix, Hulu and DisneyPlus use this tactic, but it\u2019s common with other services that offer free trials.<\/p>\n<h3 id=\"disguised-ads\">Disguised ads<\/h3>\n<p>You\u2019ve likely seen a disguised ad on a website or app even if you didn\u2019t know what it was. And that\u2019s the whole point! Disguised ads look like the content on the rest of a site, making users more likely to click on them.<\/p>\n<h3 id=\"confirmshaming\">Confirmshaming<\/h3>\n<p>This dark pattern was extremely popular a year or two ago. The goal was to get the user to opt into doing something, like sharing their email or signing up for a newsletter, by making the alternative choice sound undesirable. For example, an e-commerce site might offer a discount on a users\u2019 first order in exchange for their email address. If the user doesn\u2019t want to share their email address, they have to click on an option that says something like, \u201cNo thank you, I don\u2019t like saving money.\u201d<\/p>\n<h3 id=\"bait-and-switch\">Bait and switch<\/h3>\n<p><img decoding=\"async\" title=\"Dark Patters in UX: Bait and switch\" src=\"\/en\/wp-content\/uploads\/old-blog-uploads\/darkpatterns-uxdesign-baitandswitch-min.jpg\" alt=\"A woman holding a mobile phone, frustrated with the app she's using\" \/><\/p>\n<p>Photo by\u00a0<strong><a href=\"https:\/\/www.pexels.com\/@alex-green?utm_content=attributionCopyText&amp;utm_medium=referral&amp;utm_source=pexels\" target=\"_blank\" rel=\"noopener\">Alex Green<\/a><\/strong>\u00a0from\u00a0<strong><a href=\"https:\/\/www.pexels.com\/photo\/annoyed-black-woman-having-video-chat-on-smartphone-at-home-5699823\/?utm_content=attributionCopyText&amp;utm_medium=referral&amp;utm_source=pexels\" target=\"_blank\" rel=\"noopener\">Pexels<\/a><\/strong><\/p>\n<p>As the name suggests, this pattern occurs when a user takes an action expecting one outcome, but instead something else happens. Windows customers ran into a bait and switch in 2016 when clicking on the \u201cX\u201d button of a pop-up asking users to update to Windows 10. But instead of closing the pop-up as expected, clicking the \u201cX\u201d started the update. Given up until this point, \u201cX\u201d was synonymous with \u201cclose,\u201d users did exactly what they thought they should to get rid of the pop-up. Microsoft\u2019s exploitation of this standard behavior understandably created a backlash with its users.<\/p>\n<h3 id=\"hidden-costs\">Hidden costs<\/h3>\n<p>This dark pattern happens when, during the final step of an e-commerce check-out process, additional fees and other costs are added to your order. For example, if you purchase tickets on TicketMaster, the site initially shares only the price of the tickets with you. When you check out however, the cost you\u2019re required to pay goes up substantially as things like service fees and delivery charges are tacked onto the ticket price.<\/p>\n<h3 id=\"roach-motel\">Roach motel<\/h3>\n<p>Named after the product that lures roaches in but makes it impossible for them to get out, a roach motel dark pattern lets users do something easily, like sign up for an account, but makes it extremely difficult to get out of the situation. For example, while it\u2019s simple to sign up for an account on sites like Facebook or LinkedIn, it\u2019s substantially more challenging to figure out how to cancel those accounts.<\/p>\n<h3 id=\"privacy-zuckering\">Privacy zuckering<\/h3>\n<p>In its early days, Facebook was known for causing users to inadvertently share more personal\u00a0 information with their network than they intended, which is why this dark pattern is named for Mark Zuckerberg, the CEO of Facebook. Brignull observes that because of user backlash and work by privacy groups, privacy zuckering is now mostly done through data brokering which makes it far less obvious. With data brokering, you agree to terms and conditions that allow companies to sell the data they collect on you.<\/p>\n<h3 id=\"misdirection\">Misdirection<\/h3>\n<p><img decoding=\"async\" title=\"Dark Patters in UX: Misdirection\" src=\"\/en\/wp-content\/uploads\/old-blog-uploads\/darkpatterns-uxdesign-misdirection-min.jpg\" alt=\"Screenshot of an Amazon Prime workflow to cancel an account\" \/><\/p>\n<p>Screenshot by <a href=\"https:\/\/www.cnet.com\/how-to\/how-to-cancel-your-amazon-prime-subscription-and-close-your-account\/\" target=\"_blank\" rel=\"noopener\">Jason Cipriani\/CNET<\/a><\/p>\n<p>Like other forms of misdirection, this dark pattern uses design to focus your attention on one thing in the hopes you\u2019ll overlook something else. For example, if you\u2019re a member of Amazon Prime and want to cancel your account, you\u2019re taken to a page that spotlights images and information about all the benefits you get with Prime. What you may miss is the small, plain boxes at the top of the screen that enable you to change your plan or cancel it entirely.<\/p>\n<h3 id=\"price-comparison-prevention\">Price comparison prevention<\/h3>\n<p>Many websites give you the ability to compare the prices of similar products, however when they don\u2019t, it\u2019s because this dark pattern is at work. This is yet another dark pattern LinkedIn is guilty of. The company offers a free trial of several different versions of LinkedIn premium but none of the options include pricing information. If that weren\u2019t enough, even when you sign up, the pricing information provided is vague.<\/p>\n<h3 id=\"trick-questions\">Trick questions<\/h3>\n<p>You\u2019ve likely filled out many forms on websites and apps, which has made you comfortable skimming them and making assumptions about the information you\u2019re being asked to provide. This dark pattern takes advantage of this by tricking users into answering a question in a way they didn\u2019t intend. When supporters donated to the Donald Trump campaign, many thought they were making a one-time donation, but their accounts were later <a href=\"https:\/\/www.nytimes.com\/2021\/04\/03\/us\/politics\/trump-donations.html\" target=\"_blank\" rel=\"noopener\">charged for additional donations<\/a>. The problem? A pre-checked box stating that the donation would be recurring. So users would need to spot the pre-checked box, read the disclaimer, and un-check the box if they wanted to make a one-time donation.<\/p>\n<h3 id=\"sneak-into-basket\">Sneak into basket<\/h3>\n<p>This dark pattern slips an extra item into a user\u2019s e-commerce cart, usually by including a radio button or checkbox that the user has to uncheck in order to avoid the additional charge. This pattern can be seen when companies include add-on services like privacy protection or trip protection in a user\u2019s basket, which they then must notice and opt out of.<\/p>\n<h2 id=\"what-to-do-instead-of-using-dark-patterns\">3. What to do instead of using dark patterns<\/h2>\n<p><img decoding=\"async\" title=\"Dark Patters in UX: What to do instead\" src=\"\/en\/wp-content\/uploads\/old-blog-uploads\/darkpatterns-uxdesign-instead-min.jpg\" alt=\"Two designers sitting outside on the grass, working on a laptop and taking notes\" \/><\/p>\n<p>Photo by\u00a0<strong><a href=\"https:\/\/www.pexels.com\/@armin-rimoldi?utm_content=attributionCopyText&amp;utm_medium=referral&amp;utm_source=pexels\" target=\"_blank\" rel=\"noopener\">Armin Rimoldi<\/a><\/strong>\u00a0from\u00a0<strong><a href=\"https:\/\/www.pexels.com\/photo\/cheerful-ethnic-male-students-working-on-project-in-park-5553075\/?utm_content=attributionCopyText&amp;utm_medium=referral&amp;utm_source=pexels\" target=\"_blank\" rel=\"noopener\">Pexels<\/a><\/strong><\/p>\n<p>Dark patterns are still in wide use and they can have an <a href=\"https:\/\/www.fastcompany.com\/3060553\/why-dark-patterns-wont-go-away#:~:text=Dark%20patterns%20might%20result%20in,brands%20trying%20to%20retain%20customers.\" rel=\"noopener\">insidious impact on user experiences<\/a>, destroying user loyalty, creating ill will and causing brands to lose customers.<\/p>\n<p>Instead of using dark patterns, UX designers should argue for treating customers with respect by giving them choices that are transparent and clear. While this won\u2019t lead to the same short-term gains as a dark pattern, it will lead to a less frustrating and much improved <a href=\"https:\/\/careerfoundry.inbearbeitung.de\/en\/blog\/ux-design\/what-is-cx\/\" target=\"_blank\" rel=\"noopener\">customer experience (CX)<\/a>.<\/p>\n<p>(If CX is a new term for you, learn more here: <a href=\"https:\/\/careerfoundry.inbearbeitung.de\/en\/blog\/ux-design\/difference-between-ux-and-cx\/\">The difference between UX and CX<\/a>.)<\/p>\n<p>In the long-term this will also help companies retain customers, ultimately giving them a competitive advantage. Customers are far more likely to stay with companies, brands, and product experiences that are transparent, authentic, and trustworthy!<\/p>\n<h2 id=\"key-takeaways\">4. Key takeaways<\/h2>\n<p>This article introduced you to the different kinds of dark patterns, why they work, and why they ultimately may backfire. To sum up:<\/p>\n<ul>\n<li>Dark patterns are deceptive user experience designs that exploit our typical behavior on websites and apps to get us to do something we didn\u2019t intend.<\/li>\n<li>Harry Brignull coined the term in 2010 and runs a website dedicated to uncovering them.<\/li>\n<li>Companies use dark patterns because they work in the short term.<\/li>\n<li>Brignull has identified 12 kinds of dark patterns: Friend spam, forced continuity, disguised ads, confirmshaming, bait and switch, hidden costs, roach motel, privacy zuckering, misdirection, price comparison prevention, trick questions and sneak into basket.<\/li>\n<li>Dark patterns ultimately don\u2019t work in the long-term because they create ill will and destroy customer loyalty.<\/li>\n<\/ul>\n<p>Instead, UX designers should ensure users are respected by giving them transparent choices. This will lead to a better user experience overall, and will do wonders for customer retention by simply saying no to the risk of compromising the trust your users (want to) have in your product.<\/p>\n<p>Learn more about UX design principles in these articles:<\/p>\n<ul>\n<li><a href=\"https:\/\/careerfoundry.inbearbeitung.de\/en\/blog\/ux-design\/serial-position-effect\/\">What is the serial position effect?<\/a><\/li>\n<li><a href=\"https:\/\/careerfoundry.inbearbeitung.de\/en\/blog\/ux-design\/10-ux-laws-principles\/\">10 UX design principles that will change the way you see the world<\/a><\/li>\n<li><a href=\"https:\/\/careerfoundry.inbearbeitung.de\/en\/blog\/ux-design\/usability-heuristics\/\">11 Usability heuristics every designer should know<\/a><\/li>\n<\/ul>\n<p>(Cover image credit:\u00a0<strong><a href=\"https:\/\/www.pexels.com\/@yankrukov?utm_content=attributionCopyText&amp;utm_medium=referral&amp;utm_source=pexels\" rel=\"noopener\">Yan Krukov<\/a><\/strong>\u00a0from\u00a0<strong><a href=\"https:\/\/www.pexels.com\/photo\/photo-of-woman-using-cellphone-while-looking-serious-4458396\/?utm_content=attributionCopyText&amp;utm_medium=referral&amp;utm_source=pexels\" rel=\"noopener\">Pexels<\/a><\/strong>)<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Dark patterns are deceptive UX practices that take advantage of users&#8217; assumptions and habits in order to achieve some company objective. Here are 12 types of dark patterns and how to avoid them.<\/p>\n","protected":false},"author":64,"featured_media":5129,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_lmt_disableupdate":"no","_lmt_disable":"","footnotes":""},"categories":[2],"tags":[],"class_list":["post-5128","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-ux-design"],"acf":{"homepage_category_featured":false},"modified_by":"Emerson Schroeter","_links":{"self":[{"href":"https:\/\/careerfoundry.inbearbeitung.de\/en\/wp-json\/wp\/v2\/posts\/5128","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/careerfoundry.inbearbeitung.de\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/careerfoundry.inbearbeitung.de\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/careerfoundry.inbearbeitung.de\/en\/wp-json\/wp\/v2\/users\/64"}],"replies":[{"embeddable":true,"href":"https:\/\/careerfoundry.inbearbeitung.de\/en\/wp-json\/wp\/v2\/comments?post=5128"}],"version-history":[{"count":0,"href":"https:\/\/careerfoundry.inbearbeitung.de\/en\/wp-json\/wp\/v2\/posts\/5128\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/careerfoundry.inbearbeitung.de\/en\/wp-json\/wp\/v2\/media\/5129"}],"wp:attachment":[{"href":"https:\/\/careerfoundry.inbearbeitung.de\/en\/wp-json\/wp\/v2\/media?parent=5128"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/careerfoundry.inbearbeitung.de\/en\/wp-json\/wp\/v2\/categories?post=5128"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/careerfoundry.inbearbeitung.de\/en\/wp-json\/wp\/v2\/tags?post=5128"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}