我做了一个永远不让你离开的 CAPTCHA

Source: Dev.to

我做了什么

我做了一个名为 I’m Not a Robot 的假 CAPTCHA 游戏。

它的开始和普通的人机验证流程一样：

• 点击复选框
• 解答图片挑战
• 验证通过，继续你的生活

但它永远不会真正让你继续。

笑点来源于最让人恼火的真实 CAPTCHA 体验之一：你点选了所有正确的图片块，随后会不断加载更多块。有时新出现的块仍然包含你应该点击的目标，有时则不包含。有时你以为已经完成，但系统却决定你根本没有完成。

于是我把这短暂的网络挫败感变成了整个产品。这个项目故意无用、略带敌意，并且彻底致力于以最熟悉的方式浪费你的时间。

演示

在线演示： CodePen demo

自己动手试试，看看 CAPTCHA 何时会变得“个人化”。

代码

整个项目是一个轻量级的前端原型，托管在 CodePen 上。

CodePen： View the code here

我是怎么做的

我希望它先让人有熟悉感，再让人觉得荒诞。

于是我没有把它做得过于风格化或未来感，而是让它看起来像大家已经熟悉的 CAPTCHA 流程：

• 一个简单的复选框开始
• 一个蓝色的挑战标题
• 3×3 的图片网格
• 一个验证按钮
• 选中正确块后重复更换图片

在此基础上，我让交互逐渐变得荒唐。

使用的技术

• HTML
• CSS
• Vanilla JavaScript

使用 CodePen 进行托管和分享。

核心思路

整个项目最关键的交互是：当你点击一个正确的块时，它并不会保持已解决状态，而是立刻被新的块替换，就像那些真实的图片 CAPTCHA 一样，似乎更想考验你的耐心而不是人性。这个替换循环就是笑点所在。

为了让它更具可信度，我这样实现：

• 只有被点击的块会被替换
• 有些替换块会包含另一个消防栓
• 有些替换块则不包含
• 提示会随时间慢慢变得更荒诞
• 挑战不断假装你快完成了
• 最终页面会因你坚持而“惩罚”你

我还直接在代码中生成了伪照片块图像，使项目保持自包含，便于在没有外部资源的情况下运行。

奖项类别

我主要提交此作品争夺 Best Ode to Larry Masinter，并希望还能获得 Community Favorite。

为什么争夺 Best Ode to Larry Masinter

• 它故意无用
• 把一种熟悉的互联网标准体验变成荒诞的东西
• 完全投入到这个梗里
• 感觉像是没人需要，但互联网却莫名其妙地“应得”它

为什么争夺 Community Favorite

• 笑点立刻显现
• 挫败感是普遍的
• 几乎每个人都曾被图片 CAPTCHA 折磨过
• 非常容易理解、点击和分享

最后感想

我喜欢把一个看似正常、持续约五秒的东西，慢慢揭示它只为把你困在无尽的假进度循环中的想法。这对四月愚人节的挑战来说极其贴切。

如果最无用的软件是指在技术上可运行却在情感上让人更糟糕的软件，那么我认为这完全符合条件。

感谢阅读，祝你好运，证明你是人类。