是什么导致了 Sonos 徽标中的效果?

平面设计 商标 效果
2022-01-25 01:59:53

下面是新的 Sonos 徽标。

当您在屏幕上上下滚动图像时,看起来声波正在向外跳动。

是什么导致这种效果发生?

在此处输入图像描述

4个回答

它被称为莫尔条纹

当两个“网格”图案(可能适用于几何线、点等的松散术语)相互重叠并移动时,它就形成了。

在这种情况下,两个“网格模式”是图像本身(即几何线)和屏幕的基于像素的屏幕刷新。

类似的效果是新闻播音员会在电视上穿着紧密的条纹图案:https ://www.youtube.com/watch?v=jXEgnRWRJfg

图案重叠自身的摩尔纹

徽标的图案在 LCD *上显示时会产生令人惊讶的视觉运动外观,并且视图会以图案尺寸的一小部分滚动。

上下滚动图像时看到的效果是莫尔条纹。
当两条规则线图案重叠时出现这种图案。
在这种情况下,这两种模式都来自同一张图像:

它是观看者大脑中先前屏幕状态的残像之上的当前屏幕图像

徽标图像中的图案称为“西门子星”

西门子明星剪裁

(来自forum.luminous-landscape.com

现在,让我们看看在为同一图像添加 50% 透明层并将其向下移动一些像素时的外观:

下移 3 个像素:

向下移动 3 个像素

向下移动 10 个像素:

向下移动 10 个像素


为什么会脉动?

注意莫尔条纹的大小是如何不同的——它变得更大以获得更多的偏移。这解释了滚动时可以看到的脉动效果:滚动不使用相等的步长,因此偏移量略有变化。


* 效果不依赖于使用 LCD。它应该在任何基于物理像素矩阵的显示器上发生非常相似。在 CRT 显示器上,效果可能更难观察。一个原因是 CRT 显示概念的伪影很容易在这里干扰。此外,CRT 和 LCD 之间的一个重要区别是,与理想图像相比,CRT 表示的像素通常有点太不清晰,而 LCD 通常显示像素太清晰(!) - 比理想情况下更清晰。由于西门子星图明确使用了显示分辨率的上限,因此差异有很大的影响。

莫尔效应和类似的视觉效果可能是故事的重要部分。但是,对于 LCD,您有一个额外的变化,具体取决于 LCD 型号:

响应时间(像素将状态更改为所需状态的时间)取决于灰度级(开始和结束)。

http://www.lagom.nl/lcd-test/response_time.php#response_time_gif

线条,尤其是细线条,在显示器上呈现出大量的灰度级,并且它们分布不均匀,从而为无论如何感知到的线条添加了实际的物理变化。使用上面的测试作为一个指标,你的 LCD 有多少会受到这种影响。

莫尔条纹是部分原因,但另一个因素(因为它在您滚动时更明显)是屏幕的刷新率,以及并非所有线条都同时更新的事实。它通常水平逐行更新,这种失真与莫尔条纹相结合会产生脉动效果。