3、座舱字号与层级:字号系统与信息层级构建

好,咱们今天聊点实在的。座舱里的字,到底该设多大?

这个问题,我入行头三年都没完全搞明白。直到有一次,一个测试工程师半夜给我打电话,说「你那个24px的字,我在高速上根本看不清」。嗯,从那以后,我才真正开始认真研究字号这件事。

3.1 字号系统:12/14/16/20/24/32/48px

先给出一套我常用的字号系统。这套体系,说白了就是一套「刻度尺」。你照着用,基本不会出大问题。

字号 (px) 典型用途 备注
12 辅助信息、角标、状态图标文字 仅限静态或短时注视场景
14 次要标签、列表副文本、仪表盘小字 驾驶中不建议作为主要阅读内容
16 正文、按钮文字、列表标题 这是座舱里的「基础字号」
20 次级标题、卡片标题、弹窗标题 视觉层级开始拉开
24 主标题、导航栏标题、大按钮 驾驶中快速扫读的起点
32 一级标题、欢迎语、关键数据 比如时速、续航里程
48 主视觉文字、警示信息、大屏标题 一眼就能看到

我个人习惯,把16px作为「锚点」。为什么?因为16px在大多数座舱屏幕的物理尺寸下,刚好对应人眼在70cm视距下的舒适阅读尺寸。你想想看,驾驶员看中控屏,大概就是手臂伸直的距离。

核心原则:字号不是随便选的。每一档之间,视觉重量要拉开至少20%的差距。12→14→16→20→24→32→48,每一跳都足够明显。

3.2 信息层级构建

有了字号,怎么搭层级?

我见过很多设计师,把字号用成了「调色盘」——这里大一点,那里小一点,最后整个界面像打翻了字号的抽屉。为什么会这样?因为没有层级思维。

信息层级,说白了就是「谁先被看到,谁后被看到」。在驾驶场景里,这个顺序直接决定了安全。

我一般把信息分成三层:

  • 第一层(32-48px): 驾驶核心信息。时速、续航、导航指令、警告。这些必须在200ms内被捕获。
  • 第二层(20-24px): 操作与反馈。按钮文字、当前状态、设置项。用户需要时能快速找到。
  • 第三层(12-16px): 辅助与详情。时间、温度、版本号、说明文字。不需要主动关注。

我在项目中遇到过一个问题:客户要求把所有信息都放大,说「老年人看不清」。结果呢?所有字都一样大,驾驶员反而找不到重点。嗯,这就是典型的「没有层级」。

我的小技巧: 设计时,先把所有文字都设为16px。然后问自己:「哪个信息最重要?」把它放大到24px或32px。再问:「哪个最不重要?」把它缩小到12px或14px。一次只调整一个层级。

3.3 最小可读字号(驾驶场景)

这是今天最关键的硬知识。

最小可读字号,不是「能看清」,而是「在驾驶中,扫一眼就能准确理解」。这两个概念差远了。

我直接给结论:

  • 静态场景(停车、充电): 最小可读字号为12px。但建议不低于14px。
  • 低速驾驶(< 30km/h): 最小可读字号为14px。注意,这是底线。
  • 高速驾驶(> 60km/h): 最小可读字号为16px。低于这个,就是在挑战驾驶员的反应极限。

警告: 我曾经见过一个项目,把导航的次要路名设成了11px。测试时,驾驶员在高速上为了看清那个路名,视线离开前方超过2秒。2秒,60km/h就是33米。这个距离,够发生很多事了。

为什么会这样?因为驾驶中,人的视觉注意力是「隧道化」的。你越努力去看清一个小字,你的周边视野就越窄。说白了,小字不仅看不清,还会让驾驶员「盯死」在那个点上。

所以,我的避坑指南是:

  • 所有驾驶中需要阅读的文字,不要低于16px。
  • 所有需要「理解」的文字(比如警告、提示),不要低于20px。
  • 所有需要「立即反应」的文字(比如时速、限速),不要低于32px。

嗯,这里要注意:我说的「文字」,是指中文字体。英文字母因为结构简单,可以适当小1-2px。但中文不行,笔画太密了。

最后,分享一个我自己的测试方法:设计完成后,把界面截图发到手机上,然后开车时(副驾有人)让朋友帮你读一下。如果你需要「眯眼」才能看清,那这个字号就小了。相信我,这个测试比任何规范都管用。


公众号:蓝海资料掘金营,微信deep3321