电视上的色彩

TV 设计中的色彩可以启发灵感、营造氛围，甚至促使用户做出决策。它是用户首先注意到的、强大且切实的元素。作为与广大受众建立联系的丰富手段，色彩无疑是构建高质量 TV 界面的重要环节。

亮点

• “标准”图像模式是最常见的电视显示设置。
• 大多数电视支持 sRGB。
• 在选择色彩时，请考虑到用户在不同距离以及弱光环境下观看电视的情况。
• 电视的显示技术和色彩空间设置可能会有很大差异。
• 请确保在尽可能多的设备和色彩空间变量上进行测试。
• 在使用色彩时，请考虑不同用户的需求和偏好。
• 使用渐变色时，请留意常见的电视问题，例如色阶断层（banding）。

TV 色彩与 TV 显示器

一个常见的误区是认为所有显示器都以相同的方式显示所有色彩。你可能在操作办公笔记本电脑或在朋友家看电影时注意到了这一点。同一色彩在不同的电视型号、电脑显示器和移动设备之间可能会有所不同。

色彩空间

色彩空间是指电视显示器可以再现的色彩光谱。其中包括 sRGB 和 DCI-P3 色彩空间。sRGB 是应用最广泛的色彩空间，与绝大多数电视型号兼容。它被用于操作系统、电视节目和游戏中。

选择 DCI-P3 色彩空间可以使视频看起来更加生动逼真。由于在 DCI-P3 中制作的内容可以访问更大比例的色彩，因此该内容可能仅与高端电视显示器兼容。

图像模式

图像模式可以通过改变电视处理图像的方式来影响电视上的色彩质量。例如，“标准”图像模式通常尝试产生更准确的色彩表现，而“鲜艳”图像模式则会增加色彩的饱和度，使其更加亮眼。

大多数电视面板的默认图像模式是“标准”。此模式旨在提供色彩准确且均衡的画面。但用户有很多选项可以选择。许多用户会更改图像模式以提高感知的画面质量。

让我们来看看七种常见的图像模式

• 标准 (Standard)：默认图像模式。它提供色彩准确且均衡的画面。
• 鲜艳 (Vivid)：增加色彩饱和度，使其更加夺目。
• 动态 (Dynamic)：增加图像的对比度，使其看起来更清晰。
• 游戏 (Game)：优化游戏画面，减少输入延迟。
• 电影 (Movie)：优化电影观影画面，减少动态模糊。
• 体育 (Sports)：优化体育赛事画面，提高图像亮度。
• 自定义 (Custom)：允许用户根据自己的喜好调整图像设置。

对比度

对比度是衡量图像质量最重要的指标之一，尤其是在现代 HDR 显示器上。它是电视能产生的最暗的黑色与最亮的白色之间的差异。较高的对比度通常意味着更深邃的黑色，这对整体画质有很大影响。

对比度：562:1（低）

对比度：Inf: 1（完美）

同样的色彩在低对比度的电视上可能看起来发灰。为了确保良好的用户体验，设计师在为 TV 应用创建 UI 时应考虑以下建议：

1. 在文本和背景色之间使用高对比度。
2. 选择清晰、易读的字体，并使用较大的字号和行间距。
3. 融入无障碍功能。
4. 避免仅依靠色彩来传达信息。
5. 针对不同的色彩空间（SDR 和 HDR）进行优化。
6. 在不同的光照条件下测试易读性。

显示技术

显示技术也会影响屏幕上显示的色彩。常见的类型包括：

• LCD：液晶显示器是最常见的电视显示器类型。它们的工作原理是使用背光照亮液晶面板，面板通过阻挡或允许光线通过来创建图像。LCD 电视相对便宜且尺寸范围广泛，但在对比度和色彩还原方面可能表现欠佳。
• LED：发光二极管显示器是一种较新型的 LCD 电视，使用 LED 作为背光。LED 比传统 LCD 更节能，并且可以产生更明亮、更生动的图像。LED 电视往往比 LCD 电视更贵。
• QLED：量子点发光二极管显示器是一种利用量子点发光的 LED 显示器。量子点是微小的颗粒，可以产生比传统 LED 更宽广的色彩范围。
• OLED：有机发光二极管显示器是一种利用有机材料发光的 LED 显示器。OLED 电视是目前最昂贵的电视类型，但它们提供了所有电视类型中最佳的对比度和色彩还原效果。

每种电视显示技术在渲染色彩时都有其自身的优缺点。

要了解更多信息，请观看 The Slow Mo Guys 的视频：电视机是如何在慢动作下工作的。

原则

更多阅读，请参阅 Material Color 原则。

• 无障碍优先：TV 界面拥有多元化的受众，从年轻人到老年人，再到视障人士。在使用色彩时，请务必考虑需求和偏好。在 UI 中将无障碍放在首位可以为用户提供高效的体验。一个例子就是符合色彩对比度标准。注意：请始终考虑不同电视型号之间的色彩渲染差异。
• 有目的地使用色彩：如果使用得当，色彩可以增强沟通，并创造有意义的沉浸式体验。它在整个 TV 界面中体现了产品的身份。
• 选择具有对比度的基础：具有对比度的背景有助于用户解释应用中的文本和各种元素并与之互动。较高的对比度可确保内容清晰可见。

屏幕色阶断层

电视上的屏幕色阶断层（banding）是指显示器上出现的可见水平或垂直线条、条带或渐变，它们不属于实际显示的内容。这种伪影表现为明显的线条，或表现为屏幕上颜色或阴影的逐渐过渡。色阶断层可能是由低色深、压缩伪影、信号干扰、面板或 GPU 问题等因素引起的。

在为 TV 设计用户界面时，特别是在处理渐变并避免色阶断层时，请考虑以下提示：

• 使用高色深渐变：为了将色阶断层的风险降至最低，请使用高色深（例如 10 位或更高）的渐变。这可以确保颜色之间的过渡更平滑，并降低出现可见条带的可能性。
• 避免极端的颜色过渡：在创建渐变时，尽量避免颜色之间的剧烈转换，因为这些转换更容易产生色阶断层。相反，应使用更微妙、更柔和的颜色过渡，使屏幕外观更平滑。
• 在多台设备上测试：由于电视在色深和面板质量方面存在差异，因此在多台设备上测试你的 UI 设计非常重要，以确保渐变在不同屏幕上都显得平滑且无色阶断层。
• 使用抖动 (Dithering) 技术：抖动是一种通过以图案化的、类似噪声的方式混合颜色来减少色阶断层的技术。即使在色深较低的屏幕上，这也有助于创造更平滑颜色过渡的错觉。
• 选择纯色或微妙的图案：如果渐变对你的设计不是必需的，请考虑使用纯色或微妙的图案。这些不容易产生色阶断层，并且仍然可以创建美观的 UI。