特斯拉Model 3用户界面详解（多图注意流量）——ARTUI用户体验设计学院

汽车在越来越智能，也渐渐变成了我们UI设计师、交互设计师新的战场，在智能汽车队伍里，特斯拉无疑是走在最前列的，而近期发布的Model 3车型取消了大部分汽车必备的实体控制器，比如大灯开关、雨刮刷控制器等，而将其移到了中间1920×1080像素的中控大屏上，那么其UI设计和交互设计与汽车无疑更加紧密，也更加重要。通过本文一起来看看特斯拉的用户界面设计吧。

Tom Johnson 是一名位于亚特兰大的产品设计师，本文谨献给设计师/汽车爱好者。

文章细分了第一款大众市场触摸屏电动汽车特斯拉 Model 3 的仪表板控制和界面的细节。从特斯拉的UI设计我们可以看出特斯拉的长期战略，以及他们对未来无人驾驶的态度。

特斯拉 Model 3

从一开始，我就一直在关注特斯拉 Model 3 的传奇故事。去年通过测试驾驶了特斯拉S型，就爱上了它如何操控驾驶、以及敏锐的客户体验调整。

概念很酷，但是我不相信特斯拉真的会在把汽车推向消费者时，把仪表板放倒。“现在可能很酷，但市场营销人员或消费者不会接受，这应该只是一个概念。” 我这么认为着。

但是….我错了。

没有旋钮。

没有空调通风口。

也没有打开手套箱的手柄。

他们将所有一切都收在了汽车中间的触摸屏上。

Model 3 确实有四个车轮和一个汽车形状的车身，这是与大多数汽车相似的地方。

但我想知道特斯拉如何隐藏车窗里的对于汽车的所有控制权，所以我开始在网上搜索关于用户界面的所有信息。

过了一段时间，我终于遇到了一位名叫 Andrew Goodlad 的设计师的一个项目，这个设计师根据新闻发布会再现了特斯拉 Model 3 的用户界面，以及汽车内部的摇摇晃晃的 YouTube 视频，他做了一个原型。

为什么我决定重新创建用户界面

他的原型很酷，但静态图像还不足以满足我的好奇心。我想分析这些零部件，并确切地了解特斯拉如何设计其疯狂的新车仪表板……以及为什么。

我开始从图像中重建特斯拉 Model 3 UI。我制作了图标，采样颜色，设计了一个自定义的地图框视图，将 Figma 组件，开关，按钮等所有东西拼凑在一起。

我在 Figma 做了大部分的设计工作（注：Figma是一款通过浏览器运行的UI设计软件）：

以及可点击跳转的用户原型：

让我们快速进入正题，看看特斯拉Model 3 的中控大屏用户界面设计吧：

特斯拉与苹果

最近，我正在重新审视 Steve Jobs 推出的 iPhone 的主题演讲，想到 Model 3 和 iPhone 有着明显的相似之处。

都没有物理按钮。

乔布斯向观众展示了业界所有其他主流智能手机，iPhone 最大的革新就是没有物理键盘。

所以我们为什么不以同样的方式看待汽车呢？这与苹果放弃键盘时有什么不同？

或许你会说，那是一部电话，这是一辆车。交互方式和用例明显不同。

但是软件可以更新。物理按钮不能获得空中修复。它们无法改进，它们无法改变。毕竟，这个想法现在看起来也不是那么疯狂了。

特斯拉Model 3 UI分享

Figma源文件：https://www.figma.com/file/OIVSH9zbbnAAyRvoFE0dmowA/Tesla-Model-3

原型交互：https://www.figma.com/proto/OIVSH9zbbnAAyRvoFE0dmowA/Tesla-Model-3?scaling=contain&node-id=37%3A2923

原文始发于微信公众号（ARTUI用户体验设计中心）：特斯拉Model 3用户界面详解（多图注意流量）——ARTUI用户体验设计学院