HMI交互设计详解（上）

编辑导读：HMI是“人机接口”的缩写，也叫人机界面，凡参与人机信息交流的领域都存在着人机界面。本文以汽车场景为例，分析其HMI交互设计，希望对你有帮助。

本文章会涉及到一些专业术语，我会详细给大家讲解，如还有疑问就给我留言讨论啦，我可是一个颜值和才华并存的知识博主，哈哈哈开玩笑🤪。

智慧城市的建设趋势越来越显著，政府对于汽车智能化、信息化发展非常重视，汽车驾驶体验感与个性化的设计也会成为我们对于汽车选购的参考和方向，自从人们对于用户体验的重视，人机交互设计工作内容也成为重要环节。

再谈到HMI交互之前先给大家拔一下傻逼栓，我们做的交互场景是有车辆行驶的，所以首先是要考虑安全因素，美观其次，因此在特殊环境下操作车载系统，我们无法用传统移动端沉浸式的设计思维来设计车载的界面与功能，需要放下所谓的美学，紧扣实际场景下的交互方式与用户需求来设计，因为在极短时间内导致我们必须对所有可能用到的功能入口一步即达，对信息的布局必须做到一眼即见。

尤其是UI设计师转交互岗的时候，第一想法就是怎么把设计做好看，然后再去反推交互，在很多项目紧急的时候我们就是这么干的（因为我们项目已经做了很多，就避免那些错误）刚入行的设计师可千万别这么干奥，谨记！！！

一、粉丝的疑问 🥳 🥳？

之前很多小伙伴会经常问到我怎么做HMI设计呀？参考那里去找呀？HMI的用户体验该怎么去做？竞品分析怎么做？等等好多好多问题呀🙄🙄 ，我也会经常和同行进行多交流学习。

我这边的方法就是，多去参加车展、或者去预约门店进行试驾体验，然后拍照📷就有素材，也可以去找一些车评人看他们视频，对于车的功能测评，最后就是可以去各大车的官网去寻找素材，还有一点就是要和同行的小伙伴们一起探讨、分享，如果实在不想找了，那大家就多多关注我呗，我收集很多资料，以后都可以分享给大家。

二、车内的显示屏分布

接下来我们简单的介绍一下车内屏幕的类型，主驾驶前面的仪表盘、HUD和中控屏幕，副驾驶和后排的娱乐屏幕。

1. 仪表盘

当今纯液晶屏的仪表盘占市场主导地位，纯机械、灯显、段码将退出历史舞台。我这边就不介绍仪表盘的发展历史了，如果你们感兴趣，就告诉我，我在安排小文章。

2. HUD

平视显示器（Head Up Display），最早是航空器上的飞行辅助仪器，运用在战斗机上，由于战斗机上很多信息需要飞机驾驶员随时查看，避免驾驶员低头看仪表而分心，随后又普及在民航客机上，由于HUD的方便性以及能够提高飞行安全，这项技术后来也发展到汽车行业，汽车搭载的HUD抬头数字显示功能，是利用光学反射的原理，将重要的行驶信息胎压、速度和转速等信息投射到驾驶舱前段玻璃上面，在驾驶过程中不用分心看仪表盘，减轻眼睛的疲劳，给驾驶带来便利和安全。

3. 娱乐屏幕

后排娱乐屏更像是一个平板，主要功能点为视频、音乐、游戏等等，帮助后排乘客打发时间，所以后排的娱乐系统就是为娱乐而生，后排乘客在互不干扰的情况下观看各自喜爱的视频影片，体验感觉还是蛮好的。

三、交互基础内容

驾驶员和屏幕之间交互必须简单，不分散注意力，并且易于中断，因此驾驶员的注意力可以迅速回到道路上。

导致HMI的交互和其他移动端不同的交互方式，因素有很多，例如：操作区域的面积、主驾驶与屏幕的角度、位置、运用场景等等，也有共同特征可用性、易用性、用户体验流程之类的。

1. 交互场景

在不同运用场景下，交互方式也会有所不同，比如静止状态、驾驶中（这是关于驾驶位置的场景），还有一些关于环境和驾驶中的状态都要考虑进去（晴天、雨天、下雪、大雾、超速、疲劳等），都需要细致的定义，第一考虑要素就是安全驾驶，不注重安全的交互设计都是耍流氓。

四、车载交互“三秒设计”原则

第一秒 ➡️ 视觉

用户在0-1s的时间内，对中控进行扫视，在这个过程中，中控屏幕重要信息与功能入口必须能被用户在这个时间以内发现，这边就可以通过大小、颜色、在屏幕中的位置，后期可以通过眼动仪来进行可用性测试，最后可以适当调整，达到安全驾驶标准。

注意点：

1.🙅 不可以让用户多次将视角中心移动到中控屏幕，来查看内容

2.🙅 不可以让用户花费过多的时间来搜寻屏幕上的信息

第二秒 ➡️ 行为

用户在交互行为过程中 Start ～ End 结束，时间不能超过2秒，2秒已经比较危险了，1秒内为最佳交互时间，这块内容下面会有详细讲解。

注意点：

1.🙅 避免让用户点击两次才能完成，功能要一步即达

2.🙅 不要让用户进行滑动或长按的交互方式

第三秒 ➡️ 反馈

在交互行为过后，在第三秒则必须要有反馈内容，比如明确的点击效果反馈，可通过声音或者界面动画，一旦超过3秒后的动画，反馈将脱离用户的有效感知时间，将不能很好的体现反馈本身的价值。

注意点：

1.屏幕显示内容变化反馈需要明显的引导动画转场支撑

2.去掉过多装饰性的动画，别整那些花里胡哨的动画效果，让反馈效果更加聚焦，车载的动画效果和移动端是不一样的

按照三秒原则设计，车载系统才可以符合可用性。这块内容先普及一下大家，这次先以介绍交互内容为主，车载视觉、动效内容再后续跟进输出文章。

五、交互定义详解

我们就直接奔入本章节的主题吧，本文我会从八个小点出发，详细的讲解车载的交互内容。

1. 单次交互操作时间

直接抛出结果 ➡️ 单次交互操作动作不能超过2秒（1秒内为最佳）在前面我们也简单的提到了交互的行为内容，如果一个在行驶过程中需要交互操作的动作用时2-3秒就已经是一个危险状况。

为什么这么定义，假设一辆以60km/h的车速如果2-3s盲开就会开出 35-50m，一旦需要急刹车那么刹车距离至少15-20m

以此计算当高速路上行驶车速100-120km/h 可想而知，极其危险，可能车毁人亡，所以我们呼吁安全驾驶，谨慎变道尾，保护自己也是保护他人。

经过实际调研过，用户将视线从路面移动到车内屏幕上，这个过程通常需要 0.5-1.5 秒对焦，所以可交互的内容需要明确被标出来，与不可交互内容保持足够的对比。

统计下来平均每次操作，即视线与注意力专注在车载上的时间，无法超过三秒。事实上，当进入第三秒时，已不得不需要利用余光开始注意前方路况了。

因此，在三秒以内，无论是用户第一次操作失败，重新注意路况后，再重复操作，还是用户持续操作直到任务完成，都是非常危险的行为，在这里，由于用户试错的成本非常巨大，也因此交互的设计与信息布局的设计都需要做到最极致。

小插曲：

这边就有人会说了现在都有紧急刹车（AEB）系统了，那我们简单介绍一下，AEB（Autonomous Emergency Braking，自主紧急制动）通过传感器(摄像头、雷达、激光等)识别车辆前方障碍物，当车速与障碍物距离低于预设安全值时，制动系统介入，避免碰撞，AEB是用来帮助驾驶员避免或减轻碰撞事故的系统。

AEB系统主要干两件事：