抖动二维码

# 抖动二维码生成器 来源：https://www.andrewt.net/dithered-qr-codes/wtf/ ## 制作你自己的抖动二维码 自己制作（https://www.andrewt.net/dithered-qr-codes/index.html）我网站的其他内容（https://www.andrewt.net/）源代码（https://codeberg.org/andrew-t/dithered-qr-codes）一张我的抖动照片，上面叠加了标准二维码对齐图案 ## 二维码基础 二维码实际上只是一种将几字节数据编码的方式，让智能手机或类似设备能轻松从照片中读取。它们被设计得对焦不准、打印质量差、角度奇怪和区域缺失都非常鲁棒。它们具体如何工作并不太重要，但就本页而言，二维码是一个方形网格，分为两部分——功能图案（即上面例子中的粗体形状）和数据模块（其他所有部分）。功能模块主要用于让扫描器轻松找到二维码，因此它们必须非常清晰和醒目。数据模块是实际数据所在之处，还包含一些额外的头部数据等；因为扫描器只有在利用功能模块精确确定二维码位置之后才会读取这些数据，所以它们可以被稍微修改。品牌经常利用这一点来制作看起来有些独特的二维码，虽然这种修改会让扫描时的鲁棒性稍差，但在代码变得不可扫描之前，通常还是可以做不少改动的。 ## 在二维码中放入图片 一张 Dave Richeson 的抖动照片，上面叠加了标准二维码对齐图案，并散布着一些黑白小像素 这是我在 Mastodon（https://mathstodon.xyz/@divbyzero/115021806369821862）上看到的一个二维码。你可以对数据模块做的一种修改是缩小它们——扫描器会按照定位图案所指示的像素中心位置去查看，因此只要代码在你尝试扫描时没有变形，就没问题。这意味着其余空间就随你发挥了。Dave 将每个像素分成一个三乘三的网格，用中间那个存储数据，其他格子用来放照片。结果就是一张带有椒盐噪声的低分辨率一比特照片。 ## 抖动 一个抖动渐变 显然，当我们将图像压到低色彩深度时，通常不会只是简单地做阈值处理——即把暗像素变成黑色，亮像素变成白色。我们通常还会使用一种棋盘格效果来制造中间色调。可以使用拜耳滤镜（https://en.wikipedia.org/wiki/Dither）将这种方法应用到整张图像上，而无需牺牲太多细节。 一张米开朗基罗的大卫像的拜耳抖动图片 ## 误差扩散 试图改进这种方法的是 Floyd-Steinberg 抖动。 一张米开朗基罗的大卫像的 Floyd-Steinberg 抖动图片 在这种方法中，你从左上角开始，对像素进行常规阈值处理——如果亮度超过 50%，就设为白色，否则设为黑色。假设某个像素亮度为 70%——我们会把它设为白色，也就是 100% 亮度，这相当于多加了 30% 像素亮度的误差。为了抵消这一点，我们要把这个误差“扩散”到其他像素——所有附近尚未进行阈值处理的像素都会变暗几个百分点，总共相当于一个像素的 30%。当我们对这些像素进行阈值处理时，会把这个因素考虑进去。其思想是，一旦我们对整张图片完成了阈值处理，图像每个部分的平均亮度都会比更规则的抖动更接近正确亮度。不规则的图案也没那么令人分心。 ## 带误差扩散抖动的二维码 一张带噪声的 Floyd-Steinberg 抖动图片（米开朗基罗的大卫像），上面有二维码图案 这种不规则抖动的另一个优点是，由二维码数据模块引起的椒盐噪声更难被察觉。但它仍然存在，这也是图像看起来噪声很大的原因。我的意思是，它本来就会看起来*相当*嘈杂，因为这是一张 147×147 像素的一比特图像，但其中*一些*噪声是因为每九个像素中就有一个实际上是随机颜色。 但我们可以用*更多的误差扩散*来解决这个问题。 ## 对数据模块进行误差扩散 在这种情况下，我们要进行两轮误差扩散。第二轮与常规方式相同，但第一轮是专门用来掩蔽数据模块的。我们已经知道所有这些像素必须是什么颜色，所以可以把它们设成那些颜色，并将误差扩散到周围的八个像素。这个误差可能会相当大——通常我们可以选择颜色，使误差永远不会超过 50%，但在这里，我们可能不得不把暗色区域中的某个像素设为纯白色，最终产生 95% 的误差。这听起来很糟，但这正是为什么将这些误差扩散出去而不是直接接受它们如此重要。 一张噪声更小的 Floyd-Steinberg 抖动图片（米开朗基罗的大卫像），上面有二维码图案 你可以看到，这使图像干净多了。 ## 让效果更高级 一张 Morten Rieger Hannemose 的符合伦理来源的 Lena 图像（https://mortenhannemose.github.io/lena/）的抖动版本，上面叠加了标准二维码对齐图案 生成器工具（https://www.andrewt.net/dithered-qr-codes/index.html）允许你做一些额外操作。你可以在添加图像之前旋转二维码，并调整二维码设置，看看是否有其他编码方式看起来更美观。 你还可以允许生成器修改其中一些 95% 误差的数据模块——二维码本身有足够的纠错能力，你可以修改几个像素，它们仍然能被扫描。（中间带标志的二维码就是这样工作的。）但实际上，如果你已经对数据模块的误差进行了扩散，这样做对图像质量的影响并不大，而且它会严重影响代码的可扫描性。 ## 在现实中使用这些 只要不过分追求效果，而且二维码会显示在大屏幕或海报等地方，这一切效果都还不错。如果它出现在比如可能被揉皱的纸质传单上，那么你就需要更多我们为了让二维码好看而放弃的冗余度、鲁棒性和纠错能力。归根结底，这是美观与可扫描性之间的权衡——请记住，一个二维码能在*你*的手机上从笔记本电脑屏幕扫描成功，并不意味着它就能让某个陌生人的低端手机在光线不好的条件下从打印件上扫出来。 另外请记住，生成器工具会生成没有边距的小图像——要使二维码可靠扫描，需要一些边距；而且如果你不用 CSS（https://developer.mozilla.org/en-US/docs/Web/CSS/image-rendering）禁用图像放大时的平滑处理，浏览器通常会在放大图像时使其模糊。边距的颜色必须与三个大型“定位”图案方块中心的颜色相反——通常是白色，但你也可以生成需要黑色背景的反色二维码。