一万六千字干货!从零开始学习HMI车载设计

HMI(HumanMachineInterface)一般指的是人机交互,但是随着新能源汽车的发展,现在多被应用于汽车行业,是车辆驾驶员与汽车之间进行交互和信息交换的枢纽与媒介,也是未来车企发展的重点,正在向着多模式方向发展,另外随着5G行业的发展,需要落地的场景也是比较多的,在目前看人,HMI的无人驾驶也是目前5G落地的第一场景。

2.移动APP与HMI设计的区别

手机端的系统发展已经快10余年了,我们的手机端的设计思路是不能直接搬到车载端的设计上的,而且车机端的设计和手机端设计在交互和使用场景上都有很大的区别,所以,为了更好地服务于车机端的用户,总结了以下车机端与手机的区别作为对比,已示区别:

①移动APP设计侧重点

商业侧

交互

另外,在交互上也是不一样的,我们的APP一般是通过右手滑动去操作,而车机端主要是以右手的食指为主,通过手势、语音,另外也会用胳膊去操作中控屏,所以,我们车机的触控区域一般会做的比较大,方便用户去操作。

屏幕

我们常用的手机端,无论屏幕怎么变大,它都是为人的单手握持去设计和适配的,而车机端的思路可能不一样,它的屏幕主要是分为横屏和竖屏两种模式,有时候因为为了迎合审美和车内的整体搭配,尺寸可能都不一样,但是,大部分为了保证车主可以方便操作,为了安全性,一般会做的比较大。

使用场景

我们车机的使用场景一般是在车内,正常情况下,是我们开车准备去目的地前的一些准备工作,例如开启导航、或者听歌音乐之类的,所以,我们的车机很少有浅色界面的,大部分是深色的界面。

②车载HMI设计侧重点

其次设计的过程中也需要考虑车机的硬件,有的功能的加入和应用的场景,需要看车机的硬件是否支持,例如常见的倒车影像、传感器、辅助驾驶,都需要一定外部的硬件支持。

移动APP与车载HMI最大的区别就是更新的频率,国内在互联网环境在前几年属于大红海期,基本都是小步快跑的迭代模式,更新的频率比较勤快,而车载HMI则更新频率比较慢,它考虑的因素会比较多,因为在升级的过程中需要车一直开启,但是我们在开的过程中也不可能升级,一旦升级也容易变成砖,会导致整车都不能用,所以我们一般会在车出厂的时候就需要设置好。

3.车的分类

我们目前公开信息可以查询到的车的种类也是比较多的,通常我们新能源汽车BC级的居多,而跑车比较重视性能,所以新能源的车型会比较少,而其他BC级的新能源汽车大多数的比双联屏和副驾为主,比较特殊的特斯拉,只有一整块屏幕。

4.车载屏幕的构成与占比

在车载HMI的设计中,车载的屏幕是最重要的构成。科技的发展,社会的进步给人们的出行带来越来越好的体验,汽车的人机交互也日新月异,更新换代很快,我们每辆车所处的市场定位和针对人群也是不一样的,所以,针对不同的市场,我们车辆上的屏幕的数量和功能的划分也是不一样的,我们一起来看看各种型号的车和屏幕的占比。

一般车载的屏幕分为前排驾驶屏、副驾驶屏,和后排娱乐屏。

①前排屏的构成

车辆的前排分为主驾驶屏和副驾驶屏,通常以HUD(AR-HUD、3D-HUD)、流媒体后视镜、副驾驶娱乐屏所构成。主驾驶主要是需要给司机提供车辆的行驶信息,如车辆的时速、水温、转速、电量/油表等,这些信息占据的主驾驶的屏绝大部分的显示区域,除了行驶信息,主驾驶还需要提供汽车设备信息,如空调温度、车窗、座位的角度和温度等,最后一项需要显示的就是车辆的娱乐功能,但是也不会涉及比较复杂的娱乐。

而副驾驶屏需要用的地方会比较少,但是通常是“智能座舱”的重点发力部分,通常高端旗舰车会配有,我们主要需要提供75%的汽车设备的信息,如空调温度、车窗、座位的角度和温度等,驾驶的信息,如车辆的时速、电量/油表,只需要提供少量的信息,大致在8%左右,剩下的占用比较大的可能是影音娱乐,如爱奇艺,腾讯视频之类的,这些可能会占用70%左右,但是我相信大部分人也不会在副驾驶去使用这些,因为车辆在行驶的过程中,看视频,可能会晕车,其次是这些应用会产生比较大的流量。

②后排屏的构成

车辆的前排分为后排娱乐屏和后排底部控制屏,通常以娱乐屏、后排控制屏和空调控制盘构成。后排娱乐屏的需求会比较小,一般只有高端车会配有娱乐屏,或者换个角度想一想,我们在一辆行驶的高端红旗汽车上,坐在后排一般说什么人,通常是领导或者客户,这类人群通常在后排只需要看个文档或者文件,或者调整下座椅的高度,所以后排的主要设计是需要考虑到车的体验到操作和办公和娱乐的需求。

③中控和仪表

中控和仪表是我们设计师最主要的工作的内容,中控和仪表对于车辆是比较重要的,它在低端车型上由于配置比较低,为了保持车辆在正常的运行,我们应该保持简单的设计,除了必要的信息,其他的可以省略掉。

5.智能座舱详解

伴随着电动车销量在2021年的巨大胜利,汽车智能化逐渐被提到台前。智能座舱作为一项车内服务,目前被越来越多的车厂提出,并作为主要卖点和议价手段。

随着互联网和5G技术的快速发展,数字座舱逐渐被应用于汽车。比如说,全液晶仪表、车联网、车载信息娱乐系统IVI、ADAS高级驾驶辅助系统、语音识别、手势识别、HUD、AR、AI、全息、氛围灯、智能座椅等方面。

那什么是智能座舱呢?所谓智能座舱,指的是对汽车内部的乘坐空间进行改造,使得驾驶和乘坐体验能够更加舒适和智能化。根据GGII的报告,目前双屏交互、智能语音、车联网、OTA,是目前市场主流智能座舱的基本配置。座舱可以显示更多信息,更好地保障车内驾驶安全、提供车内更舒适的驾驶环境,是智能座舱的核心产品理念,智能座舱关键的特征就反映在智能化两字上。这类座舱里会改装多几台显示器,操作步骤也会从传统的的按钮实际操作改成触碰或语音聊天操作。与此同时,还配有多种多样感应器和AI智能产品,,可以给予更舒服的驾驶感受。

①智能座舱的发展史

早期的汽车只是一个纯机械时代的产物,它是马车的升级版,当时人们对它的认知只是一个普通的代步工具,并没有其他的追求,在20世纪初期的汽车主要由4个部分组成:引擎、传动系统、悬挂系统+车轮、车身。

到60-90年代,汽车座舱开始有了今天的雏形。早期座舱信息只服务于驾驶者,显示基本驾驶信息。主要包括机械式仪表盘及车载收音机、对讲机等设备。这些设备的操作基本都是物理按键形式。可提供的信息也只有车速、发动机转速、水温、油量等基本信息。

在90年代(1990年-2000年),汽车还属于机械座舱时代,用途也是查个地图,导航一下。连个手机蓝牙或者插上U盘听歌。在这个阶段,座舱的便利功能主要依靠将电子设备“搬”进车内来实现,功能之间的整合也不是很完善。

而能说到智能座舱,应该是在2015年开始的,大尺寸的中控屏开始流行,正是在这一年,特斯拉开始把中控和仪表合二为一,部分车型开始采用HUD显示、流媒体后视镜等一系列汽车配件电子化的尝试。

随后,特斯拉带动了新能源汽车的发展,也就开启智能座舱的元年,越来越多的厂家开始把大屏和丰富应用落地到汽车的场景中,目前智能座舱主要构成可以分为硬件(座舱芯片、HUD、电子后视镜等硬件)、软件、操作交互(语音识别、人脸识别、触摸识别、生物识别)的三大部分。

6.汽车的基础知识

在入行HMI之前,我们也要对汽车的基础知识有个基础的了解,就像我们刚入行UI设计的时候一样,需要对各种手机的屏幕和生产厂家有个基础的认识。

①汽车常见的厂家分类

②汽车常见的车牌种类

新能源车牌颜色不同于燃油车车牌,新能源车牌颜色为绿色,而燃油车牌为蓝色,其次新能源车牌号是6位数,而燃油车牌号是5位数。燃油车的数字最多只有两个字母,新能源车牌号有F和D开头的号牌,F开头的车牌为油电混合车型,D开头的车牌为纯电动车型。

了解新能源汽车的车牌对我们设计有什么帮助吗?我们开过车的都知道,在有些场景,需要设计输入车牌的界面,所以,我们需要了解车牌的规则。

7.常见的汽车硬件

汽车的设计和手机UI设计不一样的是,有些功能需要与硬件结合进行设计,很多功能需要考虑与硬件的搭配,所以当入职后,为了快速的融入团队,我们需要对基础车上面的硬件有一定的了解。

①汽车芯片的种类

汽车芯片的三大类:1、整车域的MCU。2、自动驾驶域的AI芯片。3、智能座舱域的CPU。这三大门类都需要芯片,但是难度系数却相差很多。汽车芯片从MCU到自动驾驶座舱,虽然有如些MCU芯片的弱鸡性能让汽车的面子有点挂不住,那自动驾驶领域的AI芯片可以说是扳回一城了。

车载AI芯片

汽车产业正经历从“机械定义汽车”到“智能定义汽车”的时代,而电动车无论是车载芯片的数量还是质量,都要显著高于燃油车。随着新能源车渗透率大幅度提升,智能驾驶渐行渐近,而汽车AI智能芯片正是其中的“核心支点”。

与手机芯片不一样的是,我们手机上的芯片迭代会比较快,基本1-2年就会更新迭代一次,像苹果手机的芯片会更快,基本一年就会迭代一次,而车机芯片却不一样,它更加追求的是稳定,是对芯片的调教与整合,基本5-10年才会迭代一次。

NPU算力

近几年NPU特别火,我们可以理解为NPU就是AI芯片,普通芯片就是CPU。在自动驾驶和智能座舱都离不开NPU。

换句话说,npu是具备智能和学习的特性,也就是说这个处理器它是会模仿人的大脑神经网络的。

在工作模式上,CPU主要是负责低精度,各种普通的数据,npu则是人工智能算法上面运行效率要高于另外两者。

NPU的算力越高,能支持复杂的设计模式就越多,例如复杂炫酷的动效还有精致的图标等,反正,算力不够,在车机上运行复杂的动效就会卡。

智能座舱芯片(SoC)

提到智能座舱芯片,不得不看高通骁龙8155芯片。

高通的8155芯片是一枚强大的智能座舱SOC芯片,全称是SA8155P,它采用7纳米工艺制造,具有八个核心CPU,算力为8TOPS,也就是每秒运算8万亿次,它可以最多支持6个摄像头,连接4块2K屏幕或者3块4K屏幕,支持WiFi6,支持5G,支持蓝牙5.0。

值得注意的是,8155芯片并没有独立的NPU内核,AI计算主要通过DSP、CPU和GPU组成的AI引擎完成。其中,Hexagon690拥有7TOPS的AI算力,加上CPU、GPU的AI算力之和为8TOPS。而在制程方面,高通8155采用台积电N7工艺,也就是第一代7nm工艺打造,与骁龙855以及855+属于同一代产品。

整车MCU

在智能化未普及之前,早期汽车是纯机械产品。那时的发动机并没有电子控制器、车窗也只有机械式控制,所以不需要任何芯片,更没有算力、图像处理这一说法。

在近几十年中,机械式的汽车逐步智能化。一次新增一个功能,就需要配备一个MCU(MicroControlUnit)。这种发展方式,造成了MCU越多,线束凌乱的现状。这也构成了传统车企缺芯的现象。

8.硬件-屏幕

UI设计与其它的设计不一样的是,UI设计的作品大部分是在屏幕上去展示,所以,我们对屏幕的了解需要像以前平面设计师对打印材质的了解一样,如数家珍,这样才能体验出HMI设计师的专业度,也避免在工作中出一些问题。

我们常见的屏幕可以分为横屏、竖屏和自适应竖屏。

①横屏

一般在车机端,横屏是比较常见的,也是大部分车载端都会搭配的屏幕形式,比较常见的车就是像理想和小鹏的车,都是由几块横屏去组成的自己的智能座舱。

②竖屏

竖屏的形式不太常见,因为在车内横屏可以更加美观地展示,竖屏一般作为辅助屏,来完成一些横屏不方便展示的功能,来增强智能座舱的实用性,搭配竖屏的车有蔚来和高合等一些汽车。

③自适应横竖屏

自适应横竖屏也是不常见的一种屏幕形式,也只有部分车辆上才会配有的屏幕,例如像比亚迪等汽车,它的好处就是一块屏就可以解决各种应用的场景,它正常的是横屏,像看抖音情况下也可以竖过来。

①屏幕参数-元器件分级

我们根据行业的不一样,我们所使用的硬件和规格是不一样,通常我们常见的第一级是我们消费级,例如我们常见手机和IPAD上使用的屏幕,它的官方建议运行温度是可以在0℃-35℃这个区间能正常运行,第二级属于工业级,即在工业范围内可以使用的显示器,通常可以在-20℃-70℃的工作范围内去使用,第三级是车规级,也就是汽车的显示屏,它的温度范围是需要在-35℃-70℃的温度范围,车规级的显示器的要求也是比较严格的,通常出厂需要经过几十项专业的测试才能达到标准,其中包括了防尘测试、震动测试、EMC电磁环境兼容性测试,极限温度试验、耐久试验、冲击试验等,第四级是军规级,也就是军用级笔记本,它的运行环境是-55℃-25℃,需要满足三防,盐雾/耐电磁干扰,第五级是航天级,也就是航天器上使用的设备,主要是用在卫星、飞机、火箭上的材料。

那么这些对我们的设计有哪些影响呢?我们一起来看看吧。

英寸

我们设计车机端的设计和手机端的设计最大的区别可能就是尺寸不一样,手机端现在主流的尺寸都是在6英寸左右,规范也都是在ios、安卓或者其他主流厂家的规范内去做设计,而在车机端是没有一个固定的规范的,只能靠自己去摸索。

英寸属于一个英制的单位,换算成常见的厘米是1英寸=2.54厘米,那我们常见一些比较车机屏幕基本都超过10英寸,且每家的尺寸都不太一样。

分辨率

分辨率,就是我们通常通过软件去建立画板的尺寸,与手机不一样的是,手机端端设计可能需要通过一稿去适配很多不同的尺寸,而在车载端,只需要设计一个尺寸就可以了,通常分辨率越高,所包含的像素就越多,图像就越清晰,通常计算分辨率的办法就是用水平像素*垂直像素。

常见的车载尺寸是10.25英寸和12.3英寸的,分辨率通常是1280*720(16:9)和1920*720(8:3),基本市面上80%的都是这个尺寸,另外还有一些比较老款的车型可能会搭载8寸的显示器,分辨率是1024*600.

对比度

对比度是指投影图像最亮和最暗区域之间的比率,比值越大,从黑到白的渐变层次就越多,从而色彩表现越丰富。通常在车载端中,对比度为800-1000:1,低对比度会造成画面偏白,以真实的屏幕为准,具体的可以通过我们自己去PS中的cameraraw滤镜进行感受。

像素密度(PPI)

PixelsPerInch也叫像素密度单位,所表示的是每英寸所拥有的像素数量。因此PPI数值越高,即代表显示屏能够以越高的密度显示图像。当然,显示的密度越高,拟真度就越高

通常在手机端,人眼在距离屏幕30cm时,PPI为300,便可以满足人眼的像素极限了,而在车机端,人眼需要在距离70cm时,PPI为150,便可以满足人眼端极限像素,所以车机端端PPi一般为150,这个会影响文字和图标的大小。

可视角度

可视角度是指用户可以从不同的方向清晰地观察屏幕上所有内容的角度。车载端角度为单边80度,基本平行,画面不扭曲,个别屏幕有色彩。

亮度-尼特(Nit)

尼特(Nit),一个亮度单位,过低的亮度会造成屏幕过暗,在阳光直射的情况下,会看不清,在车载端,通过这个值会在800-1000,在户外情况下,800以上对设计的影响比较小。

照度-勒克斯(lx)

这个通常指的是光照强度,在家居室内约为80lx,在室外约为4500lx,室外高强度光照情况下,对应屏幕内容要求可见度高。

9.车载端系统

与手机端不一样的是,车载端的系统分为底层系统、定制系统和操作系统。

①车载端系统-底层系统

QNX

linux

安卓

主要是以中控为主,也是一个开源系统,借着手机端东风,它的生态应用会比较丰富。

二、HMI的设计规范

1.HMI设计与手机端的不同之处

我们都知道HMI车机端的设计和手机端是不一样的,我们也听很多人也都提过,车机端需要将安全放在第一位,,但是这些不同到底会造成什么样的影响呢?车机端需要注意哪些地方来适用使用场景,这些问题我们考虑过吗?我们可以从三个角度去思考:空间的变化、使用状态的变化、定位的不同。

①空间的变化

目前车机上主流的设计方案还是放置在前排的座椅中间靠前的位置,屏幕和车辆左右对称垂直。以特斯拉为代表的大屏完全代替按钮的方案中,屏幕向下延伸比较长的距离,而以传统车企发展出的横平方案,屏幕位置相对比较高。

这说明车机肯定不在司机的正前方,无论是司机转动眼球,还是转动头部,甚至是转动上身,在当前主流的产品中,司机都不能正对车机的方式来操作。

另外对于模仿特斯拉竖向大屏的车机,应当注意到,在目前个人消费的电子产品中,还是很少出现这种尺寸+这种操作距离的组合。比17寸车机还大的屏幕,估计也只有电视盒类似于火车站购票机之类的设备,但是前者的操作距离与车上完全不同,后者的使用场景和车机完全不同。

②使用状态的变化

我们在使用车机的过程中,其实是在驾驶的,用身体一侧的单手来操作,这其中包含了几种使用场景:

所以,当前的手机端的设计和交互规范更多的是满足用户单手握持去使用,全程无其他干扰,所以,很多在手机端比较好看的设计,例如大留白,深层级这样的设计,在车机端是很不友好的,一些无边框的按钮在司机扫一眼的过程中是很难被注意到,所以车机端合适的按钮反而是那种大色块和粗大的点击按钮,以最大的限度去方式司机去点击。

③定位不一样

其实是我们需要了解到,车机端的定位本身就和手机的定位是不一样的,比如,我们手机APP的核心是以屏幕就可以交互一切,手机的按键和HOME键的使用率是很低的,以至于在全面屏的时代,全面取消了按钮。如果我们想做出一款优秀的体验的车机HMI设计的时候,车机的屏幕和手机的屏幕完全不一样,我们可能会利用屏幕以外的设备甚至车上的其他设备来进行与车主进行交互互动。

比如当有弹窗消息需要通知用户的时候,按照传统APP的思路就是做一个弹窗浮出然后自动消失,或者是需要用户自己确认然后去点击,这样也会造成操作的负担,面对这样的场景,我们是否可以从车上的其他角度去入手,例如,用车内的声音去提示,或者氛围灯,这样跳出屏幕的交互也许会更有想象空间。

2.HMI适配

我们在设计APP的时候,通常以375*812来设计界面,但是车载HMI端的设计可能会不一样,因为绝大部分的车机运行的是安卓系统,所以我们大部分以安卓的规范来做。

HMI常见单位详解:

DP(密度独立像素)

SP(尺寸独立像素)

SP主要用于字体显示单位,与刻度无关的一种像素,与dp类似,但是可以根据用户的字体大小首选项进行缩放。DP与SP的换算为1:1,但是它的特点是能调整字体的尺寸,但是无法调整图标的大小。

PX(物理像素)

PX即像素的单位,1px代表屏幕上的一个物理像素点。“pixel”的缩写,像素。是画面显示的基本单位,真实的像素并不是点或者方块(虽然有时这样显示),也没有实际固定长度,只是一个抽象的取样。设计中的像素和实际显示屏上的像素相对应。

①屏幕密度

在车机端每个车辆因为价格不同,车机上所配备的屏幕素质也是不一样的,而在不同的屏幕设备的密度中,相同物理单位下的高密度设备中,每个物理单位的像素尺寸高于低密度屏幕。

②屏幕密度

通常在车机端的屏幕尺寸也是很多的,这里整理了些市面上比较常见的车机屏幕,以4种等级的“标准密度”对屏幕密度进行分类,其中160为基础屏幕密度,1PX等于1PT。

③屏幕尺寸

在车机端的设计中,屏幕尺寸通常有两种,一种是16:9和8:3位基础的通用设计尺寸,并作为基础的适配设计屏幕。

④基准区域划分

在车机端,我们常用的设计板块分为4块,常见的划分是:标题栏、顶部间距、两侧间距、底部间距。

⑤尺寸适配

在车机端的设计中,我们的适配原则通常是适配尺寸区间范围内,若小于或大于区间则需要重新去设计,单独适配。

通常标准的宽高区间比,以3:5适配宽高比为最大值,1:3为最小值。

⑥元素适配原则

在车机端的适配原则中,如果出现单个元素需要适配屏幕,我们通常以拉伸、缩放、占比、隐藏、折行、拉伸、均分这7个原则来适配,其中,适配原则可以单独的应用,也可以组合多原则应用,根据实际情况去灵活应用。

3.字体规范

在设计中,我们通常使用字号来区分内容的主次关系,字号关系的合理运用可以让内容更有韵律和节奏感。而在车机端的设计场景中,为了能模拟真实的使用场景,通常是通过实车的使用场景去反推像素尺寸来设计。保证在驾车环境下信息的有效识别,常用字号规范为:32、36、40和44(dp)。

下面是某车载品牌中控屏幕12.3寸的常用字号,仅供参考。

①屏幕一样大,分辨率不一样,字号怎么选?

在车载端端设计中,经常会遇到这样的一个问题,就是屏幕是一样大的,但是它的分辨率不一样,这个时候,我们的字体大小该怎么去选择呢?

我们首先来说结论,它们的字号是不一样大的,我们要知道在车载端的一个概念,就是毫米的概念,我们在车载端字体和图标的大小不是PX也不是PT,而是毫米(MM)而在荷载端最小的字号为5mm.而12.寸的屏幕1920*720换算成毫米应该是292mm*201mm。

那我们毫米(mm)和像素(PX)怎么换算呢?1CM像素=水平像素/实际尺寸,即实际像素=屏幕英寸(12.3)*1英寸(2.54)=31.2,那么再用总长1920/31.2=61(每1mm像素),然后61(每1cm像素=6.1(每1mm像素,最后。(每1mm像素*5mm=30px(最小字号)。所以,根据这个公式,我们可以得出,在实际尺寸一样的时候,像素不一样的时候,我们的字号也是不一样。

②字体识别度

4.HMI车载的颜色规范

车载端的颜色规范是组成我们HMI设计比较重要的一部分,合适的色彩搭配能让我们的设计给用户眼前一亮的感觉。我们先来看看关于最近车驾照的考试资格,看哪些能影响我们设计和色彩搭配的因素我都用红色给标注出来了。

首先是年纪,我们车载端的设计基本是给成年人去使用的,因为取消了70周岁的限制,所以,我们在设计时候要考虑到适老化的设计,保证符合老年人去使用,其次是不用考虑视力障碍的人群,基本我们默认为都是正常的视力。

在车载端色彩是运用中,中性色主要是运用在文字部分,其次是分割线、背景、边框等设计场景也会使用,有彩色是为了明确信息和状态,颜色的选用需要尊重用户的基本认知,例如成功、失败、提醒、外链等另外其他的色彩对比度和饱和度来保证车载环境下的有效识别;品牌色的合理运用,则是传达品牌调性的好方法。

5.HMI车载设计原则

①表意清晰

在车机端的设计中,我们首先要明白一个设计原则,就是HMI设计中,要减少浮夸的装饰,UI设计是为了表意服务,尽量要降低视觉噪音,给予司机能最快的操作路径,让司机能用完即走,等需要的时候在回来。

控制色彩

②布局简单清晰

我们国内的C端产品,一般都是“全能型选手”,设计感比较强,功能也会比较复杂,但是,对于用户来说,复杂的界面往往代表着理解的时候需要越长,例如,我们以前做UI的时候,都用过PS,他虽然比较强大,功能也很强大,但是有着更简单的且专注UI设计的软件sketch横空出世,一下就抢走UI设计的市场份额,sketch凭借的就是更为简单的布局,所以,不好用的UI往往是复杂的。

那按照这个规范,我们就可以将功能划分重要层级

6.车载端常见的功能划分

我们常见车载端的功能一般会分为这几个区域,一个是状态栏,一个是菜单栏和底部的DOCK栏。通常上面的部分属于视觉感知比较强的部位,下面属于感知比较弱的区域。

我们为什么会这么去区分呢?因为,根据我们人体可以操作的部位,中间的属于方便操作的部位。上面的部位为们想要操作需要起身,下面也有可能会被手臂所遮挡。所以,我们常用的功能需要房子中间部位。

横屏的布局也和竖屏的差不多,就是就是DOCK栏的位置发生了变化。

横屏适合我们操作是离我们司机端最近的地方,这个地方大部分放的是需要操作的区域。次点击区域一般放的是需要展示的区域,最差的语言是需要放一些不太重要的元素。

三、HMI交互基础与规范

新能源汽车是现在发展很好的一个行业,随着HMI技术不断深入,新能源汽车行业也获得了新的发展机遇。我们来了解一下新能源汽车跟HMI交互的影响吧。

1.HMI交互设计

新能源汽车是现在发展很好的一个行业,随着HMI技术不断深入,新能源汽车行业也获得了新的发展机遇。车载端设计到今天,已经有百年的历史了,在过去的几十年里,人们还是比较注重汽车技术的发展,车载端的交互设计还没有被设计者重视,随着最近10多年,互联网行业的高速发展,新能源汽车也开辟了新的战场,加上自动驾驶和汽车辅助驾驶的出现,汽车从传统使用体验慢慢的转向平台化的趋势,智能设计和交互设计就变得重要,同时也遇到了很多新的挑战,尤其是最近几年,车载端的交互设计越来越引起人们的重视。

2.车载端触控

我们在跳出职能座舱来看,在现在已有的交互模式中,就都对应来人类的五感。

手势操作在车机端有一个好处就是使用者可以脱离实体输入设备端束缚,为用户提供更大范围、且一定模糊的交互方式,这样可以大大的节约沟通的成本,例如在奔驰S级的轿车上,这辆车搭载;MBUX智能感应助理可以捕捉驾驶员的手部动作,来进行辅助交互,例如,当驾驶员在后视镜前方或后方,挥手,就可以控制遮阳帘的开启和关闭。

①车载端触控-手势

手机端的触控对设计和交互的影响就是我们平时操作车机端时候的手势,需要把我们在手机上习惯用的多点触控的手势转换成单点触控的手势,例如我们在手机上习惯去两只手指去捏合图片去进行放大和缩小,而在车机端需要改为双击来进行操作。

②车载端触控-隔空手势

放眼国内,各家车厂的交互形式已经是白花齐放了,随着隔空手势慢慢的出现在各家车企的智能座舱中,在各方的质疑声中,车内手势的交互并没有停下,各家都交出了不一样的答卷。

在2018年的君马SEEk5,就提供了9种隔空手势交互,主要是由中控屏下方专属摄像头进行识别。

四指聚拢伸出指向左或者右边,则代表着切歌,左边代表着上一曲,右边代表下一曲。

不管是现在还是未来的自动驾驶,车内的手势交互都有着巨大的应用潜力。

3.HMI交互与移动端交互的区别

在移动端,手机厂家通过10多年的研究,设计出多种适合用户在各种场景下的符合手指的交互操作,而在车机端,往往需要照顾到用户的开车场景,车主通常是通过胳膊和食指去操作车机,而车机的屏幕载体大体分为两种,一种是横屏的,一种是竖屏的。

4.HMI交互原则

车机端的交互主要分为两种场景,一种是车内另外一种是车外的,车内的交互主要通过座舱内的各种零件和屏幕完成,车外是通过智能钥匙、移动设备(如手机APP)进行交互操作。

通常我们在设计车载交互时需要遵循以下三个原则:安全性原则、高效信息获取、让用户下意识操作、系统及时反馈。

①安全性原则

车载端的设计因为使用场景在路上,一切要以安全性为前提考虑进行交互设计。一个好的HMI系统会拥有很多信息的手机装置,司机端可以通过这些信息去预判很多实际驾驶中所遇到的情况,防止意外发生。

1)避免分散用户的注意力

自从手机出现,就变成了人人离不开的一件东西,即便是在吃饭的时候,或者是上厕所的时候,更有的甚至在开车的时候,手机都离不开手的,而因为低头看手机发生的事故,也是居高不减。所以,现代的车企所开发出来的HMI系统希望能取代我们的手机,希望用户更多的注意力在与车机的互动上,HMI系统应该在用户驾驶汽车的时候完全的取代你的手机,你需要再手机上去完成的事情,都可以在HMI大屏上去操作。

其次是屏幕在静止的状态是不要设计花哨的动画和动效,因为人眼多动的东西是比较敏感的,会转移人的注意力,动效的设计尽量动简洁,保证用户在开车的时候不要被别的东西带离视线,造成安全事故。

2)考虑系统的稳定性

我们在使用手机的过程中,应该多多少少都遇见过手机死机情况,这种情况都是因为手机的性能无法负载当前资源,但是我们车在行驶的过程中,要是遇到死机是比较危险的事情。

所以,我们要了解当前车机上所使用的芯片性能,通常,车机上的性能会比我们手机端的芯片要更新速度要慢2-3年,所以为了安全,我们要避免使用比较占资源的动效,导致车机运行起来比较卡,造成系统崩溃。

芯片大部分的算力会优先分配给仪表盘,其次才会分配给中控和副驾,因为大部分的新能源汽车中控出了问题车还可以开,但是仪表出了问题车就不能正常开了。

3)动态的信息反馈

在车载HMI中,及时和正确的信息反馈也是比较重要的,大部分的汽车都会配置各种各样的信息收集器,在这些设备的基础上,我们可以通过系统来实时查看和观测到驾驶舱内的一些情况,防止意外的发生,而HMID系统反馈主要分为两种,一个种是系统被动反馈,另外一种是系统主动反馈。

系统被动反馈

系统的被动反馈主要是HMI车载系统检测到车里的一些情况的被动提示,将车辆的一些情况主动反馈给驾驶员,例如,车辆现在正在行驶中的一些问题和驾驶员已经开始打瞌睡了,这个时候需要提醒司机。

系统主动反馈

系统主动反馈主要是分析向的,并向驾驶员去告知可能会发生的一些状态和潜在的风险,比如,HMI车载系统会根据天气预报的给出的温度去分析常走的路面可能会结冰,然后再路上提前告知用户需要避开那一段路,避免危险的发生,提升用户的操作效率和驾驶安全的有效方式之一。

②高效信息获取

1)信息准确传达

2)浅层级

3)信息布局一致性

在不同的驾驶使用场景中,我们需要保证布局样式的一致性,避免因用户在进入一个新的界面的时候,因为布局的变化而造成寻找操作的困局。

我们在设计交互的时候,也需要用户下意识到动作一致性是交互设计中一个非常重要的原则。一致性体现在很多方面例如:颜色、布局、图标、字体、字体等。比如,“删除”一个词,在同一个系统中,可能会有不同的称呼:如销毁、移除、抹除等,在相同的功能之间,页面的布局应该遵守一致性,通常一致性的布局帮助驾驶员完成功能的联想,减少记忆成本。

③让用户下意识操作

在车机端的操作中,使用效率还是拍在第一位的,我们为了让用户能快速且高效的完成操作目标,我们需要遵循很多已经成熟的交互方式,让用户能在下意识的自然动作就可以完成任务。

1)多模态交互

除了正常的车辆驾驶外,其他的一切别的操作任务都会让驾驶员去分心,为了考虑到驾驶员在驾驶的过程中,能提升操作的成功率,有些能设计多模态交互的功能,需要提供多种交互选择(触摸、语音、点击),让用户能根据不同场景和使用习惯可以组合操作,以便于用户可以以最舒服的状态完成任务操作。

2)合理的功能布局

关于车机上的功能布局,我们需要考虑到车载驾驶舱的特点来布局,结合具体使用的场景,对界面的信息和功能进行合理的布局。对于触摸的交互路径,要考虑屏幕交互的便利性,以方向盘中心越往右边,操作功能的应该是由常用到不常用的变化,越重要的功能应该离方向盘越近。

3)降低操作难度

通常驾驶员在行驶的过程中,注意力和活动空间都是有限的,在操作车机的过程中,如果想要精准的操作和点击所需要付出的操作成本是比较高的,并且还会极大可能的分散用户的注意力,需要在设计界面的过程中,我们需要保证操作的热区足够的大,保证无论驾驶员在任何使用场景下都具有易用性。

④系统反馈及时

1)合适的引导设计

2)合理的容错机制

驾驶员在行驶的过程中去使用车机,往往都不是注意力最集中的时候,所以,我们在设计的过程中,需要考虑多链路的流程设计,给用户足够多的犯错空间,当操作进度被打断的时候,我们应该给与用户合理的提示,告知用户该怎么处理。

3)及时的反馈机制

当用户在操作的过程中,操作在0.26秒内提供有效且明确的反馈(例如在选中后的颜色,或者在点击后控件有波纹的反馈),当页面有新内容加载时,超过两秒未加载完成,我们应该需要给予反馈和正确的提升。

总结

随着软硬件基础设施和互联网服务能力的不断变化,用户需求也会随之产生不可预测的改变。一套好的车载HMI设计,是需要在能力范围内,最大程度上满足用户安全和易用的需求,这一点,对于任何参与者来说,没有本质上的区别。

THE END
1.平面设计5大软件Br与Lr有什么区别?摄影爱好者如何选择?平面设计5大软件 Br与Lr有什么区别?摄影爱好者如何选择? Br与Lr有什么区别?摄影爱好者如何选择? Br全名:Adobe bridge。Br可以查看、搜索、排序、管理和处理图像文件。您还可以使用bridge创建新文件夹、重命名、移动和删除文件、编辑元数据、旋转图像、运行批处理命令以及查看有关从数码相机导入的文件和数据的信息。http://www.zzfmdn.com/article/961516
2.帮助中心5、选择您感兴趣的学科,点击“开启你的学习之旅吧”,即注册成功。 如何登录 1、在首页登录框中,点击登录。 2、点击登录之后出现如下画面,输入用户名和密码,点击登录。 3、如下图,显示账号即代表登录成功。 如何购买基础服务 1、想要购买服务,必须先充值(关于充值的操作步骤,可以参照《如何充值》进行操作),充值之https://www.tongyi.com/index.php/help/search
3.平面设计5大软件有哪些APP推荐平面设计5大软件有哪些下载豌豆荚平面设计5大软件有哪些榜单为您提供最新平面设计5大软件有哪些大全,这里不仅有平面设计5大软件有哪些安卓版本APP、历史版本应用下载资源,还有类似平面设计5大软件有哪些的应用推荐,欢迎大家前来豌豆荚下载。https://www.wandoujia.com/bangdan/395810/
4.平面设计5大软件,除了canva,还有这些!平面设计在我们日常生活中可以说是无孔不入,无论是传统媒介还是网络媒介,我们每天都会浸泡在大量的平面设计作品之中,也因本此或多或少都会对设计有自己的看法,其实即便是非专业人士,现在市面上也有许多平面设计软件,能帮助我们随心所欲地实现设计构想,篇文章,我们介绍平面设计5大软件,除了canva,还有这些! https://pixso.cn/designskills/five-major-software-for-graphic-design/
5.绘图软件下载平面设计5大软件绘图软件下载 平面设计5大软件介绍 工业最常用的制图软件是什么 1、Adobeillustrator 通常应用于出版、多媒体和在线图像的工业标准矢量插画的一款制图软件。在印刷出版、专业插画、海报书籍排版、多媒体图像处理、互联网页面的制作等领域应用非常广泛。还可以应用于线稿制作,提供较高的精度和控制,适合生产任何小型设计到https://www.pinunu.com/fxsj/htrjxz-ah1.html
6.平面设计5大软件,别再只知道Canva了!今天我就来和大家分享 5 大平面设计软件,它们分别是即时设计、Photoshop、Adobe Illustrator、Adobe InDesign 和 Lunacy,别再只知道 Canva 了!使用合适的设计软件,才能快速高效的开展工作,一起来看看吧!https://js.design/special/article/top-5-graphic-design-software.html
7.网页设计需要了解的相关知识网页设计之设计步骤及思考 此文出自网络 本章的设计步骤是建立在 网页设计进阶之一 (步骤和大局观) 之上的.可能会涉及一些平面相关的知识.和网页与平面的比较.网页与平面的区别我会在以后在写. 本章所讲的基于PHOTOSHOP软件制作. 本章印证了网页90%是排版这句话. http://www2.hnsyu.net/syxywlzx/jszc/wlxxaq/201012/t20101212_46968.html
8.艺术设计学院(3)具有手绘表现和数字化设计的能力,具有设计与制作住宅和中小型公共建筑的室内计算机效果图的能力。 (4)具有家具与陈设设计的能力,具有对住宅和中小型公共建筑进行室内软装设计与照明设计的能力。 (5)具有对住宅和中小型公共建筑室内装饰工程进行施工指导与质量监理、设计资 料管理和设计概算的能力。 https://www.gzjszy.cn/site4/n248/20230928/i4691.html
9.PS熟练度的10个段位的区分看看你的PS熟练度是几段?该段位的提升点:学习illustrator和CorelDRAW和基本功能,学习软件之间的置入和导出规范,可以使用不同软件来组装效果。 软件熟练度之第5个段位 该段位判定标准:会用PS,Ai,CDR软件,可以胜任平面设计。该段位的疑惑点:如何使用这 款软件,做一些惊人的特效 该段位的疑惑点:如何在打开软件之前,先出一个手绘稿。 https://m.jb51.net/photoshop/441979.html
10.绘图软件设计准则是什么绘图工具软件有哪些→MAIGOO知识摘要:绘图软件,简言之即用来作图的软件,通常是指计算机用于绘图的一组程序。电脑或者手机绘图画图经常要用到各种绘图软件,不同的绘图软件针对性不同,像室内设计、建筑设计、平面设计、动画设计、机械设计、网页设计等不同领域所使用的的专业绘图软件是不一样的。那么,常用的绘图工具软件有哪些呢?下面来看详细知识介绍https://www.maigoo.com/goomai/158397.html
11.平面设计实习感受(通用31篇)平面设计实习感受 篇5 1.制作圆角矩形方块 首先在photoshop中建立一个新文件,在文件上用矩形选取工具画一个矩形框,接着选择选单select→feather,输入半径值,数值越大则圆角矩形的半径越大。在选取区中填入颜色后,取消选取范围。选取选单image→adjust→threshold,由调整threshold level来改变大小,如此就会产生您想要的https://www.diyifanwen.com/fanwen/shixibaogao/12559417.html
12.大专学什么专业好就业前景好5、设计专业 设计专业有一大优势行业限制小,岗位需求范围大,这样给到学习设计专业的求职选择性范围很大。 就业方向: 1)平面设计 平面设计又称视觉传达艺术设计,主要学习内容包括广告战略、广告表现、书籍设计、插图设计、摄影艺术与技术、新媒体创作与应用等,毕业后可在出版、印刷、广告、商场、电视台、媒体及装潢公司https://www.ruiwen.com/word/dazhuanxueshenmezhuanyehaojyqjhao.html
13.平面设计助理实习周记(精选11篇)平面设计助理实习周记 篇2 平面设计就是在一个平面内对基础图案的表达与应用或进行二维构图,具体就是一般有是软件就是,photoshop或CorelDRAW等这些软件,具体工作范围就是户外广告设计,展板展示设计,书籍海报画册DM广告设计包装设计VI设计三维效果图后期处理等,平面设计这个概念比较广泛,它包括了以上诸多领域。而我在一家https://www.yuwenmi.com/fanwen/zhouji/1646408.html
14.万字常用设计软件大盘点如何选择自己最适合的软件建议收藏C4D还有目前世界最先进的毛发系统;并且可以和后期软件AE无缝衔接。 而且C4D现在也应用于多个行业,不仅是影视后期,ui、平面都能用到。建模,动画,灯光,材质,还是渲染,通通不在话下,俨然成为炙手可热的新晋三维网红。 而C4D对于平面设计师或是个人用户也是超级友好的一款3D软件。 https://blog.csdn.net/zhangay1998/article/details/120523827
15.浅谈平面设计软件AI与PS的区别,新手该如何选择?对于新手朋友或者说刚接触Adobe软件的小伙伴来说,首先需要知道的是:AI的全称是Adobe Illustrator(非人工智能AI),PS的全称是Adobe Photoshop(P图神器也就是此PS),这便是二者的第一个区别:名字不同。 第二个区别:主要用途不同 虽然两款软件都是用于图像处理,但是主要用途还是有所区别的。比如PS主要处理位图,就是点https://www.jianshu.com/p/3217ff8afc25
16.面试常见问题18、国内做平面设计工作的一般是有什么教育背景的人员? 答题方向:大部分为接受过绘画、设计教育的人员,少数例外。 19、国内发达地区平面设计的一般收入状况是怎样的呢? 答题方向:谈自己以往公司的做设计一行的收入状况即可,考查该同志有没有在这些地区工作过。 https://www.yjbys.com/qiuzhizhinan/show-596114.html
17.Cad实习报告(通用19篇)Cad实习报告 篇5 实习项目:建筑设计(auto cad 程序的运用) 实习地点:沈阳设计院西安分院 实习时间:XX年7月——8月 大二的暑假,我有幸到沈阳设计院西安分院实习,在将近2个月的实习期里,我初步接触建筑设计的一些运作,学会了如何画建筑平面,立面,剖面图,积累了一定的社会经验。 https://www.fwsir.com/Article/html/Article_20211101192202_1435730.html
18.美工设计和php软件工程师有什么区别就业前景区别(历年招聘趋势) 岗位名称 2023年职位量 较2022年 美工设计 13.2K -9% php软件工程师 187 +39% 说明:美工设计和php软件工程师哪个就业前景好?美工设计2023年招聘职位量 13.2K,较2022年下降了 9%。php软件工程师2023年招聘职位量 187,较2022年增长了 39%。统计依赖于各大平台发布的公开https://www.jobui.com/gangwei/pk/meigongsheji-phpruanjiangongchengshi/
19.超全面!每个UI设计师需要熟知的平面基础优设网随着互联网的发展带动了 UI设计的短暂刚需,经过3-5年的发展,UI设计也开始趋于平缓推进中。在此期间很多设计专业内部转岗与非行业转行也是一度热潮。 其中平面设计、电商设计、网页设计等转 UI设计算是设计内部转岗最便利的,由于已经具备软件基础与设计基础,相对较为容易。也有一部分是直接接触 UI设计的,虽然可以快速https://www.uisdc.com/need-to-know-the-plane-foundation/