F5.12.3Contrast flattening设计
依赖阴影或渐变表达的层级在高对比模式下需要替代方案
别名: 高对比替代线索 · 阴影失效 · gradient hierarchy
概念解释
卡片叠成一叠,全靠投影看出谁在上;底部还有一层渐隐,暗示下面还有内容。高对比一开,软阴影被拿掉,渐变被收成两块平色,叠和「还有更多」一起消失。原先靠阴影或渐变讲的层级,在高对比里必须换成边框、间距、实线分割或明文结构,不能指望那层光还在。
深色主题改用表面加亮,是另一条路;高对比连不少中间明度也会砍,加亮梯子同样可能被踩平。
机制
高对比的工作方式是减少中间调。阴影是中间调,渐变是中间调的连续带。把它们删掉或量化成两端色,深度和「未完」这两种靠光的语言就没有载体。用户不是看不懂产品,是看不出层和截断。
替代必须是高对比下还活着的线索:闭合边框给出形状,间隙给出分离,实线给出裁切,文字给出「还有 N 项」。这些线索在普通主题里可能显得笨,但它们不是给普通主题用的。
边界
- 本来就靠边框和间距分层的界面,高对比几乎不用另做层级方案。
- 装饰性渐变(英雄区氛围)可以在高对比里直接删,不必找替代——它本来就没承担结构。
- 若高对比主题仍保留很细的灰度阴影,低视力用户还是看不见;「我们留了阴影」不算替代。
怎么落地
- 列出所有「关掉阴影 / 渐变图层就读不出结构」的组件:叠卡、底部渐隐列表、用内阴影表示凹陷的输入槽。
- 为每一项指定高对比替代:叠卡改一圈边框加错位;列表改实线裁切或「还有 N 条」;输入槽改完整边框。
- 不要把深色主题的表面加亮表复制进高对比当替代。
- 验证办法:在高对比主题里把阴影和渐变强制关掉(它们本应已不在),看层顺序和「未完」是否仍能被说出;说不出就还没替代,只有缺失。