设计体系诞生的初衷，其实是界面设计行业生产工具的升级，是工业化提升效率诉求的体现。从设计原则、设计语言、设计规范，到前端框架，再到设计系统，是设计者与开发者对更高效更优雅实践落地方法的一次次探索。期待未来设计研发一体化，让设计者从重复劳动中释放出来，实现从设计支撑到设计驱动的价值转化。
早期的设计体系以模块化思维主导设计规范的制定，强调页面制作的高复用和低成本。往往由设计与开发开始，在经过积累后抽取出其中的组件得以应用。当遇到组件库无法满足设计需求时，就创造出新的组件补充进组件库中。
有很多企业或社会团体创建组件库、样式代码、设计规范等工具以保证页面开发的界面统一性，却一直存在诸多问题，更新滞后、新组件可能会与原有样式代码冲突的问题。

原子设计

Brad Frost提出，“原子设计是一种基于网络设计系统思维方式的规范性原则”。它可以帮助网络设计者建立用户与产品元素互动的关系，以及如何将它们整合到一个整体的系统中。基于原子设计，设计系统先行，而后根据设计系统来完成业务与组件库搭建。这样做可以使得组件与业务同步更新并且多端响应。

当我们改变原子时，整个体系都会产生变化，同时我们也可以逐级调整，总之你的每次改变都会影响到这个系统，但是它又是保持一致性的。

设计体系

Material Design
Material Design是 Google 主导的设计语言。它和Apple的Apple Design、Microsoft的Fluent Design并列全球三大现代设计语言。由于取材于现实世界，Material Design很讲究反应出组件之间的（物理世界）层次关系，强调投影（Z轴）、动效、对比强烈的颜色的运用，更关心系统反应的质感、层次、深度，和其他物体的叠放逻辑。Google通过背后的隐喻来统一设计语言，在近年来安卓发布的Lollipop（5.0）、Marshmallow(6.0) 、Nougat（7.0）、Oreo（8.0）、Pistachio IceCream（9.0）中均可以看到Material Design身影。

Windows Guidelines
Windows Guidelines是基于Windows桌面应用程序的详细用户体验指南。它帮助设计师创建采用清晰视觉对象、有用控件和通用输入的桌面应用程序，从而营造令人难以忘怀的用户体验。详细地介绍了控件、消息、视觉对象、命令、交互展现形式，甚至还对包括语音和声调指南的UI文本标准等进行了定义。

SAP Fiori
SAP Fiori是适应SAP转型升级需要，在SAP UI5（SAP UI Development Toolkit for HTML5的简称）这一前端技术框架上创建出的一整套新的用户交互系统。2016 年 10 月，SAP Fiori 2.0版本用户体验设计概念在红点奖交互类设计竞赛中获得 2015 红点设计概念大奖。
Fiori 是 SAP 从自己庞大的业务模块中抽取、沉淀出来的设计规范，成功服务于 SAP 复杂且庞大的 ERP 系统。SAP Fiori包含了主要针对设计者查看的FioriDesign Guidelines，也包含了面向开发人员查看的 SAP UI5。

Bootstrap
Bootstrap是近年来极受欢迎的 HTML、CSS 和 JS 框架，用于开发响应式布局、移动设备优先的 WEB 项目，节省了浏览器兼容，大量提升组建复用并且响应速度很快。

Ant Design
中后台设计语言 AntDesign提供了一套非常完整的组件化设计规范与组件化编码规范，提供从界面设计到前端开发的全链路生态，大大提升设计和开发的效率。Material Design和Bootstrap，前者具有严格的设计规范，后者是纯粹的UI框架， 而Ant Design，介于这两者之间。它主要用于用于构建 PC web 中后台管理系统和简单前台展示系统。从设计角度讲，Ant Design的价值不及MD。