电动汽车仪表盘的设计

用户头像
上海/UI设计师/7年前/1316浏览
电动汽车仪表盘的设计
用户头像
NickM

汽车仪表盘设计

UI学习君 陪你学习的第 5 篇分享


这是电动汽车的数字仪表组的概念设计。设计的重点是根据驾驶场景过滤信息的不同驾驶模式。


一、概念解释

仪表组的设计根据三种模式而变化:高速公路,城市和静止。高速公路和城市模式由系统自动启用。当汽车处于停车或空档时,静止模式启动。


1.结构体

用户界面由3个不同的栏和3个“信息面板”组成。顶栏(1)显示易于理解的“长期”信息,如时间,天气和预计到达时间(ETA)。
两个侧边栏(2,3)分别显示来自用户手机的仪表板图标和通知。条形图中的信息在不同的驱动模式下基本保持不变。

主要区域分为三个信息面板(4,5,6)。这些显示关键信息,如导航系统,速度和方向。信息可视化和数据类型可以根据驾驶模式显着改变,因此,选择具有三个信息面板的清晰设计以保持结构感。


undefined

结构概述


二、最终的概念

1.公路模式

在高速公路上行驶时,仪表组仅向驾驶员显示完全必要的信息,以最大限度地减少驾驶员分心。 
左侧面板显示了汽车相对于速度限制的速度。对于一个司机来说,在高速公路上,无论他的速度有多快,都与速度限制的相对速度无关。当绿色圆圈完成时,驾驶员正在完全达到速度限制。速度限制显示在表盘中央。

中间和右侧面板显示路线和方向。在高速公路上行驶时,显示完整的地图信息太多了。驾驶员只需要知道他需要驾驶哪条车道以及下一步要去哪里。因此,中间空间仅显示汽车在道路上的位置以及驾驶员应遵循的路线(蓝线)。右侧刻度盘充当每个方向的进度条。它为每个新方向重新启动。


undefined

公路模式


当驾驶员超过速度限制时,界面会给驾驶员提供微妙的提示以减速。首先,通过将刻度盘的颜色更改为红色,并在其持续增加速度时,通过将整个簇的轮廓更改为红色。


undefined

速度限制反馈的动画


2.城市模式

当用户进入城市时,UI相应地改变信息的显示。在高速公路驾驶模式中,重点是驾驶员的注意力和以正确的速度驾驶,在城市中,这变得强调在复杂的街道上航行。
首先,地图会更改为城市的详细俯视图,并在其上方投射路线。其次,由于焦点远离速度,左面板变得不那么重要了。因此,它显示实际的数字速度和环形亮起的环境颜色,而不是绿色。但是,用于超速的相同反馈系统仍然存在。


undefined

城市模式


3.固定模式

如果汽车处于停车或空档状态,则与其他驾驶模式相比,UI为驾驶员提供非常不同的信息。这背后的原因是驱动程序将对更详细的信息更感兴趣。因此,他将使用主要的信息娱乐系统。然后,仪表板将作为第二个屏幕,提供有关汽车状态的快速,关键信息。

左侧面板显示电池的充电水平和驱动的总距离。中央面板显示了汽车的顶视图,反映了汽车的状态(打开车门,车灯,机械问题)。右侧面板显示当前的媒体设置。 
顶部栏中的信息也会略有变化,因为它会显示更详细的信息。除此之外,还会显示数据,以及天气和天气预报。自动变速箱的设置显示在中央。


undefined

固定模式的动画



文章由微信公众号“UI学习君”翻译整理


11
阅读原文
|
举报
|
24
分享
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
盲盒APP UI设计
UI 登录界面设计模板包
钱包ui模板
3D卡通UI界面图标可爱插画免扣素
UI界面 组件
【新年UI图标】体育icon
【新年UI图标】30个图标
智能家居中心 简约 UI设计组件库
科技医疗透明柜UI界面设计
新拟态风格 UI设计组件库
户外旅行飞机情侣假日出行
【新年UI图标】活动icon
原创UIUX交互橙红渐变炫酷视觉平面设计作品集模板PSD
新能源APP应用UIKit
【新年UI图标】积分icon
UI通用设计素材1
拟物风质感写实UI卡片合集源文件
【新年UI图标】礼物/活动icon
Security Camera UI kit
3D渐变流体抽象矢量UI背景图
【新年UI图标】旅行icon
高级感金属拟物 UI设计组件库
APP/小程序商业项目UI模板|99个高保真UI+79个原型
你可能喜欢
大家都在看
登录注册