和谐共生勾勒出万物互联 HarmonyOS UX美学背后的设计故事
机锋网

【机锋资讯】华为HarmonyOS自6月2日正式发布以来,饱受消费者好评,消费者用行动证明了他们对HarmonyOS 2的支持与信任——升级开启仅一周,升级用户数破千万;历时一个多月,升级用户数突破3000万。一个月升级用户突破3000万究竟是个什么体量呢?目前华为在全球约有两亿用户,也就是说约7分之一的用户升级了HarmonyOS。而这不仅证实HarmonyOS万物互联的能力受到追捧,其标志性的UX美学同样吸引了众多用户去升级体验。 

7月8日,华为在线下举行了一场HarmonyOS UX媒体沟通会,围绕HarmonyOS UX的One Harmonious Universe的设计理念,介绍HarmonyOS UX设计背后的故事。

首先,One Harmonious Universe指的是“万物归一”“和谐共生”“衍生万物”, HarmonyOS 追求全场景统一的设计语言,HarmonyOS是希望构建一个和谐、自然、平衡、统一的数字世界,HarmonyOS是面向全场景、多设备的操作系统,这就是HarmonyOS的设计理念。

用科学量化体验:人因研究的故事

当用户升级到HarmonyOS之后,桌面上最直观的变化就是增加了一些服务小卡片,用户可以通过上滑APP图标展开万能卡片,一个简单的动作就可以帮助用户解决很多问题,但在背后是华为设计团队的不懈努力。

HarmonyOS设计团队在2019年5月份前就已经开始来做全新的 HarmonyOS 设计,设计经历了差不多两年的时间。这是现在新的桌面,可以看到有万能的卡片,还有大家都挺喜欢的大文件夹。万能卡片方便大家能够进行短暂的浏览,你如果喜欢它的话可以把常用的钉在桌面上。万能卡片我们也设计了多种的,比如说不同尺寸的,一方面是从应用的角度来讲,不同的应用可能需要呈现的信息内容是不一样的,呈现的功能也是不一样的,不同的尺寸方便开发者进行相应的设计。从用户的角度来讲,要设计自己的桌面,根据自己的习惯可以选择不同的卡片尺寸。

那么问题来了,什么是上滑,要怎么滑才能呼出万能卡片?对于使用者来讲看只是在桌面上做竖直滑动的动作,但其实用户竖直滑动的动作并不是笔直的,它是是一条弯曲的轨迹,再有,在手机桌面上不仅有上滑的动作,横向切换页面的时候还会有水平方向的滑动,那么一个弯曲的滑动轨迹,如何知道是垂直方向的滑动和水平方向的滑动呢?另外,现在大家用的手机屏幕变大了,手小一点的用户对于最上面几行的APP想够到它很难,更不用说在上面做上滑的动作,会更加困难。

针对上述这些问题,人因做了很多的分析。在研究一个滑动手势轨迹的时候,设计团队发现最关键的指标有三个:滑动的角度、滑动的速度、滑动的距离,这三个指标对一次滑动就能有一个比较完整的定义,能清晰的识别出来这次滑动是怎样的滑动,能够更好的识别用户的手势意图。

华为工程师分析出三个指标,分别是滑动的角度、滑动的速度、滑动的距离,通过这三个指标的量化定义,就能分析出你的滑动需求。然而,在一个大的屏幕内,触发的难易程度也是变化的,经过大量志愿者的相关滑动体验统计,华为分析出了一张热力图,详细标明了容易和困难的触发区域。再结合上述的三个指标,就能让系统很好的识别你的滑动意图,让全屏的滑动达到一致,让你在屏幕任何区域滑都觉得舒适。

另外,还需要在不同设备上实现一致且流畅的动效效果,由于不同的设备上的距离、宽度、大小是不一样的,如果都用同一个时长来呈现动效,在某些设备上其实我们的眼睛追踪起来也会比较困难。比如在大屏上追踪起来会很困难,因为它的动效距离很长,需要的速度也会很快,表现为看不清动效。基于大量的人因实验,我们会定义不同的设备,怎样的动效时长是最合适的,我们在不同的设置上都有做了专门的动效设计,保证我们的眼睛非常好的欣赏到每次的动效。

轻拟物主义和卡片式设计:视觉设计的故事

相信不少升级到HarmonyOS 2的用户一定对系统中的视觉设计印象深刻,相较于古板的EMUI,HarmonyOS整个的设计不仅更加年轻,同时还更具未来感。而在这背后,华为的设计是团队引入了一个全新的设计风格“轻拟物主义”。

纵观现代设计的发展,从以前主张“形式追随功能”的现代主义,到现在追求多元化形式的后现代主义,整个设计的发展是螺旋式上升的过程,回看当时的拟物风,它是功能机和智能机初期的时间,当时的界面设计主要以拟物风格为主,把现实生活里面的元素很真实地还原到界面里面,这样有一个好处,在当年的那个时代里面,很多用户是第一次使用智能手机,我们用拟物的风格可以减少学习的成本,而且细节比较丰富的情况下,在视觉的表现上也比较OK。但是这种拟物化的方式有一个坏处,往往这种风格都是切图的方式实现,对于一个APP来说资源的占用是比较大的。

从2012年开始左右,为了便于轻量化APP快速下载和系统快速运行,扁平化的风格逐渐盛行。HarmonyOS的设计理念是「和谐共生」,在方案探索初期阶段,华为设计师发现小工具等模块是一个很好的场景,都可以在物理世界中找到映射的对象,比如像计算器,可以把物理世界中计算器按钮的感觉融入到电子计算器,在微微凸起的按钮上面,做凹下去的效果,强化用户本身点击按钮的反馈。

以指南针中水平仪为例子通过两个圆圈叠加的面积和色彩来告诉用户当前的平面水平角度。在一些用户的反馈里面,以前版本特别扁平的水平仪效果,对于用户来说存在一定的学习成本,而且在整个的视觉上面也没有说特别美观的感觉。所以我们在这次的设计里面在思考,有没有一些方式可以很直观的告诉用户这个东西怎么用,同时又比较有趣,那么我们尝试好多的方式。

同时设计师会在可视化的设计工具中调好当前这个东西适合怎么样的效果,或者哪个是最适合当前界面的一些设计。在可视化的设计工具调完了之后,可以直接参数化的导出XML配置文件,然后直接到APP的设计里面,不需要编码加载XML文件,即可还原设计效果,我们是通过这样一个方式解决资源占用的问题。

总结:

HarmonyOS的改变远不止笔者提到的这些,其背后的每一项小小的设计都蕴含着华为设计团队的不懈努力,而HarmonyOS所要构建的万物互联,回顾HarmonyOS发展史我们就不难发现,华为始终秉持着开放的态度,拥抱行业、拥抱开发者、拥抱每一个用户,华为的目标并不是垄断某一个领域,而是要与全球软硬件企业和开发者一起,共同见证万物互联时代下的美好未来。