Apr 21, 2025
A Medium publication by UX Collective
引言：一段“无法被截图”的文字
在 iOS 的 App Store、通知栏、相册甚至系统弹窗中，我们常常会看到一些“白得发亮”的文字——例如“Apps We Love”或“Build bespoke invitations...”这类小标题。
但你可能注意到：
当你截图时，这些发光文字却突然变得暗淡，甚至无法分辨。
这并不是视觉错觉，而是 Apple 在 UI 视觉表达层中所引入的一项突破性机制：HDR（高动态范围）文字渲染。
一、信息叠加时代的视觉瓶颈
随着 iOS 系统采用大量玻璃模糊、渐变背景与透明图层，传统视觉设计手段——如阴影、边框、遮罩——已经难以维持前景元素的清晰度。尤其当界面中多个浅色图层叠加时，白色文字的可读性急剧下降。
Apple 使用 HDR 技术解决这一问题：
通过超越 sRGB 色域亮度限制，在显示层中提升文字的物理亮度，从而保证其“被看见”。
二、HDR 是如何“发光”的？
技术概念：High Dynamic Range
传统 UI 元素在 sRGB 空间中，其亮度上限被限制在 1.0（标准白点）。而 iPhone 的 XDR 屏幕支持高达 1000 nits 的亮度。
通过采用 HDR 渲染路径，系统可将某些元素“推送”到更高亮度，使其在感知上获得更高注意力值。
实现路径：
使用 PQ（Perceptual Quantizer）或 HLG（Hybrid Log-Gamma）作为 EOTF（光电转换函数）
色彩编码采用 BT.2020 或 BT.2100 色域
元素在渲染时进入 HDR 信号通道，仅在支持 HDR 的屏幕中展现
截图、录屏等基于 SDR 渲染流程，因此无法捕捉这些亮度信息
三、典型场景：HDR 小字文字如何“脱颖而出”
Apple 并未将 HDR 用于所有主按钮或标题，而是选择了具有“视觉弱权重、认知高优先”的文本，例如：
App Store 推荐模块中的“Apps We Love”
Action Sheet 中的辅助操作项
系统状态栏提示与锁屏通知
这些元素通常不会被抢眼设计抢走注意力，却必须在复杂背景中保持可识别。
这正是 Apple 的 HDR 使用哲学：用物理亮度实现感知优先级。
四、HDR 是一种感知策略，而非视觉特效
传统的 UI 层级排序依赖：尺寸、颜色、模糊层级、视觉动线……但这些手段容易受限于背景复杂度。
层级维度 | 传统表达方式 | HDR 增强方式 |
|---|---|---|
尺寸 | 字体加大 | 不依赖尺寸变化，直接提升感知权重 |
色彩对比 | 使用纯色或互补色 | 不受背景干扰，亮度增强穿透可见 |
背景模糊 | 利用透明遮罩拉开层级 | 可在浅色/视频背景中保持清晰可辨 |
亮度优先级 | 无法实现 | HDR渲染突破传统图层，直接表达信息 |
这种设计方式是一种由硬件感知能力驱动的注意力引导机制，非常适合在空间感知设备（如 Vision Pro）中演进为交互语言的一部分。
五、Apple 推动的行业标准：ISO/TS 22028-5
Apple 不仅在使用 HDR，还在推动全球 HDR 静态图像编码标准的制定。
根据 Apple 图像标准专家 Nicolas Bonnier 提交的技术文档[1]：
ISO/TS 22028-5:2023 定义了 HDR/WCG 静态图像编码的完整规范
编码基于 PQ 或 HLG，色域为 BT.2100/BT.2020
元数据包括 Mastering Display Colour Volume（MDCV）和 Content Colour Volume（CCV）
参考显示设备亮度峰值为 1000 nits，黑点为 0.0005 nits
Apple 是该标准的共同主导方，并明确支持使用该规范推动 HDR 在摄影与图像系统中的普及。
六、WWDC23：亮度成为 UI 的“信号”
在 WWDC23 的 Session 10181[2] 中，Apple 首次正式提出：
“Brightness is no longer a passive state. It is now a signal.”
这表明 HDR 已被系统性纳入 UI 感知机制：
可用于空间识别与定位（Vision Pro）
提升 UI 元素的感知序列与触发意愿
在视觉流中扮演“非色彩非形状”的感知角色
这是一种 UI 语言的革新，而非单纯视觉装饰。
七、HDR 就像 AI —— 是系统内的感知 Agent
正如我过去在研究中所写：
“AI 不是产品，而是一种嵌入式 Feature。”
同理，
HDR 也不是风格，而是感知表达机制。
它不抢主视觉
它不改变文案结构
却能精准地吸引你的眼睛
它像一位默默提醒你的 UI 助理，存在于你“感知不到但无法忽视”的地方。
八、设计应用建议：何时该考虑 HDR 亮度？
使用场景 | HDR适配建议 |
黑暗模式下的说明文字 | 提升文字亮度，确保在玻璃背景下可读 |
模态弹窗的次要信息引导 | 使用 HDR 白提升次级按钮感知权重 |
视频背景上浮层文字 | 避免使用阴影，改用发光白或动态亮度 |
空间UI中状态切换提示 | 利用亮度通道引导用户聚焦或操作 |
软件中重要的交互元素 | 图形、按钮、ICON的使用需要注意权重， 避免过度滥用 |
九、配图说明：可视化 HDR 感知路径
为帮助读者理解文中所述的视觉策略与技术路径，本文建议配合以下示意图呈现：
HDR 技术路径图：展示从设计稿 → 编码（PQ/HLG）→ 渲染通道 → 屏幕显示，以及截图流程中 HDR 如何被替换为 SDR 显示路径，从而无法记录亮度信息。
十、结语：设计师的感知语言升级
当 UI 中的文字开始“发光”，并不是技术炫技，而是我们与用户沟通方式的一次升级。
HDR 正在从电视、视频、图像渲染中延伸进入 UI 设计，让“不可见”的文字重新获得关注力。
下一代 UI 设计师，不仅要会画界面，还要会编排感知结构。
参考文献
[1] Bonnier, N., & Hubel, P. (2022). ISO/TS 22028-5: HDR/WCG encoding for still images. ICC Expert Day.
[2] Apple. (2023). Designing for Spatial Computing. WWDC23, Session 10181. Retrieved from: https://developer.apple.com/cn/videos/play/wwdc2023/10181/?time=552
[3] ISO. (2023). ISO/TS 22028-5:2023. Retrieved from: https://www.iso.org/standard/81863.html
后记：
原本去年就想写一篇关于HDR在交互界面上应用的前瞻性文章，但因为工作问题迟迟没有落笔。这次依然是核心内容+提纲细节输入给AI，由他来以我的语言方式进行整理和编排，使得一个个观点被激发，被释放。我有种不被文字所影响的释然感，并且可以更加专注于自己所观察到的社会、人、与事物的本质，从而激发我对现世诸多现象的观点表达。
我的观点未必一定是正确的，但我却在做我认为正确的事。
