上一篇我们讲到了阿里云B-Design如何应对多变的SaaS和行业交付场景,提供:2.风格化与品牌强化元素,帮助合作伙伴和企业透传自己的品牌。
接下来,我们继续聊一聊如何打磨细节,建设高品质的设计案例3.打造设计品质
当企业内部系统变为商品,摆在市场上被比较,被选择的时候,设计品质会是最先触达到用户的,在行业SaaS的时代,设计品质感将成为产品的差异化竞争力。观察海外优秀的云化SaaS类产品,无论Salesforce,还是Jira,Dynatrace,无不在体验的细腻和界面的品质上下足功夫。B-Design希望扭转企业级设计长久以来简单,枯燥,只强调效率的设计现状,赋予阿里云企业生态更强烈的风格和品质感,打造一个年轻,生动,专业的设计形象。原子级的组件(component),是一切设计系统的基石,B-Design的组件基于阿里云控制台Xconsole设计体系打磨多年的设计经验,除了常规通用组件外,也提供如多维筛选,代码编辑器等专业组件。
原有云计算组件的基础上,B-Design将呼吸色,圆角,企业级配色体系等融入其中,给出更加灵活的多变,更细腻的设计方案。
有别于阿里云控制台强调一致统一的设计标准,B-Design使用了圆角与阴影的设计风格,提供多种尺度和层次的设计供用户选择。
圆角的设计使控制台看起来更为亲和、友好。圆角的设计会贯穿在B-Design组件、卡片和页面布局中,配合多个层级的阴影效果,更清晰地展示信息层级。
在企业级产品后台中,数据可视化部分是最不可或缺的,也往往是高光的部分。
B-Design通过对阿里云及行业交付领域大量案例的分析和比对,结合云运维、云安全、城市数字化、线上线下数据共享等领域场景,整理出一套完整的,用于数据可视化的配色与布局方案。
曾经一度,我们也认为只有C类设计才需要使用动画效果来吸引用户的眼球。但事实上,面向企业的设计中,自然,流畅,符合预期的动效不但可以提升产品的品质感,也可以很好地帮助用户理解信息。
在B-Design中,动效的出现旨在「连接“元素、用户、品牌”」,在专业的场景中,使用动效不仅仅为了吸引用户注意,更在于连接相关的信息,用户心智,和品牌元素。我们也沉淀出具有云计算和B-Design特点的一些典型动效供用户选择。
如果你去观察,会发现超过七成的工程师们都喜欢使用暗色的代码编辑器和工作台。对于为什么专业开发者偏爱暗黑色或许可以推给宇宙未解之谜。但提供暗黑版本,是定位「服务专业开发者」的B-Design不可或缺的部分。
针对暗黑版本,B-Design有针对性地构建配色模式,响应状态,和大部分核心组件。
④
阿里云成功经验沉淀行业设计模板
阿里云的企业生态包括面向行业的解决方案,企业级SaaS产品及专业的开发运维工具等。在继承阿里云的设计风格和元素的同时,我们希望阿里云生态下的设计师与合作伙伴,能够专注自己的业务逻辑,快速搭建高级和有品质的产品体验。
下面是B-Design的设计案例集合,出自于我们在不同领域和行业的设计实践。
想看更多的设计案例详图?可以关注下一篇B-Design的视觉设计详解
⑤
去中心化的演进方式
Nathan Curtis曾在他的文章《 Team Models for Scaling a Design System 》详细介绍了不同类型的设计系统模型:Solitary(独一式)Centralized(中心式)Federated(联合式)。
在我们以往定义设计规范的过程中,往往是采用「独一式」或者「中心式」,由一个团队进行规范的定义和维护,其他设计师执行,强调一致,统一。这种模式适合一个集中的系统,保证产品内部的全面规范。
B-Design 当前还处于 V1.0 的成长初期,我们的场景来自于阿里云不同业务的设计师和产品,来自不同业务中提炼出的共性和特点。但 B-Design 还需要在更多产品、场景中锻炼,吸收各方的意见和建议。后续我们会陆续补充组件的前端范式,典型的设计模式与场景,以及面向行业的设计指南。敬请期待...
我们希望 B-Design 面向行业,保持开放,坚持包容的,联合的,去中心化的设计共创。让更多中小企业和合作伙伴,能够基于 B-Design 的风格进行快速的定制和再创作,形成适合自己场景的设计规范和子系统。
未来,在设计系统的基础版本定义完成后,我们希望以开源化的方式来运作 B-Design,让它不止是属于阿里云的,也是属于云时代的,属于领域和客户的。云计算生态下的各个行业开发者,设计师,都可以参与 B-Design 的共创,利用 B-Design 的风格建立属于自己的设计模板,设计规范。
在这个时代,阿里云在驱动行业实现快速的数字化转型,建设云化的企业服务生态,帮助中小企业和合作伙伴搭建自己的SaaS产品。B-Design希望能够以设计的方式助力这一进程,让云计算生态下的设计师,开发者,用户都能享用一个简单,专业,高品质的设计体验。
© 文中所有影像数据为样例数据,仅供示意;版权归阿里云设计中心所有,未经授权不得转载。
About us
不设限,不追随,不为设计为未来
我们是阿里云设计中心
Presented by