1

车载UI概述 车载HMI发展史

设计原则 · 车载vs移动端UI区别

2

设计工具 Figma / Sketch

组件库搭建 · 设计规范文档

3

图标基础 功能/状态/警示

图标网格 · 像素对齐 · SVG导出

4

控件设计 按钮 · 开关 · 滑块

主/次/幽灵 · Toggle · 进度条

5

仪表盘 时速/转速表

电量油量 · 警示灯布局

6

中控导航 地图 · 路线规划

搜索框 · 历史记录 · 语音交互

7

深色模式 配色 · 对比度

深色主题 · 可读性 · 图标适配

8

动效微交互 缓动 · Lottie

动效原则 · 手势反馈设计

9

多屏交互 仪表+HUD+中控

信息流转 · 跨屏一致性

10

语音交互 唤醒 · 多轮对话

语音+触控混合交互

11

驾驶安全 分心驾驶原则

最小交互路径 · 紧急UI

12

车载字体 无衬线 · 高可读

字号层级 · 多语言适配

13

色彩品牌 品牌色应用

色彩心理学 · 色盲友好

14

响应式布局 屏幕适配

横竖屏 · 分辨率自适应

15

组件库 Button · Card · Modal

Toast · BottomSheet 设计

16

设计系统 Token · 状态

Normal/Hover/Active/Disabled

17

用户研究 车载场景画像

可用性测试 · 眼动追踪

18

原型交互 Figma连线

ProtoPie · 车载模拟器

19

无障碍A11y WCAG标准

屏幕阅读器 · 高对比度

20

娱乐系统 音乐 · 播客

视频播放 · 游戏界面

21

车辆设置 空调 · 座椅

驾驶模式 · 车辆健康

22

充电/加油 桩查找 · 进度

支付流程 · 加油引导

23

通知提醒 优先级 · Toast

Banner · 勿扰模式

24

手势触控 单/双/三指

防误触 · 触控热力图

25

AR-HUD 导航箭头

车道引导 · 行人标注

26

AI助手 形象 · 对话

意图推荐 · 情感化交互

27

多模态交互 触控+语音+手势

视线融合 · 冗余设计

28

性能优化 渲染 · 帧率

资源加载策略

29

国际化 RTL · 文化适配

本地化测试

30

未来趋势 3D · 全息 · 脑机

元宇宙车载场景