设计系统适用于谁？

我的意思是特定的设计系统。设计系统作为一种概念，几乎任何网站都可以从中受益。

如今，设计系统非常火爆。就在前几天，一个组织公开了他们的设计系统，我收到了很多私信、邮件和 Slack 消息，鼓励我去看看。我说：“看起来不错”。但我只是在敲新车的引擎盖，这么说吧。我没有坐进去。我没有开着它绕街区转一圈，更不用说开着它跨越整个国家或试图从座椅缝隙里掏出麦片了。我相信如果我用它构建了 10 个网站，我会有更多意见（原谅我混淆了比喻）。

所以，这让我产生了一些疑问。我可以用这个设计系统构建网站吗？我应该用它构建网站吗？它适合我吗？或者等等…这是给谁用的？

它们都有手风琴。

好吧，不是所有都有，但请耐心听我讲，因为这里有一个重点要说明。

Bootstrap 也有手风琴！开发者完全理解 Bootstrap。

无论你对 Bootstrap 有何看法，我认为它并没有引起太多困惑。您链接 CSS，使用他们提供的 HTML，然后 — 💥 — 您就有了可以使用的组件。

Bootstrap 可能更像是一个“模式库”，而不是一个“设计系统”。我不知道。这种区分可能有一些道理，但命名语义（如果有的话）似乎可以互换使用，因此将 Bootstrap 区分为其中之一并不能消除任何困惑。

开发者使用 Bootstrap 是因为…

• 它帮助他们更快地构建。
• 如果他们本身不是特别擅长 HTML 和 CSS，他们可以获得高质量的“开箱即用”体验。
• 他们希望网站可访问，而 Bootstrap 已经经历过可访问性的考验。
• [插入您的理由。]

这些都很有吸引力，但似乎是任何设计系统的基本要求，并不仅仅局限于 Bootstrap。

嗯…也许我会四处看看，为我的下一个项目选择一个非 Bootstrap 解决方案。

很多人都在同一条船上。

也许下一个项目是 React，所以我们想要一个让 React 成为一等公民的设计系统。也许我们在定制 Bootstrap 时遇到了问题。也许我们只是看到了另一个设计系统的默认外观，认为那更适合我们。也许我们只是厌倦了 Bootstrap。有很多理由去寻找 Bootstrap 之外的其他选择，就像有很多理由选择 Bootstrap 一样。

既然其他设计系统也都有手风琴，那我能不能…随便选一个？

差不多吧？

首先要考虑的是许可证。Salesforce 的 Lightning Design System 通常被认为是设计系统领域的领导者，并且影响了当前围绕设计系统的许多想法。 然而，它 不是开源许可的. 实际上，它是开源许可的。它对除字体和图标以外的所有内容使用 BSD Clause-3（类似 MIT）许可，而字体和图标使用知识共享署名-禁止演绎 4.0 许可。有人告诉我：“任何人都可以在与 Salesforce 无关的项目中重复使用代码。他们只是不能以过于模仿该系统的方式重复使用它。”

这没什么问题 — 对 Lightning 来说可能是一件好事。它并不是针对地球上所有 Web 开发者的通用即取即用系统。它是为 Salesforce 和在不同开发堆栈上为 Salesforce 构建东西的众多团队准备的。如果您不是在构建 Salesforce 项目，它不适合您。

那么，为什么它要公开而不是作为 Salesforce 团队的内部文档？我无法代表他们回答这个问题，但据我了解，Salesforce 太庞大了，内部和外部团队都在使用它。因此，也许将 Lightning 作为公开文档是使其可供所有需要它的人使用最有效的方式。

这是我们 SLDS 团队正在积极讨论的事情。当使用场景如此具体时，“开源”对设计系统究竟意味着什么？它更像是“源代码可用”吗？

— Alexis Córdova (@acordova) 2019 年 4 月 9 日

还有一个不错的附带效应，就是他们会获得良好的宣传，这对于招聘工作来说只有好处。我还听说，拥有一个公开的设计系统可以引发有趣且有益的对话.

Carbon Design System 另一方面，是开源许可的。他们还有整整一节解释谁应该使用该系统

Carbon 是 IBM Design Language for product and web designers 的官方实现，代表着不断增长的设计资产和指导生态系统。Carbon 提供了全面的用户界面指南、设计工具包和文档，帮助设计师更快、更智能地工作。

这并不完全是我想知道的。它看起来像开箱即用的 IBM 产品，所以它绝对是为 IBM 设计的。

它是开源的，所以如果我想用它，我可以用它。但它真的适合我以及我的随机项目吗？他们希望我用它来做这些事情吗？我是他们在这个项目中考虑到的随机开发者吗？还是说它是 IBM 优先，随机开发者其次？

公司优先，世界其次。

如果设计系统是由公司创建的，那么它就是为公司创建的。它也可能是开源的，但任何想要使用它的随机开发者都不是目标用户。

它甚至可能不是由公司创建的，而是由政府创建的！

一个非常棒的设计系统是 美国 Web 设计系统，它刚刚 发布了 2.0 版本。它很漂亮！它看起来非常完整，并且具有一些很棒的功能。它拥有一个优雅的自定义字体，它是为了逐步采用而设计的，它既包含有用的组件，也包含实用程序，并且是使用 设计令牌 按原子方式构建的。也许最好的功能是，它非常易于访问，因为法律要求它必须易于访问。

美国 Web 设计系统 大部分属于公有领域，所以您可以完全使用它。但它并不是为了您而设计的；它是为了帮助为政府制作网站的人们而设计的。

（顺便说一句，美国 Web 设计系统欢迎贡献，这非常酷，因为您可以通过这种方式对对人们生活非常重要的网站产生重大影响。）

我的想法是，开源设计系统并非旨在重复使用和自行构建，而是旨在学习和应用于您自己的系统。

— Mike Dick (@miked1ck) 2019 年 4 月 9 日

还有一个重要的事情：设计系统存在可定制性的范围，这是有意的。

即使您在技术上可以使用您找到并喜欢的公开设计系统，您也可能需要考虑可定制性。这方面存在一个完整的范围，但让我们考虑极端情况和中间情况。

• 不可定制：我们构建了这个系统来严格地强制执行内部一致性。
• 预选变体：我们提供三种不同颜色的手风琴。
• 自建主题：我们会提供一个骨架，它能松散地实现模式，而您则可以根据自己的喜好应用样式。

在可定制性范围内的所有位置都存在设计系统。Bootstrap 可能介于后两者之间，您可以获得完全样式化的主题，但可定制性主要来自设置 Sass 变量，而这会创建无限的变体。

Polaris 是 Shopify 的设计系统，它是开源的，但专门用于 Shopify 的东西。他们故意**不**想做 Bootstrap 做的事情（他们告诉我）。它更多地是关于强制一致性和坚持一个凝聚的品牌，而不是把一个页面拼凑起来并进行定制。

Material Design 绝对是 Google 的东西。Material Design 的故事是，Google 在各种平台上拥有大量的产品。这**很容易**成为一个设计和品牌不一致的混乱。相反，Google 开发了 Material Design，并成功地将其应用到整个帝国。这是设计系统中一个非凡的成功故事。所以我不认为说 Material Design 是由 Google 为 Google 设计的有什么不对。

但如今，他们绝对鼓励其他开发人员使用它。默认情况下，这会让你的东西看起来像 Google 的东西。

但他们正在积极努力使 Material Design 更具可定制性，以便您可以融入自己的品牌。到目前为止，看起来有一个Sketch 插件可以帮助您做到这一点。对于我们这些编码人员来说，他们的 Material Components 仓库看起来是用 Sass 构建的，很多东西都是用您可以覆盖的变量设置的。请查看有关定制的本教程。

定制 Material Design 有很多成功案例。像 Lyft、Zappos 和 NPR 这样的公司，它们都有自己的强大品牌标识，都使用了定制的 Material Design。

这使得 Material Design 的信息传递更加棘手和有趣。它绝对是为 Google 设计的，但显然它也是专为任何想要使用它的人设计的。这种信息传递可能有效，因为 Google 拥有资源和感知力，能够以我认为其他公司品牌设计系统难以实现的方式做到这一点。

---

如果这还不明显（我非常担心它不明显），设计系统不是商品。我们不能简单地选择一个拥有最漂亮的手风琴并将其用于下一个项目。我们甚至可能不被允许使用它。它可能被有意地为特定公司打上品牌。这里有各种因素需要考虑。

我的告别建议实际上是针对公共设计系统的制造商：**清楚地标识这个设计系统是为谁设计的，以及他们能够用它做什么。**

我还想指出，在过去几周里，我向所有我提起过这件事的人，他们对设计系统中的所有这些目标受众信息传递内容都有不同的看法。当然，我很乐意阅读您对它有何感想的评论。