Dock栏设计专题|主页Home键设计方案-HMI方向

0 评论 1209 浏览 8 收藏 12 分钟

下面是笔者整理分享的关于Dock栏设计专题的文章,笔者围绕交互与设计两个方面对主页键进行了对比分析,从而发现主机厂对于主页键的定义各有不同的相关内容,我们一起往下看了解了解吧!

主页键是车机系统中返回主页的交互按键,通常设计于Dock栏中,在UXSync数据平台的 50 款车型中,我们围绕交互与设计两个方面对主页键进行了对比分析,发现主机厂对于主页键的定义各有不同,接下来让我们看一下:

一、功能交互

主页键除了返回首页的基本交互以外,还有更加丰富的功能与交互:

1. 通过「主页键」切换不同主页

昊铂GT为了满足车主的不同需求,设计了一个以车辆模型为主的主页-1,另一个以地图导航为主的主页-2,在主页状态下:点击主页键切换不同主页;在非主页状态下:点击返回主页。

昊铂GT-主页-1

昊铂GT-主页-2

2. 通过「主页键」打开多任务管理

通过单击/双击/长按主页键来打开多任务管理。

1)单击主页键 -捷豹Ipace

捷豹Ipace – 主页

捷豹Ipace – 多任务管理页

2)双击主页键 -Smart精灵

Smart精灵 – 主页

Smart精灵 – 多任务管理页

3)长按主页键 -蔚来ET7

蔚来ET7 – 主页

蔚来ET7 – 多任务管理页

3. 通过「主页键」收起/展开快捷功能

问界M7的车机首页以壁纸为主,点击主页Home键可以收起/展开桌面底部的快捷卡片,让桌面壁纸看起来更加干净整洁。

问界M7-主页

问界M7-收起快捷功能

二、非常驻主页键

主页键一般常驻在Dock栏中,而部分车型的主页键不常。

宝马I3在主页状态时,不显示主页键,只有进入二级页面才会在Dock栏中显示主页键。

宝马I3-主页

宝马I3-蓝牙电话

哪吒U则将主页键与应用中心键做了巧妙融合。

哪吒 U-主页

哪吒 U-设置页面

领克08的主页键则会根据不同场景变换相应的交互操作:

应用中-默认

主页-默认

主页-充电状态

休憩空间-休憩空间开启后

露营空间-露营空间开启后

三、无主页键交互

在车机系统中,通过点击主页键返回主页是一种常规交互,在对比的车型中,还有多种返回主页的方式:

1)下滑应用顶部指示器-返回主页

特斯拉 Model Y-设置

2)上滑主页指示器-返回主页

(极星2)

3) 点击关闭按钮-返回主页

(荣威IMAX 8-车辆设置)

4) 双指下滑-返回主页

零跑 C01-实验室

以上是我们对主页键交互内容的统计分析,接下来我们再来看一下各个车型主页键在视觉方面的差异。

四、视觉设计分析

1. 主页键的视觉样式

常规的主页键的图标有多种形式:

1)房屋元素

阿维塔11-Dock-Home键

2)圆环元素

领克08-Dock-Home键

3)方形元素

极越01-Dock-Home键

4)结合品牌元素

林肯航海家-Dock-Home键

智己LS6-Home键

极氪009-Dock-Home键

极氪001-Dock-Home键

5)车辆元素

众多车机系统中,目前只有路特斯的主页键采用车辆图标的形式,路特斯是以车辆模型作为车机首页,首页承载着车辆快捷控制的功能,而采用车辆的图标作为主页键更贴合功能设计。

路特斯 ELETRE-主页-Home键与应用中心结合

飞凡F7的车机以应用中心作为主页,采用应用中心图标作为主页键也是与功能设计更加贴合。

飞凡F7-主页-Home键

2. 特殊场景下主页键的样式

同样是领克08,首先在主页键的设计上使用了与众不同的圆形样式,且为主页键添加了“显示充电进度”的交互功能样式,并在主页和应用中使用了不同的视觉效果,这样做既增加了主页键的功能多样性,也提高了信息交互效率。

领克08-主页

领克08-能量中心

五、总结

在本次设计探索中,我们也发现了许多曾被我们遗漏的设计亮点,仅从主页键来看,可以说现有车机系统的设计是多样化、多元化的,各个车企也为自己的目标用户进行了定制化的设计。

  1. 在返回主页功能上,可以通过特殊的交互方式来取代固定的按钮,以此来节约Dock栏中珍贵的空间。
  2. 如果已经有主页键,可以增加主页键的交互功能,让主页键的功能更加多元化甚至客制化。
  3. 在主页键的视觉设计上,“房屋”的意象仍然是主页键外形的最佳选择,在此基础上,可以增加品牌元素来提高用户对品牌的感知度。
  4. 为主页键增加一些不同场景下的不同样式,可以进一步提高主页键的交互效率。

本文由 @星科小产品 原创发布于人人都是产品经理,未经许可,禁止转载

题图来自 Unsplash,基于 CC0 协议

该文观点仅代表作者本人,人人都是产品经理平台仅提供信息存储空间服务。

更多精彩内容,请关注人人都是产品经理微信公众号或下载App
海报
评论
评论请登录
  1. 目前还没评论,等你发挥!