01
介绍设计系统
在20世纪60年代，计算机技术开始超越软件编程的速度。计算机变得更快，更便宜，但软件开发仍然缓慢，难以维护，并且容易出错。这种差距，以及如何处理它的困境，被称为“
。
1968年，在北约软件工程大会上，道格拉斯麦克罗伊提出了基于组件的开发作为解决这一两难问题的可能方案。基于组件的开发提供了一种通过使代码可重用来加速编程潜力的方法，从而使其更高效，更容易扩展。这降低了工作量并提高了软件开发的速度，使软件能够更好地利用现代计算机的强大功能。
现在，50年后，我们遇到了类似的挑战，但这次是在设计上。设计正在努力扩展其支持的应用程序，因为设计仍然是为个别问题量身定制的解决方案。
您是否曾进行过UI审核，发现您使用了几十种类似的蓝色色调或同一按钮的排列？将您的应用程序中的每个UI都加倍，您就会开始意识到您的设计已经变得不一致，不完整和难以维护。
图1. UI审计收集了简单UI元素的许多排列，以说明您的团队的设计债务有多深。
对于这种状态下的设计来跟上开发速度，公司可以做三件事之一：
雇用更多的人
设计更快
创建适用于多个问题的解决方案
即使有更多的手工作更快，现实是定制设计根本无法扩展。定制设计缓慢，不一致，并且随着时间的推移越来越难以维护。
设计系统使团队能够更快地构建更好的产品，使设计可重用 - 可重用性使得规模成为可能。这是设计系统的核心和主要价值。设计系统是可重复使用组件的集合，由明确的标准指导，可以组装在一起构建任意数量的应用程序。
50多年来，工程师已将其工作付诸实施。现在是设计实现其全部潜力并加入它们的时候了。
通过系统思考扩展设计
你可能很清楚，设计系统现在已经成为软件行业的一个热门话题，而且有充分的理由。D esign正在缩放。许多企业正在投资设计，因为他们认识到他们产品的客户体验提供了竞争优势，吸引并留住了客户，并降低了支持成本。
以下是投资设计的公司内部通常的情况：
设计团队正在成长
设计嵌入整个公司的团队中，可能在多个地点
设计在所有平台上的所有产品中都发挥着关键作用
如果你是一名设计师，这种设计投资可能听起来令人兴奋，但随之而来的却是很多挑战。当许多团队拥有您产品的各个部分时，您将如何在平台上设计一致的UI？您将如何授权所有这些团队快速迭代？您将如何保持不可避免的设计债务，这将使许多设计师创造新的和量身定制的设计？
要了解创建设计系统如何应对这些挑战，我们必须了解设计系统是什么。设计系统将2个概念与个人优点相结合，使其比单独的部分更强大。
标准
掌握Macintosh用户界面的技术知识是产品设计的关键因素，但了解用户界面背后的理论可以帮助您创建出色的产品。
MACINTOSH HIG
苹果
不仅要了解系统设计背后的原因，还要了解原因，这对于创建卓越的用户体验至关重要。定义和遵守标准是我们如何创造这种理解。这样做可以消除经常在产品团队中产生摩擦和混淆的主观性和模糊性。
标准包括设计和开发。标准化命名约定，可访问性要求和文件结构等内容将有助于团队一致地工作并防止错误。
视觉语言是您设计标准的核心部分。定义颜色，形状，类型，图标，空间和运动的目的和风格对于创建品牌一致和一致的用户体验至关重要。系统中的每个组件都包含这些元素，它们在表达品牌个性方面发挥着不可或缺的作用。
没有标准，决策就变得武断，难以批判。这不仅不会扩展，而且会产生不一致且令人沮丧的用户体验。
创见平台
您的视觉语言可以超越平台，在Web，iOS，Android和电子邮件中创建连续性。在您的设计系统网站的显眼位置记录并显示您的视觉语言。这将有助于系统贡献者了解组件的外观和行为方式。
例如，Google的Material Design深入探讨了他们视觉语言的各个方面。看看他们的颜色页面。
要让他们遵守指导方针并不难，很难让他们就指导方针达成一致意见。
洛瑞卡普兰
ATLASSIAN的
Lori Kaplan是开创性的Macintosh人机界面指南（HIG）的合着者，讲述了它们的创建以及对设计人员和开发人员的影响。
组件
组件是系统中可重用代码的一部分，它们充当应用程序界面的构建块。组件的复杂程度。将组件简化为单个功能（如按钮或下拉菜单）可提高灵活性，使其更具可重用性。更复杂的组件（如特定类型数据的表）可以很好地满足其用例，但这种复杂性限制了适用方案的数量。组件的可重用性越高，您需要维护的越少，规模就越容易。
基于组件的开发通过使代码可重用来减少技术开销。标准管理这些组件的用途，样式和用法。在一起，您可以为您的产品团队配备一个易于使用的系统，并为您提供一个明确将其与原因相关联的理解。
设计系统的价值
让我们详细了解设计系统可以成为您日益增长的痛苦的急需止痛药的多种方式。
规模设计
随着团队的发展，设计师通常会专注于搜索和发现，帐户管理等应用程序的离散区域。这可能会导致一种支离破碎的视觉语言 - 就像设计中的巴别塔一样 - 每个设计师都会说出自己的语言。当设计师单独而非系统地解决问题时，就会发生这种情
由于没有通用的设计语言来统一产品，用户体验也开始崩溃，设计过程也是如此。当缺乏设计惯例时，设计批评变得无效。要在团队中创建一致，必须有一个共享的真实来源 - 一个参考官方模式和风格的地方。
大多数情况下，这是静态工件，例如设计模拟，但静态引用几乎会立即过时。这就是为什么团队建造像Shopify的Polaris站点这样的纪念碑- 一个用系统构建的设计系统站点，它记录了系统的所有方面，包括组件，指南和UX最佳实践。而且因为它是用系统构建的，所以它始终是最新的。
内部设计系统站点是产品团队最好，最容易获得的事实来源。它提供了引力，使团队成员保持一致并保持同步。
管理你的债务
随着申请及其团队的年龄增长，他们会建立债务。不是金融债务，而是技术和设计债务。债务是通过短期建设获得的。设计债务由过多的不可重用和不一致的风格和惯例组成，而利益是维持它们的不可能完成的任务。随着时间的推移，这种债务的积累成为减缓增长的重要因素。
创造行为本身并不会产生债务 - 就像花钱并不会产生金融债务一样。但是使用设计系统可以通过降低设计和代码开销来保持预算，同时仍然允许您扩展和改进应用程序。
设计一致
标准化组件使用一致且重复地创建更可预测且易于理解的应用程序。标准化组件还使设计人员可以将更少的时间花在注重风格上，而花更多时间来开发更好的用户体
原型更快
在现有设计系统中工作允许您将流动和交互拼接在一起，就像从垃圾箱中拉出乐高积木一样快。这使您可以构建无数的原型和变体进行实验，帮助您的团队快速获得洞察力和数据。
更快地迭代
无论是改进UI的样式还是将UX更改为流，使用设计系统都可以减少数百行代码到少量字符的工作量。这使得迭代快速而轻松，实验速度更快。
提高可用性
不一致的接口约定会妨碍可用性。当无数独特界面元素及其交互的CSS增加时，认知负荷和页面权重也会增加。这会带来糟糕的用户体验。它还可能会创建冲突的CSS和JavaScript，可能会破坏您的应用。通过使用设计系统，您可以通过构建整体的组件库而不是每页来避免这些冲突，这意味着您将花费更少的时间进行质量保证。
建立可访问性
通过优化残疾人，慢速Internet或旧计算机上的可访问性，可以在组件级实现可访问性。这是一个简单易用的胜利。在第3章“构建您的设计系统”中，Katie Sylor-Miller解释了设计系统如何帮助您提高产品的可访问性并符合您所在国家/地区的法律。
大规模创造更好的产品 - 在每个屏幕上提供一致的体验
设计系统的神话
即使有了它们的所有好处，创建设计系统的支持仍然可以在内部进行。设计师可能感到有限或受限制，但这些感知的弱点往往是设计系统的最大优势。
当你出售创建设计系统的想法时，让我们揭穿你会听到的常见神话。
神话1：太有限了
神话：嵌入应用程序离散区域的设计师可以看到可能与其他领域不同的品质。因此，普遍系统被认为过于局限，可能无法满足这些特定领域的需求。
现实：设计师通常最终会创建自定义解决方案来改善应用程序的离散区域，从而增加设计和技术债务。通过设计系统，可以创建新的解决方案并将其反馈到系统中，从而使每个人都可以使用这些改进。
神话2：失去创造力
神话：如果设计师被限制使用设计系统，那么设计师将不再自由探索风格。前端积压通常充满了设计风格的更新。发展应用程序的视觉风格通常不是一项小任务。这也可能是一个很大的风险，因为它会从新功能工作中移除资源，并可能对可用性产生负面影响。
现实：设计系统的组件是相互依赖的。这意味着当在一个位置进行更改时，更改将在整个系统中继承。这使得系统内的样式更新变得微不足道，但影响更大。曾经几周 - 如果不是几个月的工作，现在可以在一个下午完成。
神话3：一个完成
神话：设计和构建设计系统后，工作就完成了。
现实：设计系统是生活，意味着需要不断维护和改进。但是，由于应用程序由系统的可重用组件提供支持，因此应用程序会自动继承系统的改进，从而降低维护应用程序的工作量。这是设计系统提供的缩放功能。
结论
很多原始愿景都是关于视觉识别......我们开始明白它必须是一个具有非常强大的交互设计基础的系统。
RICH FULCHER
谷歌
设计系统不是一种时尚甚至是未经测试的假设。为了找到满足技术快速发展所需的规模，基于组件的设计和开发是一种经过验证的可靠解决方案。
既然您已经看到了创建设计系统的真正价值，那么让我们在下一章深入探讨实际的设计过程。
