1、色彩基础理论：色相、饱和度、明度，以及它们在车机UI中的视觉影响

各位同学，咱们今天聊点最基础，但也最容易被忽视的东西——色彩的三要素。

做车机UI这几年，我见过太多设计师把精力全放在图标和布局上，结果一上实车，屏幕在阳光下白茫茫一片，或者晚上开车时刺得眼睛疼。说白了，根子就在色彩基础没打牢。

好，咱们一个一个来拆。

1.1 色相（Hue）——颜色的“身份证”

色相，就是颜色的名字。红、橙、黄、绿、蓝、紫……这些就是色相。在色相环上，它们按顺序排成一圈。

在车机UI里，色相决定了整套界面的“性格”。

• 蓝色系：科技感、冷静、安全。我做过一个项目，客户是传统车企，他们死活要用深蓝色做主色调。嗯，其实挺聪明的，蓝色在夜间驾驶时对眼睛刺激最小。
• 红色系：警告、运动、激情。但注意了，红色在车机里不能大面积用。为什么？因为红色在低亮度环境下会显得特别“脏”，而且容易让驾驶员产生焦虑感。
• 绿色系：环保、健康、通行。新能源车特别喜欢用绿色，但说实话，绿色在强光下辨识度很差，我建议只用在辅助功能图标上。

1.2 饱和度（Saturation）——颜色的“浓度”

饱和度，说白了就是颜色的鲜艳程度。饱和度越高，颜色越“冲”；饱和度越低，颜色越“灰”。

我在项目中遇到过一件事：一个刚入行的设计师把导航路线的饱和度拉到了100%，结果在实车测试时，驾驶员说“看着像要撞上去了”。

为什么会这样？因为高饱和度的颜色会抢占视觉注意力。在驾驶场景下，这非常危险。

我的建议是：

• 主色调饱和度控制在60%-80%：既有辨识度，又不刺眼。
• 警告色饱和度可以到90%以上：比如低电量、碰撞预警，就是要让你一眼看到。
• 背景色饱和度控制在10%-30%：别让背景抢了内容的风头。

1.3 明度（Brightness）——颜色的“亮度”

明度，就是颜色的亮暗程度。明度越高，颜色越接近白色；明度越低，越接近黑色。

这一点在车机UI里特别关键。你想想看，车机屏幕的使用环境有多复杂？从地库的昏暗到正午的暴晒，跨度极大。

我曾经犯过一个错：把某个功能按钮的明度设成了85%，在室内看着挺高级。结果一上路，阳光一照，按钮和背景完全融在一起了，根本看不清。

所以，我总结了一套明度控制原则：

使用场景	推荐明度范围	说明
主文字/图标	70%-95%	确保在任何光线下可读
次要信息	40%-60%	比如时间、温度等辅助信息
背景/装饰	10%-30%	深色模式可以更低
警告/紧急信息	80%-100%	必须一眼可见

1.4 三要素的协同作用——别单独看一个

色相、饱和度、明度，这三者是绑在一起的。你改一个，另外两个就得跟着调。

举个例子：你想用蓝色做主色调。如果饱和度太高，明度就得降一点，不然太刺眼。如果明度太低，饱和度就得提一点，不然看不清。

我习惯的做法是：先定色相，再调明度，最后微调饱和度。顺序别搞反了。

1.5 实战建议：从“三要素”到“设计规范”

好了，理论讲完了。咱们来点实际的。

如果你现在要开始一个车机UI项目，我建议你这样做：

1. 先定品牌色：根据品牌调性选1-2个主色相。
2. 建立明度阶梯：从10%到100%，每10%一个档位，测试在不同光照下的表现。
3. 控制饱和度上限：除非是警告信息，否则饱和度不要超过85%。
4. 做两套配色：一套日间模式（高明度、中饱和度），一套夜间模式（低明度、低饱和度）。

记住一句话：车机UI的色彩设计，不是让你做艺术品，而是让你做“安全且好用”的工具。色彩用对了，用户甚至不会注意到它；用错了，用户会一直觉得“哪里不对劲”。

好，这一章就到这儿。下一章咱们聊聊“品牌色在车机中的落地策略”，到时候我会拿几个真实案例来拆解。