电视上的色彩

电视设计的色彩可以启发灵感、营造氛围,甚至引导用户做出决定。它是一个用户首先注意到的强大且具象的元素。作为一种与广大受众建立联系的丰富方式,色彩理所当然地成为构建高质量电视界面中的重要一环。

要点

  • “标准”画面模式是最常见的电视显示设置。
  • 大多数电视支持 sRGB。
  • 选择颜色时,请考虑用户观看电视的距离不同,以及在弱光环境下的观看情况。
  • 电视的显示技术和色彩空间设置差异很大。
  • 务必在尽可能多的实际设备和色彩空间变体上进行测试。
  • 使用颜色时,请考虑不同的用户需求和偏好。
  • 使用渐变时,请注意常见的电视问题,如色带。

电视色彩与电视显示

认为所有显示器都以相同方式显示所有颜色是一个常见的误解。也许您在使用工作笔记本电脑或在朋友家看电影时注意到了这一点。同一颜色在不同的电视型号、电脑显示器和移动设备之间可能有所不同。

色彩空间

Color Space

色彩空间是指电视显示器可以再现的颜色范围。这些包括 sRGB 和 DCI-P3 色彩空间。sRGB 是最广泛使用的色彩空间,与大多数电视型号兼容。它被用于操作系统、电视节目和游戏。

选择 DCI-P3 色彩空间可以使视频看起来更鲜艳、更逼真。由于以 DCI-P3 制作的内容可以访问更大比例的颜色,因此该内容可能仅与高级电视显示器兼容。

画面模式

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

大多数电视面板的默认画面模式是“标准”。此模式旨在提供具有准确颜色的平衡画面。但用户有很多选项可供选择。许多用户更改画面模式以改善感知到的画面质量。

让我们看看七种常见的画面模式

  • 标准:默认画面模式。它提供具有准确颜色的平衡画面。
  • 鲜艳:增加颜色饱和度,使其更具活力。
  • 动态:增加图像对比度,使其看起来更锐利。
  • 游戏:优化游戏画面,减少输入延迟。
  • 电影:优化电影画面,减少运动模糊。
  • 运动:优化体育节目画面,增加图像亮度。
  • 自定义:允许用户根据自己的偏好调整画面设置。

对比度

对比度是画面质量最重要的方面之一,尤其是在现代 HDR 显示器上。它是电视能够产生的最暗的黑色和最亮的白色之间的差异。更高的对比度通常意味着更深的黑色,这对整体画面质量有很大影响。

Color contrast low
对比度:562:1(低)
Color contrast high
对比度:无限: 1(完美)

同一颜色在不同电视上看起来可能不同,在低对比度电视上可能会显得褪色。为确保良好的用户体验,设计师在创建电视应用 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 原则。

  • 无障碍优先:电视界面面向不同受众,包括年轻人、老年人和视障人士。使用颜色时,务必考虑他们的需求和偏好。将无障碍功能放在 UI 设计的首位,可以为用户带来高效的体验。一个例子是满足颜色对比度标准。注意:始终考虑不同电视型号之间的颜色渲染差异。
  • 有目的地使用颜色:正确使用颜色可以增强沟通,创造有意义的沉浸式体验。它在整个电视界面中反映了您的产品身份。
  • 选择对比鲜明的基础:对比鲜明的背景有助于用户解读和与您应用的文本及各种元素交互。更高的对比度可确保内容可见。

屏幕色带

screen banding

电视上的屏幕色带是指显示屏上出现可见的水平或垂直线条、条纹或渐变,这些并非实际显示内容的一部分。这种伪影可能表现为明显的线条,或屏幕上颜色或色调的逐渐过渡。色带可能由低色深、压缩伪影、信号干扰或面板或 GPU 问题等因素引起。

在设计电视用户界面时,尤其是在涉及渐变和避免色带时,请考虑以下提示

  • 使用高色深渐变:为了最大限度地减少色带风险,请使用高色深(例如 10 位或更高)的渐变。这可确保颜色之间的过渡更平滑,并降低出现可见条纹的可能性。
  • 避免极端的颜色过渡:创建渐变时,尽量避免颜色之间的急剧过渡,因为这些更容易出现色带。相反,使用更微妙、更平缓的颜色过渡,以在屏幕上呈现更平滑的效果。
  • 在多种设备上测试:由于电视的色深和面板质量可能不同,因此在多种设备上测试您的 UI 设计非常重要,以确保渐变在不同屏幕上显得平滑且无色带。
  • 使用抖动技术:抖动是一种技术,可以通过以有图案的、类似噪点的方式混合颜色来帮助减少色带。这有助于创建更平滑的颜色过渡的错觉,即使在色深较低的屏幕上也是如此。
  • 选择纯色或微妙的图案:如果渐变对您的设计不重要,请考虑使用纯色或微妙的图案。这些不太容易出现色带,并且仍然可以创建美观的 UI。