figm字节跳动如何实现产品体验的一致性?ArcoDesign给出了一部分答案( 二 )


然而,只要涉及到魔改,就不可避免地会遇到升级问题。只要升级底层组件库,就有可能导致样式甚至功能出现出现不可预知的改变,为了求稳,就需要锁版本,锁了版本又没办法享受版本升级带来的新特性和 bug 修复,陷入一个恶性循环的怪圈。
figm字节跳动如何实现产品体验的一致性?ArcoDesign给出了一部分答案
文章插图

魔改容易造成的恶性循环
为了解决样式定制难这个痛点,Arco 从设计之初就对组件进行了细致的拆分。
组件是设计系统提供的最底层能力。Arco 提供了 67 个基础组件,这些基础组件足以支撑绝大多数的业务需求。
figm字节跳动如何实现产品体验的一致性?ArcoDesign给出了一部分答案
文章插图

一键切换“暗黑模式”
1)风格样式定制
ArcoDesign将影响组件视觉的样式都抽离到了 token 之中,token 是最小化描述组件样式的变量,组件库中是以 less 变量的形式存在。从全局变量到组件级变量,用 token 来解释组件,用上千个 token 变量,来保证通过配置变量,就能对样式风格进行任意定制。
比如现在越来越多的网站会考虑支持暗色风格切换,“暗黑模式”会让使用者更加专注自己的操作任务,同时在夜间或暗光环境使用下可以减少屏幕光对眼睛的刺激,避免在黑暗环境中长时间注视高亮光源带来的视觉刺激。ArcoDesign支持一键开启暗黑模式,无缝切换,流畅体验。
2)默认行为定制
Arco 支持 60+ 组件默认行为的全局配置,以极大的灵活性,减小维护成本、提升开发体验。用户只需要维护一份全局配置,就能定制每一个组件的默认交互。
值得注意的是,除了上述能力,ArcoDesign还有助于简化传统项目上线前反复验收的繁琐流程。
figm字节跳动如何实现产品体验的一致性?ArcoDesign给出了一部分答案
文章插图

传统的情况是,当设计确定设计稿,开发通过上述提到的样式定制和默认行为定制去定制符合设计规范的基础组件,在上线之前需要反复地跟 UI 进行样式还原验收,同时从设计稿到研发再到 UI 走查验收。
Arco 提供了样式可视化编辑的「风格配置平台」。基于风格配置平台所见即所得的组件配置能力,用户可以对全局样式和组件样式做细粒度的调整,实现「ArcoDesign to Any Design」,大幅提升流程效率。
figm字节跳动如何实现产品体验的一致性?ArcoDesign给出了一部分答案
文章插图

在配置完成之后,用户可一键发布主题到主题市场,提供优秀的主题风格给社区。在主题市场上,用户可以浏览所有主题,自由地进行选用。
figm字节跳动如何实现产品体验的一致性?ArcoDesign给出了一部分答案
文章插图

依托系统的 ArcoDesign 设计规范,即便是无设计师参与的平台产品,ArcoDesign也可以帮助开发者快速构建专业、一致的体验。
2. 二次开发和复用能力得益于 Arco 组件灵活的 API 设计以及物料平台提供的定制化组件解决方案,用户可以基于 Arco 快速开发满足自身特定需求的定制组件。定制化的组件将更好地复用业务代码,促进团队协作,提升开发效率,更可与社区共享丰富的物料资源。
3. 设计和开发更好地协作Arco希望通过提供全流程完善的生态体系,提升设计、开发全流程工作体验。
三、全流程完善的生态体系figm字节跳动如何实现产品体验的一致性?ArcoDesign给出了一部分答案
文章插图

1. 生态平台