HarmonyOS流转卡片设计规范分享 原创

鸿蒙时代
发布于 2021-12-15 14:54
浏览
1收藏

服务流转是 HarmonyOS 的分布式操作方式。流转能力打破设备界限,多设备联动,使原子化服务可分可合、可流转,实现如邮件跨设备编辑、多设备协同健身、多屏游戏等分布式业务。开发者通过嵌入流转图标,可以便捷地将服务流转到不同 HarmonyOS 设备,包括但不限于智慧屏、平板、手表、音箱等设备,也可灵活地切换和管理流转任务。流转实现多设备的协同联动,为开发者提供更广的使用场景和更新的产品视角,强化产品优势,实现体验升级,打造 HarmonyOS 超级终端服务体验。
HarmonyOS流转卡片设计规范分享-鸿蒙开发者社区

流转的流程包括流转触发、流转连接和流转结束三个阶段。在每个阶段用户都会接触到不同的控件以推动流程的进行。流转到我的设备,HarmonyOS 致力于打造无缝的超级终端体验。服务在已授权设备之间流转,无需鉴权,一键直达。流转到更多设备,为提供更广泛的使用场景和更便利的使用体验,HarmonyOS 也同样支持将服务流转到其他未授权设备上。流转到其他设备需要对端设备确认后方可流转。流转触发,根据触发方式的不同可分为系统推荐流转和用户手动流转。

系统推荐流转,当用户使用原子化服务时,所处环境中存在更优的可信设备,系统则自动为用户推荐设备,用户可确认是否启动流转,使服务智能无缝地流转到对应设备上运行。
HarmonyOS流转卡片设计规范分享-鸿蒙开发者社区

用户手动流转,开发者也可在原子化服务中内嵌规范的流转图标,使用户可以手动选择合适的设备进行流转。用户点击图标后,会调起系统提供的流转面板。面板中会展示出原子化服务的信息及可流转的设备,引导用户进行后续的连接操作。
HarmonyOS流转卡片设计规范分享-鸿蒙开发者社区

 流转连接,流转到我的设备,HarmonyOS 致力于打造无缝流畅的流转体验。用户可以通过推荐气泡或者流转图标发起在我的设备(指已授权的 HarmonyOS 设备)间的服务流转。推荐气泡发起,当检测到用户周围有更优的可流转设备(指已授权的 HarmonyOS 设备),屏幕上即会出现推荐气泡,用户点击推荐气泡完成服务的一键流转。流转图标发起,用户也可自行点击服务内的流转图标,调起流转面板选择要流转的设备进行流转。流转到更多设备,当用户需要将服务流转到其他未授权设备时,可以通过点击流转图标调出系统提供的流转面板来实现。用户选择要流转的非授权设备,对方设备上首先会显示一张介绍卡片来告知被流转的服务信息。当对方同意后,对方设备屏幕上会显示出多功能码,通过扫描以完成设备认证和服务流转。

HarmonyOS流转卡片设计规范分享-鸿蒙开发者社区
流转连接控件,开发者在开发流转功能时,也需要关注流转控件的开发:流转面板,点击流转图标后,会拉起系统提供的流转面板进行流转的发起和结束。在流转面板中,开发者需要提供图标、名称及标题。介绍卡片,介绍卡片用于向用户展示服务内容及来源信息,因此开发者在开发流转服务时,需要提供服务的封面图、图标、名称及标题。流转结束,对于协同类的服务场景,在流转连接完成后,还需要支持服务后续的管理。开发者需要在服务页中内嵌正在流转状态的流转图标,使用户享受顺畅的全流程体验。当用户需要结束流转任务时,除了直接关闭服务的方式外,也可以通过再次调出流转面板来完成。用户点击图标调出流转面板,点击“结束流转”按钮或者再次点击正在流转的设备以结束流转任务。
服务流转图标,为了保证在不同服务内流转体验的一致性,请使用 HarmonyOS 的流转图标。请不要创造流转图标样式,也不要绘制模仿流转图标。官方提供了多种图标颜色以适应不同的界面背景。
HarmonyOS流转卡片设计规范分享-鸿蒙开发者社区
转图标为矩形图标,尺寸上请保持与其他业务图标等大,并与其保持安全距离。
HarmonyOS流转卡片设计规范分享-鸿蒙开发者社区

交互状态,服务未转时使用默认状态图标,服务正在流转时使用静态或动态蓝色高亮图标。点击流转图标后,会拉起流转面板进行服务发起和结束。
HarmonyOS流转卡片设计规范分享-鸿蒙开发者社区

图标位置,根据业务特性及体验继承综合考量,您可将流转图标置于一级界面或二级界面的特定位置中。一级界面中可将流转图标置于界面右上角或者底部工具栏。
HarmonyOS流转卡片设计规范分享-鸿蒙开发者社区

请参考一级界面示范样式,不要将图标放在一级界面内非右上角及底部工具栏位置。

HarmonyOS流转卡片设计规范分享-鸿蒙开发者社区

二级界面中可将流转图标置于由“更多”或“分享”入口拉起的菜单弹出框或者底部弹框。当“更多”及“分享”入口同时存在时,优先选择“分享”入口。
HarmonyOS流转卡片设计规范分享-鸿蒙开发者社区

请参考二级界面示范样式,不要将图标置于三级界面以上及不相关入口内。

HarmonyOS流转卡片设计规范分享-鸿蒙开发者社区

长视频类服务,针对于已有跨设备业务的长视频类服务,为保证界面精简与认知一致,可以考虑将流转图标与原有业务图标进行融合。例如长视频服务具有投屏业务图标,点击图标后在选择设备的界面中可嵌入流转图标。
HarmonyOS流转卡片设计规范分享-鸿蒙开发者社区

界面术语。使用术语:请使用流转到……、支持、使用、启用、兼容等术语。图标与文本:请勿在文本中单独穿插图标。异常提示:异常提示请调用系统控件(即时反馈或弹出框)对用户加以提醒,异常提示字符请使用规范用语。
本文根据HarmonyOS官方文档学习整理分享

©著作权归作者所有,如需转载,请注明出处,否则将追究法律责任
HarmonyOS流转卡片设计规范学习分享.docx 2.1M 13次下载
1
收藏 1
回复
举报
回复
    相关推荐