带你探究万能卡片的一些用处

刚刚升级HarmonyOS 2的朋友

会注意到桌面不少APP图标下多了小横条比如相机、日历、微博、京东等

在好奇心的驱使下

如果你不小心向上滑动了这些APP图标

那你就解锁了全新功能——万能卡片！

小横条只是万能卡片体验的开始，

为了让大家用着简单舒服，

万能卡片设计背后还有更多巧思，

小编带着大家一探究竟~

「1」

为什么是卡片

一个舒适美观的系统界面设计

不能是满屏的内容堆叠 ，

设计师需要通过一个“容器”

将界面的内容进行归类组合。

列表和卡片

正是信息整合的两种常用方式，

二者在给大家带来的浏览体验上各有千秋，

分别适用于不同的情境。

比如列表式设计

常用于社交、新闻、办公等APP，

有助于我们快速浏览检索信息；

卡片式设计

则更适用短视频、视频、电商类APP，

可以完美结合图文呈现更好的视觉效果，

同时具有直观的可操作性。

那么，桌面适用的情境是什么呢？

一方面，HarmonyOS 2不只是手机操作系统，

它还运行在手表、平板、智慧屏等设备上；

另一方面，桌面需要保持视觉一致性，

还能承载不同形式的内容。

于是，为了用户能在不同设备

获得统一、美观、舒适的交互体验，

设计团队最终选择了

灵活，易延展的万能卡片

作为HarmonyOS 2的桌面设计方案。

「2」

卡片除了内功，还要有颜值

除了让万能卡片好用，

设计师们还负责让它好看又有趣。

目前有不少小伙伴

已经充分发掘出万能卡片

可藏可显、可大可小、随心定制的潜力，

DIY了无数与众不同的精美桌面：

无论是绿色的清新

粉色的可爱，还是黄色的温暖…

都赏心悦目。

另外，考虑到不是所有人都有时间精力

布置美美的桌面，

华为将卡片换肤能力

开放给第三方主题设计师，

给大家带来了既统一又多样的赏心体验。

无论你是文艺青年，

还是潮人or极客，

都可以找到适合自己的风格。

一键切换主题，

APP图标、万能卡片、壁纸和锁屏一起变装。

「3」

怎么才算上滑？一个看似简单的问题

不管怎么上滑都能触发卡片，

如此高效、精准的交互体验，

大家可能都以为是因为上滑动作简单。

其实不然！

事实上，“上滑”并不简单。

每个人上滑的轨迹都不一样，

也未必是一条垂直线。

为了能精准识别大部分用户的上滑习惯，

华为设计团队进行了详尽的人因研究，

分析发现三个识别滑动的关键指标：

滑动的角度、速度、距离。

基于这三个关键指标，

招募大量志愿者参与测试，

绘制出了屏幕上滑触发的容易区、困难区。

继而对不同区域的上滑体验进行专门调试，

保证了我们在任何地方上滑，

都能高精准识别

带来更加自由舒适的万能卡片触发体验。

所以，在我们习以为常的便捷体验背后，

往往隐含着许多不为人知的深入研究。

当然，作为消费者，

我们知道怎么用、好用即可

剩下的都交给设计师吧~

「4」

呼出卡片的丝滑流畅也有秘诀

关于动效的流畅性，

大家在日常看视频过程中应该有所体会，

帧率越高、细节越丰富，

效果就越流畅。

比如，记录一颗小树成长的短片，

如果小树长到大树只有1秒钟、几帧画面，

我们会觉得跳跃很大、不自然；

如果从小树到大树有几百帧画面持续20秒，

记录了小树每一天的状态，

那动画就会流畅许多。

万能卡片的弹出和关闭动效

就是一系列画面组成的短片，

也遵循同样道理。

不管从小卡片变成大卡片，

还是从大卡片缩回小卡片，

影响卡片动效流畅性的因素就两个：

动效时长和帧间距。

那么，问题就来了，

多长的动效、多大的帧间距

可以带来最流畅自然的体验呢？

手机、平板、智慧屏

等不同设备的屏幕大小不同

导致万能卡片的大小各异，

如果保持同样的动效时长和帧间距，

大屏设备的动效就会变得十分突兀。

所以，经过大量的研究，

设计团队归纳了

各类设备的最佳动效时长

和保证流畅的最大帧间距所处的范围区间

这为动效设计提供了科学的数据支撑，

进而给我们带来全场景下

流畅的动效体验。

万能卡片的初心，

就是要给大家带来服务直达的焕新体验

它的样子，它的交互，

还有在大家看不到的背后

都有着华为设计团队

对每个细节的思考、细琢

追寻着效率与美学之间的最佳平衡

这样的万能卡片，希望如你所愿！

编辑;jq