F3.07.7real-data hierarchy audit设计

层级对齐核查应在真实数据而非理想化设计稿上进行

别名: 真数据审核 · 占位符欺骗 · mockup bias

概念解释

设计稿里的任务卡标题是「设计评审」,附件两张,负责人「王敏」,状态「进行中」。生产库里同一组件吃进 40 个汉字的标题、缺图、四位数编号、三个角标叠在一起。稿上排好的「标题第一、状态第二」到生产里变成「超长标题吞掉一切,角标变成最饱和的东西」。对齐查的是用户将看见的像素,不是画板里的理想字符串。 用占位文案通过的层级,在真实分布下经常翻盘。假数据不是中性样品,它系统性地少竞争、短文本、齐图像。

机制

占位符把几个会改权重的变量同时压到最友善的值:短标题减少面积、齐整头像减少破洞、空角标减少饱和峰值、英文短词让行数可控。真实分布在这些维度上长尾:中文标题一折行,文字块的面积突然变成场上最重对象;缺图露出大块底色或破图图标,形成一个新的孤立峰值;角标一多,饱和通道被打满。画板上的权重排序是在「竞争被人为关掉」的条件里做的,条件一恢复,排序就不是那一套。所以不是「上线后数据脏了所以乱」,是核查发生在错误的样本上。

边界

全新产品没有生产库时,可以用历史产品的分位数冒充:标题取第 90 百分位长度、图缺失率按真实估计,而不是用设计师的名字。营销专题若内容确实全是精修短句,用精修稿核查是合法的,前提是发布管道保证不会灌进用户生成的长文本。极端值测试(超长、全空)是布局防破,不是层级对齐;对齐要用典型偏难的真实样本,而不是只拿最长的那一条吓人。

怎么落地

  • 评审材料至少有一屏是生产截图或用生产接口灌进去的预览,禁止只拿画板过层级关。
  • 灌库时故意保留:长标题、缺图、多角标、空状态混排,不要先洗成「好看的十条」。
  • 组件库的示例改成真实分位数,而不是「John / 3 words / 完美图」,避免下一张稿从同一套友善样本长出来。
  • 验证:把同一组件的画板版和生产版并排,五秒书写各做一次。两版第一名若不同,以生产版为准改权重(通常是给长标题设最大行数并降低角标饱和),再灌一屏新的真实样本确认没有换一种长尾又翻盘。画板版对齐而生产版不对齐,不算过关。

延伸

  • 同组F3.07.4 视觉层级是否与内容优先级对齐可通过眼动或首次注意测试验证 · F3.07.1 视觉层级必须对应内容优先级
  • 相邻F2.16.1 布局需要用极端长度的内容测试而非典型样例 · F4.10 文本截断与省略
  • 站内检索real data · placeholder · visual hierarchy · production screenshot

同组卡片

快捷操作

分享

分享当前页面

ios_share

https://hci.top/zh/handbook/F3.07.7