686: Todd Libby on Deceptive Patterns  ## Metadata - Author: [[ShopTalk]] - Full Title: 686: Todd Libby on Deceptive Patterns - Category: #podcasts - URL: https://share.snipd.com/episode/7eb45bbe-5b89-4679-8640-8fc2927512cf ## Document Notes ## Highlights - **Don't Use Fake Time Pressure** - Avoid fake countdowns and clearly distinguish essential timers from artificial ones. - Refresh a page to check: if the timer resets, the urgency is likely deceptive. Transcript: Todd Libby One of them would be artificial pressure or time pressure. And that's fear of missing out. You know, the old FOMO. That is one of them. That's great. Chris Coyier Okay. So you go to some website and it says you get 20% off and it starts a timer for you. And it's like you better, which is, you know, it's just, this is for the shorts too. It's bullshit. That's not cool. I know how you started it. It's a set interval in JavaScript. It's irrelevant to your business. So you're going to put that in a guideline that says like that is wrong. And is it wrong because it just is wrong? Is it like wrong because almost like it's in the Bible wrong or something? It it does feel like i don't know that that's a squishy it's a squishy it's like a moral judgment or something almost we have an unofficial as of right now kind of terminology with essential Todd Libby Time and artificial time artificial being the bad ones essential being you know like we have a timer for you know this show and we have an hour you know total and we're at the you know 15 Minute mark you have 45 that's an essential timer. Dave Rupert Like when I buy movie tickets, it's like, you got 10 minutes to finish this transaction. We're going to release these movie tickets. That sort of thing is essential maybe? Todd Libby With me, I'm trying to leave my bias out of this. With me, that is an essential because um you know you have that time and maybe you get sidetracked with something else you know whatever's going on over here and um you come back and the Whole process has started again um that's essential because well somebody else has grabbed your ticket but you can go in and grab another ticket you know there's not you know all the Tickets aren't gone so yeah i would consider that an essential i will give you a bad example which is there was a uh plugin for shopify called horrify and what you did in this plug-in is You made your little flash sale and you can go and set the timer and everything and then when the timer ended you could restart the the timer again and this horrify plug-in got kicked out Dave Rupert Of the Shopify plugin store. Todd Libby Hmm. Dave Rupert Just because it was like too incentive. What is it? It's like scarcity. Like it creates scarcity. Fake scarcity. Todd Libby Yeah. Yeah. A good way to check. It's just gross. Chris Coyier But you know, even if it is kind of like almost moral or something, everybody knows there's a line that that and it's hard to draw the line. So I'm glad you're drawing the line. You're doing a good job of being like essential time artificially got to use real terms and like suss this stuff out, which can be difficult because everybody knows that says like, I Don't know if a pop up came up and said, you know, you better buy these shoes because, you know, I got your family in a shed out back. Obviously, that's too far. Right. Do we all get that? Dave Rupert Well, Chris, I noticed you didn't forward my email, which about the Virgin Mary and Barack Obama being devil to five of your friends or else you will die tonight. I noticed you didn't do that. So. Chris Coyier But it's arbitrary, and how do you quantify that? Well, that's a threat, and maybe that one's easier to quantify. But a countdown timer is harder to quantify. It's like on this line where you need somebody to think through all the technicalities of this so that there isn't this squishy-ass line anymore. So anyway, thanks, Todd. Good job. Todd Libby Well, a good way to check is to refresh your browser, And if the timer resets, then you know it's bullshit. Don't tell them that. Dave Rupert They'll just set a cookie. ([Time 0:14:35](https://share.snipd.com/snip/b9f915b5-704a-47e7-9345-3c64eb4bdd86)) - **Make Consent And Unsubscribe Simple** - Use clear, straightforward wording for choices and avoid double negatives in opt-ins. - Present unsubscribe and consent options with plain language and one-click clarity. Transcript: Todd Libby More uh another one would be um and again these are in development so um no misleading wording so love this one this one is geared towards double negatives oh it's the don't not unsubscribe Yeah it's you know don't not opt me into your, uh, your newsletter or your subscription or this, that, or the other thing. So, um, yeah, yeah. Chris Coyier You never know. I, in fact, anytime I'm about to unsubscribe for something, I almost like, I almost like pull in my abdomen muscles and like pull my shoulders down. I'm like, okay, I got to focus here. What, what garbage am I in for? You know, focus up, dude. Yeah, totally. Cause there's no way it's going to be straightforward. You know, there's no way there's going to be a button that just says like, click this to unsubscribe forever. And you click it and it takes care of that promise like it every one of them is different we're in this world the every one of them has a big one for me is you know i would like to see just that Todd Libby Little toast notification or that pop up say you know allow us to collect your data yes or no instead of uh don't allow us to not collect your data right yeah you know gosh a lot of miss out Dave Rupert What's that uh want to miss out yeah exactly no i don't but yeah i do in this context you know and yeah a lot of these are towards people with cognitive disabilities or people with learning Chris Coyier Disabilities or, you know, in that realm. You know, that makes it so much worse. Like, that's what the designer of it was thinking about. Absolutely. How can we dupe these people? Todd Libby That's right. Yeah. Dave Rupert Well there's like a whole industry on like preying on the elderly to like just hand over money it's called politics but but uh i guess does this also include like examples like no i hate Kittens or whatever, you know, like, like unsubscribe. Yes. No, I hate kittens. That sort of thing. Chris Coyier Would a button that says, no, I hate kittens be covered by. Todd Libby No, I do not, not want to hate kittens. That, that guideline would cover that kind of. Chris Coyier That would cover it because it's because you don't know what you're clicking, but if it was more clear. Todd Libby Yeah. Okay. Well, so there's still some gray line a lot of these two are just it's not just one pattern it's like two or three in one so you know that button that button may be a you know a button that leads You to another page that says, oh, here, here's where you sign up for kitten haters or what have you. So a lot of these are packaged, you know, roach motels, for instance. And if, you know, nobody knows what a roach motel is, it's basically the steps, you know, that a user has to take to unsubscribe from a newsletter or or from a service because they lead Chris Coyier You into that trap and they keep you there and they wear you down but you don't crumb all you don't crawl out exactly yeah um you know i wonder if there's if like the languages could be clear But the pattern is still deceptive maybe this is covered by another one. But here's an example is that sometimes I click and unsubscribe and I unsubscribes are different than they're still nefarious. But like the worst thing that happens is you're still subscribed to a newsletter. So it's like, to me, it's bad, but you know, not on the scale of badness of other deception. But anyway, you click a link from the newsletter, and it unsubscribes you just via the, like, the get request. Like, just the URL has already done the job of unsubscribing you. And then there's a button now where you land, but the button says resubscribe. But you have to catch it because, you know, you have to, like, notice that it doesn't say unsubscribe because so many other ones you have to click the button that says unsubscribe. Now these new ones say resubscribe and you've clicked it and you're trained that you should click the button on where you land. But if you click it, now you're back on. It's like, ah, but they couldn't be hit by your rule because the language on the button was correct. Todd Libby Like it's doing what the button says it's going to do yes and so i should also mention that these that were working on these these guidelines they have to be testable so that's that's the Big thing they need to be testable. So that said, your button that you're talking about, that's definitely something that we are focusing on as we need to figure out what we can do as far as those kinds of buttons go. ([Time 0:20:31](https://share.snipd.com/snip/e1004fe5-6455-4ba0-a63e-b70a95592273)) - **Focus On Misinformation In User Flows** - Misinformation guidance targets interactive flows rather than broad published claims. - WCAG aims to block deceptive steps inside processes like forms and cancellations, not general marketing lies. Transcript: Todd Libby Another one this is one that's a monumental task uh no misinformation no misinformation okay well you're coming after youtube like that and it's uh The entire social networks here. Dave Rupert Exactly. Exactly. Chris Coyier But it seems okay to me to put the onus of adhering to that on people that make the content and the platforms and stuff. I don't know. Do you need to describe what misinformation is? We do. Todd Libby I'm glad you asked that question because uh basically what it what this entails is a process with and that process being can a process be completed without navigating through in misinformation Can a user complete a form without having some sort of uh of you know side sidetrack to get them to you know do something that will financially benefit this company uh instead of you know I want to fill out i have to fill out this form okay i have to fill out this form um to unsubscribe or to cancel my account hopefully not through amazon because that's a seven-step process But you know check if there's a process make sure it doesn't include misinformation or redirection and redirection. Chris Coyier So this is about like something interactive that you're doing. Todd Libby This doesn't cover passive. Chris Coyier You can publish a website that says these are the world's best sandals. And even though they're not the world's best sandals, that's not misinformation. You're not asking anybody to do anything there. You're just lying. Todd Libby Well, that is right. Chris Coyier That's more regulatory and we don't want to get into the regulatory stuff in the w3c so this is you are performing an action on a website that yeah okay and there can be no misinformation During that process which is like filling out a form yeah ([Time 0:26:21](https://share.snipd.com/snip/ef7bf451-7c45-4175-a146-44559ded872a)) - **Avoid Hidden Pre-Selections** - Never pre-check boxes that change privacy or billing without explicit consent. - Design defaults so users actively opt into recurring payments or data sharing. Transcript: Todd Libby Huh Uh, another one is no hidden preselections. So when I give a talk on deceptive patterns, the most famous, well, in famous, infamous, uh, examples are from the Trump 2020 campaign where people were taken for light, life savings Because they had a pre-selected box. And I'm trying to remember back here that said, you know, the box was checked and it said something like, you know, the radical left. Let me see if I can find this here. Oh okay the box is checked it's in bright yellow and it says we need to know we haven't lost you to the radical left if you uncheck this box we will have to tell trump you're a defector and Sided with the dems check this box and we can win back the house and get trump to run 2024. And then underneath. Chris Coyier Wow, that's a very complicated checkbox. You have a lot to read. Oh, there are even more wordier examples of these. Todd Libby But this one also has underneath, make this a monthly recurring donation. Oh, I see. So the problem here is, well, oh, my God, I want to, if I'm one of his supporters, I don't want to uncheck that box. But yet it's going to take money out of my bank account or my credit card every month. Chris Coyier So it's either give us a monthly recurring donation or you're part of the radical left. That's what that checkbox was. Oh my God. The checkbox is the ultimate manifestation of like either or like, like you're on one side or the other politics. Oh, oh my God. That was rough. That's real. Dave Rupert Oh my gosh. That is real. Yep. It's real. Yeah. I'm looking at websites. Very real. So the verge reported on it. Well, that's how we know it's real here. Chris Coyier Yeah. And you, you, you would be forgiven for not even making it to the end of that text to read it all. You know, you're just like, yada, yada, yada, radical left, uncheck the box, got it, you know, or whatever, and missed the part where you're trying to give him $1,000 and you just gave Him $1,000 for the rest of your life. Todd Libby Was news uh news items and articles and and that i saw uh where people were losing hundreds of thousands of dollars oh my gosh of their life yeah because that might not be the only one you Dave Rupert Get too right like you might get a lot of those yeah oh they'll they they peppered people ([Time 0:28:32](https://share.snipd.com/snip/590bb923-7255-43c7-bd54-4aaef5c22dee)) - **Keep Overlays Dismissible And Nonblocking** - Do not let overlays block essential page content like prices or controls. - Make overlays dismissible, movable, or non-obstructive for task completion. Transcript: Todd Libby Yes yeah yeah and another one i think is this our i believe this is one of the last okay four five four yeah uh no obstruction this one brings a smile to my face because um overlay companies Be on the lookout because this handles not only you know no obstructions like uh door dash when they had um when you were on the mobile app they had a tool tip that covered the price of the You know get your food extra quick you know 299 which that's not really a thing because i tried that once as an experiment and it was still 30 minutes. Didn't, yeah, didn't speed it up. They weren't here at 15. But, you know, no obstructions as far as, you know, don't put a tool tip in the way of a price so that somebody knows, oh this is going to add another 399 to the to the total bill or make it movable Or make it easily dismissible you know don't hinder visual elements on the page please the other one is a clearly dismissible content overlays Ooh, juicy. Please make it so that your content in your overlay does not obscure or obstruct a task or content, for that matter. Is it dismissible? Is it movable for task completion? And again, does it hinder visual elements if it does it's a fail if it's not if it's not dismissible it's a fail if it's not that's gonna be a tricky test you know you're gonna need you need Chris Coyier Cypress to test that one you know you gotta render the page to look that's okay it's still testable um very cool. ([Time 0:34:30](https://share.snipd.com/snip/11f59f5a-d66e-42c2-ae2c-eb51a863a754)) - **Accessibility Framing Adds Legal Teeth** - Deceptive patterns disproportionately harm people with disabilities and cognitive differences. - Framing these problems under accessibility adds legal teeth and protects vulnerable users. Transcript: Dave Rupert I think, Chris, I see a link in our little show, not think to like Brad Frost, like death to bullshit, you know, like which is like, you know, pop ups and overlays and ads and, you know, just Websites are just becoming Cory Doctorow style and shitified, you know. And I think having standards claws that back a bit, you know, to give the user agency. And I think I love that it's under the accessibility umbrella, like the WCAG umbrella, because A, that has teeth, like legal teeth. That's cool. But then, two, I think, you know, who does this impact the most? It's usually people with disabilities, like unable to dismiss an overlay, somebody with motor control or keyboard only or something. That's a problem for them. You know, like if you do a bad job, you've, you like, I get frustrated and I'm able-bodied and have high dexterity and can mouse click that little 10 by or whatever, 4 by 4x on the ad. I can do that, right? But if you can't do that, that's awful. You're just stuck with it. It under this umbrella is awesome just because it definitely does impact people on, you know, on the disabled spectrum that it's kind of a wide spectrum, but like, you know, more, right. It's in the cognitively, like you were saying, I mean, maybe you can talk more about that, but like, you know, we used elderly as an example, but you know, you could be, you know, MR or autistic Or, you know, or kind of a wide spectrum. I mean, even neurodiversity, like ADHD or something like, you know, like, you know, all these things are kind of harder for people in those contexts. Just people, you know, who are like struggling to get through your website because you've made it difficult on purpose. ([Time 0:36:52](https://share.snipd.com/snip/4b83c1b8-b61d-4aeb-bc62-0c22a5fad42e)) - **Intent Matters: Anti-Pattern Vs. Deception** - Distinguish accidental bad UX (anti-patterns) from deliberate deception (deceptive patterns). - WCAG work defines deceptive patterns as intentional designs that force or trap users toward harmful outcomes. Transcript: Chris Coyier I mean, it's, it's a, it's a lot of both. Todd Libby Um, so originally in the functional needs civil group that I worked on, 2024, we had two definitions for deceptive pattern, which is with intent, and an anti-pattern, which is without Intent. Without intent being bad UX or bad design, period. And our definitions for those were an anti-pattern is an unintentional without intent design or implementation that often leads to a general decline in usability. ([Time 0:39:24](https://share.snipd.com/snip/3db1fe8e-de90-418f-8353-f41a1c5653d5)) - **Deceptive.Design Is A Go-To Resource** - Todd frequently uses deceptive.design and Harry Brignull's book as core research resources. - He praises the book and recommends it as a practical starting point for pattern research. Transcript: Todd Libby And so I highly recommend not only going to that website, but also buying the book that he has, you know, and I, I'm not receiving any kickbacks for the book either. I just think it's, I have it on my bookshelf. It's a great book. Chris Coyier Lots of great, clearly a strong advocate for what's going on here is made kind of his, his, his, his career around it in a way is you'd think, you know, like, I don't know, you don't have To put words in his mouth, but I'm assuming he would be very supportive of this getting into the official accessibility guidelines of the internet, yeah. Todd Libby I have spoken with Harry once. We had a, it was not a great call as far as technical terms go because you know he's over in the you know he's over in england i'm here in the states so it was kind of oh there's some choppy zoom Stuff going on exactly let's got to go to china and back let me tell us right uh we we did have a great conversation. Matter of fact, his book was originally called Dark Patterns, but after consulting. He changed it. Well, not just me, but there were other people involved, too. I'm no catalyst, mind you, but he decided to change that, which I thought was really great. I'm really glad that he decided to change the title and it was almost at the at the very last minute before the book got printed so i oh nice i didn't have to change the book it's the book is Just called deceptive patterns and it's always has been oh that's great what a good i think i think he would be i haven't had the chance or the pleasure to talk to him since, but I think he Would be glad that it's being introduced into WCAG 3. ([Time 0:43:29](https://share.snipd.com/snip/265679a6-068a-4aa9-a877-1e2adee885e6)) - **Infinite Scroll Removes Stopping Cues** - Todd calls infinite scroll a personal 'bane' because it removes stopping cues and hides footers. - He prefers pagination or a visible 'load more' button to restore user control. Transcript: Todd Libby That scrolled on for miles, felt like I was running a marathon, trying to get to a footer that I could never get to. And then I'd have to call my client and say, do you have a page where I can access a footer? Chris Coyier I get it. It's always amazing when you can see the footer and then it loads more stuff. You're like, you made it. You designed the footer but you can't actually get to it. Todd Libby It's funny. I am still pushing for that one because of course there's a lot of implications behind that. Oh my gosh. Make infinite scroll illegal? That's a good t-shirt. It does, but if that is a good idea maybe i should throw that into my shop my my t-shirt shop oh yeah yeah but i have in my new talk which i'm giving at magnolia conf uh in a couple weeks as a matter Of fact hopefully i'll be able to fly down there to jackson mississippi but the the inventor who now leads the what is it called the center for humane technology uh is a raskin um he's got A podcast and everything he i i did some research and he said in an interview that, and I quote, I regret that I didn't think more about how this thing would be used. And I know as a designer that by taking away the stopping cue, I can make you do what I want you to do. And he went on to say, I contributed to this, and I have been complicit. And then he went on say to and he went on to end it we are losing control of the tools we made which i couldn't agree more with um he is my arch enemy at it in a little playful manner but um i you Know i'm saying you know how about pagination how about you know you get to a certain stopping point and you have that load more button exactly um that's the kind of anti patterns that That you know and i'm not saying infinite scrolling is deceptive because it's not but it's an anti-pattern. I think it's just bad UX period. ([Time 0:50:36](https://share.snipd.com/snip/6367cf54-01fe-4a62-abd9-916194cac294))