解读WWDC 2024 CarPlay设计系统,总结了4个值得学习的知识点

2022 年 WWDC,苹果放出了他们对于下一代 Carplay 设计的畅想和一些设计 demo,果粉兴奋,媒体哗然。那一年,中国的造车新势力们还没进入白热化竞争阶段,蔚小理的车机们刚在用户心里打上“智能化”的标签,鸿蒙座舱横空出世,FlymeAuto 还在孵化中,一切都在欣欣向荣。

一时间,谁还会用 CarPlay / CarPlay 已过时 / CarPlay 的出路何去何从各种观点层出不穷,肤浅的我也认为大部分用户在座舱里的使用终端会逐渐从手机转向车机,主机厂的座舱 OS 会逐步取代 CarPlay。然而,三年的时间过去了,新势力车机和 CarPlay 之间孰好孰坏的纷争一直没有停止过,有的企业开始搭建生态玩起了车手互联,而有的入局者则打开了潘多拉的盒子,鱼和熊掌都可兼得。

在 2024 WWDC 后,AppleDelevop 账号在油管发布了关于 CarPlay 的一段视频,给大家讲解了苹果在 CarPlay 设计系统上的思考和沉淀,我豁然开朗。如同三年前文章的结尾说道那样,新一代 CarPlay 在高度一致化的 UI 和 UX 设计下,隐藏的是一颗很大的野心,如果说这颗野心在三年前没看明白的话,现在我们一起来细品。

“你的下一台电脑,何必是电脑” - 这是 2020 年 iPadPro 系列产品发布时的广告语,四年间 iPadOS 和 MacOS 以及 iOS 的界限越来越模糊,我们会发现,苹果一直在努力将手持设备的人机交互和 UI 界面做一致化,让用户专注于应用内容本身而忽略掉终端设备的差异。

同理推论,苹果在智能座舱方面,也希望这样“一统天下”,你的下一台车机,何必是(传统)车机。苹果在试图解决如何通过一套系统适配千变万化的车机需求,建立一个灵活/高效且还能兼顾美观的 HMI 设计规则。

首先一开始,“基努里维斯”就表明了立场:我们提供高度定制化的方案,希望厂商和我们的团队一同为你的车定制 CarPlay 外观和功能定义,我们搭台子厂商来唱戏,高,实在是高!

解读WWDC 2024 CarPlay设计系统,总结了4个值得学习的知识点

其次便是苹果团队对于车载界面的思考:

随着车辆屏幕越来越宽/越来越大,大家都开始使用虚拟仪表盘,而越来越多的操作功能被集成进屏幕后,CarPlay 的使命是什么,是甘于继续做主机厂的投屏工具,还是要接替车机大脑,承载全车最重要的人机交互操作功能。

解读WWDC 2024 CarPlay设计系统,总结了4个值得学习的知识点

解读WWDC 2024 CarPlay设计系统,总结了4个值得学习的知识点

就如同我们担心的一样,用户会在原生车机和 CarPlay 之间去纠结选择,主机厂商们也会发愁到底要不要花昂贵的费用授权 CarPlay 给自己生产的车辆,从而让自己的座舱功能“武功全废”。但苹果给出了新思路 - 我提供设计系统,帮您深度定制车机。既保持移动设备终端和座舱的生态统一,也能满足品牌之间的差异化需求。至于怎么差异化,就需要看各家主机厂设计师的大显神通了,毕竟在 iOS 和 Android 的设计准则之下,精致优雅的 UI 数不胜数。

在接下来的分段介绍里,“基努里维斯”给我们从字体/布局/模块化以及动态内容上举了一些例子,来告诉聪明的设计师们如何举一反三。

一、字体及基础图形样式

苹果在 CarPlay 的车机系统中提供由他们研发的 SF 字体,一个强大的拓展性极强的字体,它可以在字符的宽度/高度/字重上做任何的改变,也能在字体边角的弧度上变化,以此通过字体来适应不同的界面性格。偏向于速度感,文字可以粗一点切角可以锐利一些 / 偏向优雅而精致,文字则可以圆润轻盈。

解读WWDC 2024 CarPlay设计系统,总结了4个值得学习的知识点

解读WWDC 2024 CarPlay设计系统,总结了4个值得学习的知识点

从字体上延伸出来的,是设计师对于构成图形的基础元素拓展性思考:界面里的点线面,在固定的组合方式下也是可变的,这样设计师就可以在最简单的规则基础下随意发挥自己的创意和想象来组合图形元素,这有无数种可能,可以是纯色/渐变矢量扁平化的,也可以是赋予质感和光线的拟物化表达。规则只用于构建底层信息逻辑结构,而样式可以在规则下做无限延伸。

在这样的设计中,因为规则是清晰的,因此无论表层的设计样式怎么变换,我们都不会把注意力放在样式本身,而在关注每一个变化中的信息传递是否清晰,设计服务于内容,说的就是这个道理。

二、原子级的信息逻辑和结构层级

解读WWDC 2024 CarPlay设计系统,总结了4个值得学习的知识点

解读WWDC 2024 CarPlay设计系统,总结了4个值得学习的知识点

解读WWDC 2024 CarPlay设计系统,总结了4个值得学习的知识点

解读WWDC 2024 CarPlay设计系统,总结了4个值得学习的知识点

解读WWDC 2024 CarPlay设计系统,总结了4个值得学习的知识点

解读WWDC 2024 CarPlay设计系统,总结了4个值得学习的知识点

在信息组合上,同样沿用着类似的道理。不管是极简风格还是拟物的圆形仪表盘,你会发现除了信息层级的逻辑永远保持一致,原子 UI 结构/颜色运用上也有着严谨的设计原则,在合理的区间内最大化的将设计差异化拉开,但你一眼看上去该了解的信息还是一目了然,不会出现奇奇怪怪的东西一把抓瞎。换一台车就不会用一个车辆的车机,甚至升级一代车机很多操作用户就会懵逼,是当前新势力车机设计师们需要解决的课题。

三、模块和布局

有了最基础的组件规则和逻辑,根据不同需求搭建功能模块,以及不同的车辆终端屏幕介质来做界面布局,就是轻车熟路的事情了,这类似于我们在网页设计中提到的响应式布局,也仿佛在理想/小米的车机上似曾相识。不同的模块提供功能组合,但尺寸大小内容布局可以灵活定制,可大可小,可紧凑可宽松,可有边界也可以沉浸式布局,以此来实现跨尺寸跨介质的样式差异但功能相同。这是国内模块化卡片式布局的车机系统设计,我觉得接下来要进阶的路之一。

解读WWDC 2024 CarPlay设计系统,总结了4个值得学习的知识点

解读WWDC 2024 CarPlay设计系统,总结了4个值得学习的知识点

解读WWDC 2024 CarPlay设计系统,总结了4个值得学习的知识点

解读WWDC 2024 CarPlay设计系统,总结了4个值得学习的知识点

解读WWDC 2024 CarPlay设计系统,总结了4个值得学习的知识点

四、动态内容

最后是关于一些动态内容的呈现,定制化界面里那些可切换内容的自定义模块 / 全局系统的通知交互,以及我们国人耳熟能详的副驾屏/空调屏/后排屏幕/甚至扶手屏,如何保持这些屏幕的模块交互及 UI 的一致,我理解就是把可自定义的 iPhone 小组件搬到了车机里,应用越多,可定制的模块就越多。

而“负一屏”这个无论是在苹果还是安卓移动生态里的快捷方式入口,在新的 CarPlay 设计系统中暂时未提及。我认为交互上它是一个常用入口的较好呈现方式,但放在哪,从哪儿出来,再回到哪儿去,目前的车机们,百花齐放,有待统一。

解读WWDC 2024 CarPlay设计系统,总结了4个值得学习的知识点

至此,一个看似简单的车载设计系统规则,基努尼维斯就讲完了。他在最后不断的抛出橄榄枝,邀请厂商们一起来共建优雅的独一无二的和 Apple 生态无缝衔接的新一代 CarPlay,但据说合作厂商从 2022 年的好几家变成了两家,落地堪忧,前景堪忧。

但这丝毫不影响它的理念,让我觉得这是新一代 HMI 设计的“葵花宝典”。造车的新势力旧势力们,都在玩了命的把车里的屏幕搞大,搞多,但却没有多少车企重视过这些屏幕里的体验。“不就是一块 Pad”,是我听到过最多的声音,而如何做好这块固定在汽车驾驶舱里有强光有高温的“Pad”里面的用户体验,还真不是那么简单。移动终端里的那些按钮/进度条/输入框/Tab 切换甚至弹窗,是不是就可以直接照搬到车里,也还需要更多场景去验证。

全新 CarPlay 能不能在竞争激烈的座舱系统中占领一席之地我不确定,但我建议设计师们好好研究一下这套设计系统,对于自家内部设计系统的建立,多车型体验一致性的统一,都有着至关重要的学习意义。也很期待看到这套系统的真正落地,毕竟没有了 AppleCar,只能在这里,窥探苹果在座舱用户体验里的秘密。

当视频在手机上无法加载,可前往PC查看。

解读WWDC 2024 CarPlay设计系统,总结了4个值得学习的知识点

解读WWDC 2024 CarPlay设计系统,总结了4个值得学习的知识点

解读WWDC 2024 CarPlay设计系统,总结了4个值得学习的知识点

收藏 10
点赞 28

复制本文链接 文章为作者独立观点不代表优设网立场,未经允许不得转载。