阿里云设计语言：打造云计算设计领域的语言体系

阿里云进化设计语言建立至今已经有1年时间了，在这个期间，我们一直潜心于它在业务中的使用与渗透。时至今日，我们将系统的为大家讲解，这个几乎运用在阿里云业务方方面面的“设计师之间交流的语言”。

   全文共4888 字，阅读需要15 分钟

在阿里云成立的10余年里，云计算在不断的重塑这个世界：人工智能、大数据、虚拟现实、物联网、边缘计算。越来越多的存在于虚拟世界中的概念正在重新定义我们所理解的现实生活。

与之同时，设计师也迎来了更广的创作空间，我们的画布从传统网页到三维互动、从「真实世界」到「虚拟世界」。我们要去形象化的概念，也不再局限于常规的认知：负载均衡、弹性公网、对象存储、云盾，如何把这些计算领域的概念具有识别度又统一的传达给用户，是我们面临的全新挑战。

我们希望用户在任何场景、任何终端，当接触阿里云的产品或服务时，会基于同样的设计语言形成一致的认知、可延续的行为习惯和统一的品牌心智。对隐匿在云端背后的我们，统一的设计语言也能够帮助大家在进行设计输出时，保持一致性，从“思维”的一致到“产出”的一致，全方位保障输出物达到“阿里云设计”的质量。

这也是我们建立设计语言的初衷。

Evolving Design 相信新范式会不断出现，科学进步的规则便是打破规则。ACD设计进化系统是不断变化、不断混合、不断自进化的。未来随着智能和科技的发展，思考、意识、创意会更加扩大化，知识与实践也会更加混合。

而当我们截断进化设计模型后，可以看到上图右侧这样一个分层的结构，它就像地质层一样，每一层都有不同的变化速率和规模范围。外部可以对冲击快速反应，内部的迭代相对缓慢。这样结构使得整个模型可以持续的运行和进化。

如果说阿里云设计的背后是逻辑与理性所主宰的计算世界，那么，如何将计算世界之美展现出来是我们必须且一直在攻克的课题。当虚拟空间成为云计算设计的画布，设计师该如何系统地组织空间中的元素、如何让空间中的图形兼具功能、逻辑和美感？以下，便是阿里云设计给出的答案——

 设计观点 

观点1 : 秩序 - 秩序是生命之匙

秩序是计算之美和逻辑之美在图形宇宙中最底层的制约和最基础的框架，是阿里云设计风格中不可或缺的设计表达。我们将其使用三个栅格维度来定义——空间栅格、矩阵栅格和混合栅格。

观点2 : 虚实 - 让虚拟更真实

作为连接真实世界和虚拟世界的阿里云设计语言，我们总是在尝试如何让非物质的、虚拟的概念，被现实世界中更易理解的方式去表达。

观点3 : 几何 - 充满想象力的几何

我们使用的设计元素不是繁复装饰与复杂造型的。我们巧妙的运用平面几何和立体几何去搭建阿里云充满想象力的世界。

观点4 : 运动 - 运动体现智能

运动不仅可以辅助设计去表达概念、功能和状态，也可以作为一种品牌风格和技术指导，让云计算的设计更具智能感。在阿里云的产品设计中，它辅助了其抽象概念的传达；在B-Design的色彩中，它让品牌与界面呼吸起来，为其带入了科技与智慧感。

设计原则 

原则1 : 高效 - 清晰且高效

我们为用户提供清晰、简洁、易使用的设计规范，帮助用户快速建立高效、美观、清晰的企业级产品体验。

原则2 : 一致 - 一致且统一

一致性是体验设计中最重要的原则之一。一致性原则主要保证阿里云生态下的产品使用体验一致，用户学习成本降低，形成一个通用的操作语系。

原则3 : 包容 - 开放包容

设计系统打造简单操作体验、高品质设计质量的同时，保持开放和通用性。通过提供不同场景的适应案例，来保证不同行业、不同领域的业务的接入。

原则4 : 专业 - 面向专业的设计

阿里云设计系统强调专业性，其中包括：面向专业的人群、清晰准确地传达专业的知识、定义专业的操作方式、洞察不同领域与行业的专业性。

 设计价值观 

价值观1 : 基石 - 设计向善
设计向善，我们期待的不仅仅是片面的为善行而设计，而是更宏观的以设计之力解决生活生产之惑，解决人与人、人与物，与自己内心之间的诉求。设计向善，是设计师的基本责任。

价值观2 : 同行 - 寻找人性美好的最大公约数，寻找同路人
君子和而不同，求同尊异。志合者，不以山海为远；道乖者，不以咫尺为近；星光伴行，不负同路人。

价值观3 : 远方 - 不为设计，为未来
未来是科技文明的时代，是游走于现实生活，技术迸发和思想异托邦（Heterotopia）之间的不确定。路虽漫漫修远，吾辈亦将上下而求索。

从宏观到微观、从品牌到原子，我们希望通过丰富且一致的元素，体现阿里云独特的科技魅力。

在宏观的阿里云品牌设计中，我们用富有想象力和科技感的风格表达品牌形象。代码、计算、几何、抽象、动态，是我们诠释和呈现阿里云虚拟云上数字世界的方式。

光标——阿里云的超级符号，源于阿里云LOGO图形中的核心“-”，代表着coding、数字世界最小的基础单位和通往数字世界的起始点。

在微观的进化设计原子中，我们也定义了：栅格、文字、质感、图标、产品形象、插画、摄影、色彩、数字可视化、板式等多类规范，这里我们将重点讲述5个核心内容。

 云产品设计体系 

云产品形象是阿里云产品实体化、品牌化的设计表达，产品形象以简洁、立体和轻科技的方式表达产品的核心理念和特点。每个产品形象的设计都会根据其产品特性而各不相同，但所有产品都应遵循统一的设计规范进行设计。

为保证所有产品的透视一致，同时方便对产品模型进行灵活复用，我们将4x4的方形矩阵栅格应用到了空间中。在空间中，它规范了格局的大小、展示的模型量、模型尺寸和布局。

产品形象规范中包含白色非透明材质、白色透明/半透明材质及橙色发光/非发光材质，我们用不同材料的隐喻去体现产品的特性。

按照实际应用场景的空间大小及表现的信息数量，从2D ICON到场景Banner，产品识别体系递进分为四个层级：2D ICON、3D ICON、产品形象和场景Banner。

绝大多数云产品均无法在现实世界中找到直接参照物，因此在设计时应充分结合产品特性特点，发挥空间和抽象想象进行灵活的设计。

 图标 

图标作为可视符号，提供了一种 “视觉速记”的形式。它能更好的利用熟悉的形状和隐喻，并以简单的图形形式传达信息。阿里云图标体系由三部分构成，分别是：UI Icon / Pictogram / Product Icon。规范阿里云图标体系，一方面在体验层面保证图标基因元素的一致性，另一方面为设计提效保驾护航。

在计算设计语言引领下，阿里云图标以极简的几何形态作为识别特性。在图标设计时应避免无序、无逻辑、不稳定的随机形态，一切形态表现均应在一个无形的几何空间内完成。

所有二维图标应绘制在相应大小的基础方形网格框架上，轮廓线的笔划宽度固定。这样可以确保图标在导出时将保留其所需的比例和周围空白区域的一致性。

图标风格从阿里云品牌气质中提炼，每个图标都经过设计，保持图标基因细节和特征的一致性，使它们在视觉上可以很好地融为一体。

 插画 

插画是一种能将产品功能等抽象概念，以直观且轻量方式呈现的一种视觉表达形式，具有亲和力和易读性。在阿里云官网产品详情页、新手引导、大促营销、线下活动等场景都能看到插画的使用。规范阿里云插画体系，既能提高设计效率，也能保持全站插画风格的一致性，提高品牌辨识度。

作为计算设计语言的延伸，阿里云插画风格具有简洁轻巧、扁平块面、几何结构等特征。融入“有秩序的想象力”，将抽象的计算信息和科技概念用充满克制力和逻辑美学的插画进行表达。

使用20px*20px为基础单位的矩阵网格进行制图，保持秩序感。常在矩阵网格的基础上加入直径为20px、40px等大小的圆形作为辅助栅格，方便进行曲线设计。

将45°和90°作为常用角度，其他特殊角度以15°递增/减。

以标准的矩形和圆进行旋转、剪切、组合等方式得到插画造型，并按照栅格摆放。禁止出现大量圆角或随机的弧线。

基于“高效组合”原则，我们为设计师提供了Sketch Library，内有丰富的素材可供快速拼搭使用。

 质感 

阿里云设计中有很多三维设计场景，在三维空间中，属于阿里云的独特质感是什么呢？我们认为它不是传统科幻电影中的深色金属和发光材质，阿里云的质感应该细腻又稳定、轻盈又有力量的。最终我们选定的图形材质分别是：哑光材质、磨砂金属材质和发光玻璃材质。

例如，在网站首焦中我们用磨砂金属材质去表达产品稳固的特性以及计算空间的虚幻与宏大。在营销设计中，我们用磨砂金属材质与哑光材质去搭建场景，构建出具有阿里云设计风格且又丰富多元的营销世界。

 摄影 

阿里云是全球前三大云服务提供商，致力于以在线公共服务的方式，提供安全、可靠的计算和数据处理能力，让计算和人工智能成为普惠科技。摄影素材无论在网站上还是线下材料中，都需要给予用户对于品牌的第一感受。因此，阿里云所使用的摄影素材应当能够传递出“严谨”、“可靠”、“规则”、“稳定”的气质，充分且一致地体现出阿里云的品牌形象、产品能力、以及设计风格。

设计原则有这样几条：规则和秩序——严谨而有规律的风格基调；专业和商业——面向专业用户，面向商业场景；技术和创新——尝试新的交互和技术，提供创新的体验。

 阿里云首页改版 

作为设计语言的最佳实践，阿里云首页改版灵活的应用了设计语言的4大关键词：「虚实」「秩序」「几何」和「运动」，作为首页改版视觉升级的核心观点，给予风格的指引和设计的推导。

 阿里云营销设计 

如何体现阿里云计算世界的营销氛围？阿里云营销体系在设计语言核心观点的基础上，大量使用了云产品形象和质感，进而从风格层到元素层，由内而外的营造出阿里云独特的营销风格。

 阿里云产品品牌 

从用户最初了解阿里云产品的详情页面、到新品发布会的直播界面和新品推广的手册与宣传，我们运用产品形象打造了一致的品牌认知，让每一款产品在阿里云这个大品牌下，都有自己的识别度。

 数据库品牌 

经过多年的沉淀，数据库的产品形象也形成了自己的系列：数据库PolarDB、数据库RDS MySQL、数据库OceanBase、数据库Redis、数据库MongoDB等，每一款都有自己专属的形象与特征。数据库的产品形象也被广泛的应用在各类业务需求中，如下是数据库全系列，以及线下印刷的2款技术白皮书。

 互动玩法 

除了视觉的展现，产品形象也被应用在了虚拟的互动体验中。设计师将模型减面和优化，变成在3D环境也可以流畅互动的虚拟模型。

 云栖大会 

2020云栖大会的实践是「几何」与「虚实」两个设计语言关键词的最佳体现，设计师用「榫卯」的概念去体现思想的碰撞和重组。构件之间的连接结构是稳固的，以此代表科技的刚性；不同构建之间的重构结合，预示技术的多变与无限可能，以此代表科技的柔性。

2021年云栖大会设计语言中更是覆盖在了主会场的产品发布场景和云栖会场中的产品展区和产品能力大屏。他们帮助虚拟的云产品，更形象化和品牌感的表达自己，给到用户一致的品牌认知。

 线上峰会/直播 

疫情期间，阿里云也将贯穿全年的线下峰会调整为线上，设计语言为多场景的产品发布和产品直播提供支持。

 数字化产品管理平台 

为了保证用户前、中、后台视觉体验的一致性，我们也将产品形象覆盖在了数字化产品管理平台的产品详情页中，强化用户对产品品牌的识别，也辅助用户建立对云产品统一的认知。

阿里云进化设计语言诞生于技术的迭代和需求的演变，我们会在这个过程中不断的完善与补充它。也正和我们提出的进化设计论一样，设计语言会在快速更迭的时代中，强化意识、化解冲击。

除了上述内容之外，我们还有更多内容等待挖掘，后续我们会逐个发出设计哲学、设计原子的详细解析文章。与之同时，也可以在PC端打开我们的官方网站 design.aliyun.com，了解全部设计细节：

 阿里云设计语言项目组 

子玉/筱弘/砚萌/巧巧/野一/嘉欢/洋气/聿茗/海洋/十修/欣苗/大上/舒石/巧茹/君沫/斐虹/三咩/小韦/易晓/零源/小瞧/耳铃

（包含设计语言建立&应用成员，排名不分先后）

---

 About us 

不设限，不追随，不为设计为未来

我们是阿里云设计中心

 Presented by 

 Follow us