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

在过去的几年中，汽车设计的趋势已经出现，汽车设计师一直在“整理”汽车内饰。他们正在取消使用触摸屏的物理控件。这样做的主要原因是更清洁的外观和节省的成本。

但是，当汽车公司这样做时，他们无法充分利用触摸屏。相反，他们的方法主要是复制平板电脑界面，并将物理按钮直接转换为触摸按钮。结果，难以使用汽车中的触摸界面。

汽车公司正全力以赴触摸屏

当环顾四周交通时，被电话和信息娱乐系统分散注意力的人数令人震惊。后者是汽车公司自己创造的一个问题。我认为他们没有采取足够的措施来取得所有权并解决这个问题。精心设计的用户体验不仅会减少事故的发生，而且还会带来更快乐的客户，这是双赢的！

简而言之，触摸屏要么从物理控制能力上退了一步，而且必须找到不同的解决方案，要么在设计上可能有重大改进。作为我关于汽车用户体验设计的博客的一部分，我决定查看是否有可能创建没有物理控制且可同时使用的汽车体验。

一些设计原则

基于触摸屏的核心问题，我提出了四个抽象的原理来帮助我解决它们。

1.“简化，然后增加亮度”

“简化，然后增加亮度”

为了描述最重要的原理，我只需要看汽车世界本身。传奇的赛车设计师科林·查普曼（Colin Chapman）创造了著名的短语：“简化，然后增加亮度”。他的赛车在60年代获得了成功，因为它们是高度专用的，并且完全适应了使用环境。同样的原理是良好接口的决定因素。

比较大众高尔夫I和高尔夫VIII的内部特征。它们实际上非常相似。两者都提供了一些有关驾驶，气候控制和媒体控制的信息。主要区别在于Golf VIII具有导航系统。高尔夫VIII仍然可能如此复杂吗？

高尔夫一号vs高尔夫八号内饰

原因之一是它提供了数百个并非必不可少的其他选项，功能和设置。当数字接口变得越来越大时，汽车公司将其视为增加更多功能的机会。但是，仅仅因为您可以添加某些内容，并不意味着您应该这样做。我打算要做的是重新评估所有这些功能，并删除所有不会对驾驶员体验产生重大影响的内容，并简化确实起作用的功能。这引出了下一个原则。

2.配置与自动化

配置与自动化

这种丰富的选择是汽车行业的典型选择。汽车越豪华，存在更多的个性化选择。现代汽车接口反映了这一点。用户拥有无数的设置，小部件，背景，颜色等，可以在界面中进行配置。对于其他互动（例如气候控制）也是如此。

触摸5种不同的控件来获得所需的温度真的很豪华，还是用户喜欢这种豪华？考虑下面的示例。奢侈品不是根本不需要或根本不与系统交互吗？

与Nest Nest Thermostat相比，揽胜Velar的气候控制

3.适应环境

适应环境

如今，汽车中的大多数界面与平板电脑界面非常相似。平板电脑是在广泛范围内使用的设备。当您在家中沙发上观看Netflix时，以及在繁忙的办公室环境中执行多任务处理时，该界面必须能够正常工作。

在汽车中并非如此。UX设计人员可以确保仅在与驱动有关的上下文中使用该接口。因此，他们应该设计适合该上下文的接口。这是瑞士军刀和厨师刀的区别。您可以设计出世界上最好的瑞士军刀，但是在厨房里，厨师刀总是会更好。

4.硬件跟随软件

硬件跟随软件

设计汽车内饰是一个复杂的过程，其中不同的学科必须共同努力并妥协。在考虑屏幕布局时，用美学来平衡可用性非常重要。但是，如果您不必关心美学并可以完全专注于可用性该怎么办？

对于这个项目，我正是这样做的。我首先弄清楚了界面的核心功能。然后，我通过创建3D模型并在VR中进行测试来测试不同屏幕布局的可用性。我发现，就可用性而言，最接近驾驶员视线的水平屏幕布局是最好的。考虑到这一点，我在设计界面时没有任何实际的屏幕尺寸限制。我让接口决定硬件大小。

三种不同的屏幕布局

最终概念

我总共设计了该概念的三个不同版本。在每个版本之后，我都从网络中的人们那里寻求反馈意见以进行改进。下面是最终概念的模型。如果您对该项目背后的过程感兴趣，请查看我撰写的有关该文章！

最终概念样机

该界面分为四个不同的屏幕。中心屏幕，仪表板屏幕和气候控制屏幕。让我带您了解主要功能！

层数

中心屏幕是最重要的，我花了大部分时间来设计它。

中央画面

开车时，几乎所有互动都与导航或媒体有关。如今，界面通常对其他功能（例如电话和设置）同样重视。为简单起见，我选择使界面尽可能简单，并除去媒体，导航和一些基本的气候控制以外的所有内容。

这些以导航为基础分层组织。最重要的是媒体播放器。这两个将始终可见。较高级别的控件是气候和媒体控件，可以分别单击屏幕左下角和右上角的图标来打开它们。

分层系统

在用户将专注于驾驶的情况下，与屏幕交互所花费的时间应最小化。这就是为什么这些元素的位置会受到菲茨定律的严重影响。它指出，快速移动到目标区域所需的时间是到目标的距离与目标的宽度之比的函数。换句话说，为了使导航更容易，您可以将可单击元素彼此靠近放置，或者将可单击区域增大。

主要功能在屏幕一角切换，可轻松访问

菲茨定律还表明，在任何计算机显示器上访问最快的目标都是屏幕的四个角。与放置在屏幕中间的元素相比，盲目地到达屏幕角落要容易得多。这就是为什么可以从各个角落获取气候和媒体的原因。此外，在屏幕的每一侧，都有用于音量和气候的更具体的滑块，我将在后面进一步说明。

我做出了明智的选择，将气候控制控件放置在屏幕的左半部分，将媒体控制控件放置在右半部分。大多数汽车的方向盘上都有某种形式的物理控件，用于控制媒体和音量。因此，将气候控制装置放置在驾驶员附近而不是媒体上更为重要。

驾驶模式

该界面根据上下文以两种不同方式更改。停放vs行驶和短vs长途行驶。

停车与开车

首先，与在开车时相比，汽车在停车时的界面有所不同。这两种情况带有两组不同的用户需求。在停车时，可以访问所有设置和功能。更重要的是，由于分散注意力不是问题，因此该系统非常类似于带有小标签和按钮的典型可识别平板电脑界面。

汽车停放时的界面

但是，当汽车处于行驶状态时，界面会发生变化。该驱动程序仅限于与驾驶相关的功能，例如导航和基本媒体控件。标签和按钮也更清晰，更大，因此可以更轻松地到达它们。由于系统不允许驾驶员（或乘客）在驾驶时更改任何设置，因此很难做出选择。但是在我看来，这是用户安全与自由之间的平衡。在这种情况下，我选择安全。

短途行驶与长途行驶

第二个上下文变化是短途驾驶与长途航行之间的区别。主要区别在于地图设计。每天开车上下班时，大多数用户对地图上的许多细节（如街道名称，建筑物等）不感兴趣。信息最重要的一层是交通。这就是为什么地图看起来更加平静，并且只在顶部显示交通信息的街道的原因。但是导航时，地图会显示建筑物形状，主要街道名称，突出显示的空间和其他特征。

不同的地图设计

另一个区别是仪表盘中显示的信息。我想探讨仪表盘屏幕如何与中控屏幕更紧密地协同工作，以创建更整体的设计。因此，仪表盘屏幕根据中控屏幕的配置显示信息。结果，驾驶员可以在带有静定仪表盘的大地图与显示带有仪表盘方向的媒体屏幕之间进行选择。

仪表盘和中控屏幕合而为一

手势控制

到目前为止，我还没有讨论过重要的部分。人们最常听到的有关触摸屏的抱怨是，在“老式”汽车中，您可以伸手去拿重要的物理控制并与之交互，同时保持对路面的关注。使用当前的触摸控件，这是不可能的。音量控制是最常用的示例。

这是一个有效的投诉，但没有某些人认为的那么糟糕。大多数汽车在方向盘上都提供了物理音量控制按钮，这意味着在大多数情况下，您可以进行很小的调整，而无需将手从方向盘上移开。

但是在某些情况下，此按钮交互不适合您要执行的操作。与方向盘上但在触摸屏上的按钮具有相同类型的交互方式则无济于事。好消息是触摸屏允许进行新的交互。毕竟，这些屏幕在我们编写的软件上运行，我们可以根据需要对其进行处理。这是可悲的是，虽然汽车企业纷纷使出模仿在触摸屏上的物理按键。

汽车公司将物理控件直接复制为数字控件

对于大多数物理音量控件，使用旋转控件是因为它们允许用户根据旋转的程度以小增量步长和大步长来更改值。

与旋转控件交互的两种方式

因此，当为触摸屏设计类似的控件时，两个要求是：控件应允许盲目到达，并且应该可以在大小上逐步调整。

当盲目地拿起控件时，您首先要朝控件的大致方向移动手，然后使用触觉来达到它。随着时间的流逝，您会建立起肌肉记忆，从而使第二步更快。在触摸屏中这是不可能的，因为它们是平坦的。

但是，它们的确有边缘，您可以用触觉盲目地找到屏幕的边缘。这就是为什么我将这种类型的控件放在屏幕的两侧。我将手势交互的先前概念用作启发。通过上下滑动手指，您可以控制音量等基本功能。缓慢滑动小步，快速滑动大步。

手势交互与音量控制

为了简化操作，一旦您触摸了滑块区域，它就会扩展，从而允许很大的水平误差。另外，您可以在滑块上的任何垂直点开始交互，这意味着您不必非常精确地瞄准。

气候控制

如前所述，自动化与配置的原理最适用于气候控制。气候控制很有趣，因为每辆车的气候控制基本相同，但确实很复杂。大多数人对如何操作它们只有基本的了解。如果您问五个人，对窗户除雾的最佳方法是什么，您可能会得到五个不同的答案（我尝试过）。

当然，有一种更简单的方法来设计它们。如果您退后一步，并列出用户与气候控制系统互动时的基本目标，则主要归结为一个：改变汽车的温度。有很多不同的方法可以实现这一目标，但是汽车现在已经足够聪明，可以为用户解决这一问题。

因此，用户仅设定温度。驾驶员和乘客都有自己的显示屏，他们可以在此设置温度并切换座椅和方向盘的加热。

如今，经常触摸空调只是为了使汽车更快地达到凉爽的目标温度。例如，当您的汽车在炎热的天气停在阳光下时。有一个论点是，使用这样的自动化系统，即使停放汽车，汽车也可以控制温度，从而温度始终是正确的。

但是像这样的自动化系统从来都不是完美的。因此，应该有一种方法可以推翻或推翻系统。这就是为什么要进行第二次控制，即达到目标温度的时间。为此，使用了手势控制。当您进入热停放的汽车时，您希望汽车在进入时尽快降温。那就是当您使用手势输入来设置达到目标温度的首选时间时。

气候控制概述

温度界面和手势交互应涵盖基本交互。始终应触手可及的那些。另外，在左下角有三个按钮，用于较罕见的用例。首先是“透明窗户”功能，它将使用各种气候控制方式对汽车的窗户进行除雾。第二个功能是冷空气功能，可将冷头发在短时间内吹入机舱。这是为要在您的脸上吹冷空气以提高舒适度的用例而添加的。最后一个是大多数汽车中都使用的标准再循环空气按钮。

汽车中的气候控制之所以如此相似的原因之一是，使用户更容易使用某种形式的标准化控制。有一种观点认为，如果控件易于操作，那么标准化就不会那么重要。但是教用户这样一个不同的系统是困难的。因此，就我的概念而言，在汽车停放时，控件上带有描述性标签。但是必须进行用户测试才能了解用户对此的看法。

总览

https://www.youtube.com/watch?v=kGjDgaYGjSE&feature=youtu.be整个界面概述

仪表盘屏幕示例

导航时中心屏幕的示例

不导航时的中心屏幕

下一步是什么？

在过去的几周中，我设计了这个概念。它经历了三大迭代。如果您有兴趣了解有关此设计过程的更多信息，请查看我撰写的有关此设计的文章。

这样的概念永远不会100％完成，这就是我选择现在发布它的原因。视觉设计仍在进行中，现在非常混乱。另外，当前的概念是尽可能基本的。因此，很有趣的是，可以在不损害系统简单性的前提下添加哪些重要功能。

此外，值得添加更多用例。例如，在当前版本中，我不包括通过语音交互来完成的电话。

但更重要的是，在继续进行之前，与真实用户一起测试设计非常有价值。无论如何，我真的很想听听任何人的反馈！

公众号:UI学习君

Powered by Froala Editor