莫b

上一篇我们讲到了阿里云B-Design如何应对多变的SaaS和行业交付场景,提供:1.灵活包容的设计框架,同时建设阿里云的 ;2.风格化与品牌强化元素,帮助合作伙伴和企业透传自己的品牌。小伙伴们可以复习这一篇《B-Design:云时代的企业设计-上篇

接下来,我们继续聊一聊如何打磨细节,建设高品质的设计案例。

 

3.打造设计品质

当企业内部系统变为商品,摆在市场上被比较,被选择的时候,设计品质会是最先触达到用户的,在行业SaaS的时代,设计品质感将成为产品的差异化竞争力。观察海外优秀的云化SaaS类产品,无论Salesforce,还是Jira,Dynatrace,无不在体验的细腻和界面的品质上下足功夫。
B-Design希望扭转企业级设计长久以来简单,枯燥,只强调效率的设计现状,赋予阿里云企业生态更强烈的风格和品质感,打造一个年轻,生动,专业的设计形象。

 

专业化组件升级

原子级的组件(component),是一切设计系统的基石,B-Design的组件基于阿里云控制台Xconsole设计体系打磨多年的设计经验,除了常规通用组件外,也提供如多维筛选,代码编辑器等专业组件。

原有云计算组件的基础上,B-Design将呼吸色,圆角,企业级配色体系等融入其中,给出更加灵活的多变,更细腻的设计方案。

图片

B-Design基础组件合集

 

圆角与阴影

有别于阿里云控制台强调一致统一的设计标准,B-Design使用了圆角与阴影的设计风格,提供多种尺度和层次的设计供用户选择。

圆角的设计使控制台看起来更为亲和、友好。圆角的设计会贯穿在B-Design组件、卡片和页面布局中,配合多个层级的阴影效果,更清晰地展示信息层级。

图片

 

数据可视化

在企业级产品后台中,数据可视化部分是最不可或缺的,也往往是高光的部分。

B-Design通过对阿里云及行业交付领域大量案例的分析和比对,结合云运维、云安全、城市数字化、线上线下数据共享等领域场景,整理出一套完整的,用于数据可视化的配色与布局方案。

图片

数据可视化演示案例

 

三维与微动效

曾经一度,我们也认为只有C类设计才需要使用动画效果来吸引用户的眼球。但事实上,面向企业的设计中,自然,流畅,符合预期的动效不但可以提升产品的品质感,也可以很好地帮助用户理解信息。

在B-Design中,动效的出现旨在「连接“元素、用户、品牌”」,在专业的场景中,使用动效不仅仅为了吸引用户注意,更在于连接相关的信息,用户心智,和品牌元素。我们也沉淀出具有云计算和B-Design特点的一些典型动效供用户选择。

图片

图片

部分动效演示案例

 

暗黑风格

如果你去观察,会发现超过七成的工程师们都喜欢使用暗色的代码编辑器和工作台。对于为什么专业开发者偏爱暗黑色或许可以推给宇宙未解之谜。但提供暗黑版本,是定位「服务专业开发者」的B-Design不可或缺的部分。

针对暗黑版本,B-Design有针对性地构建配色模式,响应状态,和大部分核心组件。

图片

B-Design浅色与暗黑模式

图片

阿里云RPA产品暗黑版风格演示

 

④阿里云成功经验沉淀行业设计模板

阿里云的企业生态包括面向行业的解决方案,企业级SaaS产品及专业的开发运维工具等。在继承阿里云的设计风格和元素的同时,我们希望阿里云生态下的设计师与合作伙伴,能够专注自己的业务逻辑,快速搭建高级和有品质的产品体验。

图片

B-Design行业实践合集

 

下面是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希望能够以设计的方式助力这一进程,让云计算生态下的设计师,开发者,用户都能享用一个简单,专业,高品质的设计体验。

图片

© 文中所有影像数据为样例数据,仅供示意;版权归阿里云设计中心所有,未经授权不得转载。

 

原文地址:阿里云设计中心(公众号)
作者:阿里云设计中心

图片

转载请注明:学UI网 » B-Design:云时代的企业设计-下篇

登录收藏
 
你可能喜欢的:
作为设计师,我是如何一步步找到业务增量的作为设计师,我是如何一步步找到业务增量的
品牌设计体系如何构建 | 网易智企品牌设计体系化实录品牌设计体系如何构建 | 网易智企品牌设计体系化实录
给爸妈最硬核的春节礼物 百度大字版APP幕后给爸妈最硬核的春节礼物 百度大字版APP幕后
你必须要知道的优惠券产品设计(上):细节设计剖析你必须要知道的优惠券产品设计(上):细节设计剖析
开言英语品牌提升探索开言英语品牌提升探索
从0到1的产品,如何一次性解决所有异常和加载状态?从0到1的产品,如何一次性解决所有异常和加载状态?
去卖场化 - 阿里云双十一B端营销设计去卖场化 – 阿里云双十一B端营销设计
百度贴吧感知体验升级百度贴吧感知体验升级
B-Design: 呼吸视觉B-Design: 呼吸视觉
超多知识点!服务设计概述及国内外案例分析超多知识点!服务设计概述及国内外案例分析