每个OTT平台在某个地方都潜藏着同一个不为人知的漏洞：一张几乎完美的图片。
一张宽度超出标准几个百分点的海报。一个在电视上显示时边缘被裁掉的主视觉横幅。一张在笔记本电脑上看起来没问题，但在手机上却隐约有些不对劲的缩略图。没有人提交工单，因为没人能指出来具体哪里出了问题——它只是看起来有点不对劲。
解决办法并不是拥有一双更敏锐的眼睛，而是一张不会说谎的测试图像。
为什么“看起来没问题”不能算作测试
宽高比问题之所以难以察觉，是因为摄影技术掩盖了它们。将风景照片拉伸4%，观众根本看不出异样；但若将人脸、标志或圆形拉伸4%，所有人都能一眼看出。
这就是测试卡背后的核心理念。你将形状放入画面中，这些形状的正确性不言而喻，因此错误的渲染会显而易见，而非被掩盖。
Vodlix测试卡
我们为自己的质量保证团队开发了一个，现在决定免费分享给大家，因为每个直播团队都需要它，而大多数团队最终都会在周五下午画出更糟糕的东西。
其中的所有内容都是为了针对特定漏洞而精心设计的陷阱：
一个内接于正方形的圆，与四个绿色点相切。圆只有在一种长宽比下才是圆形的。挤压边框，它就会变成椭圆形，并远离其中两个点。
对角线角度恰好为45度。任何非均匀的缩放都会改变该角度，导致打印出的标签与它所指向的线不匹配。
由完全正方形组成的棋盘。一旦比例发生变化，正方形便会变成长方形。
沿真实边缘的一条细线、位于角像素处的角括号，以及四个“EDGE”标签。如果其中任何一个缺失，则表示帧被裁剪了。
四边都有一条从0到100%的标尺。如果起始点在0之后或结束点在100之前，说明你看到的是裁剪或缩放后的画面。
无需测量、无需套叠、无需参考文件。只要圆是圆的，且你能看清所有四条边，渲染结果就是正确的。
渲染失效时实际会是什么样子
以下是同一张图片的四种状态。只有第一种显示正确。
这两种故障值得区分，因为它们的成因不同，解决方法也不同。
被压扁或拉长 这意味着有某种因素将图像强行塞入了一个形状不符的槽中——可能是 CSS 中硬性设定的宽高，也可能是采用“填充”而非“适应”的缩放模式。圆因此变成了椭圆。
裁剪或放大 这意味着比例得到了保留，但画框超出了其容器范围。请注意，在裁剪后的示例中，圆圈依然保持着完美的圆形。这就是陷阱所在：裁剪并不会导致任何变形，它只是悄无声息地去除了边缘。如果没有边缘标记，你根本不会察觉。
竖版比横版更重要
16:9 通常都能适用，因为所有内容都是为此设计的。竖屏才是素材容易出现问题的领域——Reels、Shorts、移动端主视觉图、手机锁屏画面。因此，这张卡片也提供了 9:16 的版本。
一张9:16的素材若以填充缩放模式插入16:9的插槽，其高度会减少约三分之一。这张图表能在一瞬间就让这一点一目了然，无需争论。
下载
免费使用，无需署名。PNG格式，精确像素尺寸，浅色版和深色版：
16:9 横向，1920 x 1080 - 明暗
9:16 竖版，1080 x 1920 - 明暗
两项比率对应的故障模式参考表
16:9 亮度（1920 x 1080） · 16:9 暗色 · 9:16 亮度 (1080 x 1920) · 9:16 暗
在测试本身中，请使用 PNG 格式而非 JPEG 格式。JPEG 压缩可能会使两像素宽的边缘细线变得足够模糊，以至于在小尺寸下看起来不复存在，这会让你去追查一个实际上并不存在的裁剪错误。
如何正确使用它
将其放入真正的处理流程中，而不是放在桌面上。将其作为图层上传到测试标题中，使其经过尺寸调整器、CDN 转换和应用布局——问题就出在这里。
在真实设备上运行它。电视应用、手机、平板电脑和网页播放器会出现各不相同的故障。
对结果进行拍照或截图，并与卡片上印有的核对表进行比对。
请保留测试标题。它将成为一个永久的回归警报——下次有人更改缩放模式时，你会立即察觉。
我们为何关注此事
Vodlix 是一个白标 OTT 平台，这意味着平台上的每一张图片都属于他人——包括客户的海报、品牌标识以及缩略图。几何尺寸的错误绝非表面问题，而是我们对客户设计作品的破坏。
因此，这张卡片是我们内部质量保证（QA）工作的一部分。我们之所以发布它，是因为这个问题并非我们独有。
