Show HN: Interactive game teaching dark patterns in UX design

games.productartistry.com

108 points · rohandehal · 11 hours ago

I built this educational game to help people identify and understand dark patterns in digital products. It features 10 interactive scenarios based on real-world examples.

The game includes:

• Interactive pattern recognition scenarios • Explanations of psychological principles • Simulated real-world examples with guided feedback

Built with Next.js, TypeScript, and Tailwind.

I'd especially appreciate feedback on the educational approach and scenario design.


45 comments
csallen · 6 hours ago
Cool idea, pretty good execution, but your UI is confusing.

1. There's so much happening on the screen between your app's UI and the fake UI with the dark patterns that it's confusing. IMO you should show the objective first, and then let the user click to reveal the fake UI and challenge. For example, simply show, "Challenge #1 — Find the button that actually lets you cancel the subscription." Then have a button that says, "Start Challenge." When that button is clicked, then reveal the UI.

2. Give me some context. If you just say, "Find the button that actually lets you cancel the subscription," that's not really enough. You should set the scenario. "Imagine you're subscribed to an app, but you don't want to be subscribed anymore. So you sign into the app and click the cancel button. It loads a new screen. How do proceed from here to finalize your cancelation?"

3. Don't tell me the answer in advance. Naming the first challenge "Color Confusion" tells me the answer.

4. Don't auto-advance steps. I had no idea that I auto advanced. I changed tabs, then came back, then was scrolling down looking for the next step button. Just let me manually click to the next step as a user. Preferably at the bottom, near the pattern explanation.

Show replies

rglover · 15 minutes ago
While this was helpful and well done, I find it incredibly amusing that after I popped in my email, I was hit with very similar dark patterns trying to get me to pay for a Substack subscription, follow people, and share it.

Touché?

bbm1 · 8 hours ago

  I wish to opt out of receiving exclusive promotional offers and updates about products I might be interested in.

  What this means:
  When checked: They will send you marketing emails. Uncheck to stop promotional emails.

  How it tricks you:
  They use 'opt out' and 'wish' to create a double negative - saying no to opting out means saying yes to emails
Fun stuff! But I'm really unclear about this particular checkbox on lesson 9 - in my eyes, wishing is not a negative - so this is a single negative, and you would check it to not receive updates

Show replies

gs17 · 7 hours ago
It's a nice game but I have some feedback:

The first two levels want you to click the non-misleading option and then the third requires you to click the misleading option, which then has a "Report as Deceptive Marketing" button. This feels counterproductive if you're trying to teach people to not fall for dark patterns, you've just rewarded them for falling for it and punished anyone who didn't!. Then, a later level has the opposite, you see (almost) the same dialog from level 3, but you need to click the other option.

The instructions for Level 3 do say you're supposed to "find the hidden truth", but that's not necessarily what clicking the "Activate Premium Features" button would do in real life. I think it would work better if it stuck to one side of things, probably having players always try to avoid getting misled. At the end it says one of the outcomes should be "Improved muscle memory", so the goal should probably be no clicking on bad things.

This also makes it confusing what it's supposed to be simulating to me. I've never had a site offer to let me report their own promotions as deceptive (or as a later level has, "Report Bait and Switch Tactic" when you go to check out).

The "Trick Questions" level had only pre-checked checkboxes that you should uncheck (and the button tells you to uncheck all of them, there's no thought required here), I think it would work better if some needed to remain checked. It ties in to the same "muscle memory" issue, unchecking isn't guaranteed to be a good action. Similarly, it might make sense to have Basket Sneaking include a coupon code or something that you shouldn't remove from your cart, so players learn to read closely.

Show replies

avree · 4 hours ago
The forced 5 second wait time is killing me. Why not just let me click between the puzzles? Also feels like a left-to-right orientation would be easier to browse, as opposed to the mobile style stacked cards.

Show replies