设计系统的完整指南
已发表: 2021-09-15设计系统传播者 Nathan Curtis 说:“设计系统不是一个项目。 它是一种产品,服务于产品。” 简单地说,如果你的软件产品或服务是你的演员,那么设计系统就是你的导演。
一个成功的 SaaS 品牌可确保其品牌标识反映在所推的每个产品中。 为了使这一努力取得成功,设计系统的实施势在必行。 否则,您最终可能会成为许多零散产品的管理员,而且没有一致性。
在这篇文章中,我们旨在引导您了解设计系统是什么,为什么应该拥有一个设计系统,以及创建一个可以有效指导您讲述品牌故事的出色设计系统的过程。
什么是设计系统?
设计系统是“单一事实来源”,它结合了团队用来设计和开发产品的所有组件。 这些元素包括品牌原则、特定的调色板、图标库、编码指南、共同的信念和工作实践等等。 它远非一堆代码片段和一组图形元素。
设计系统和风格指南有什么区别?
风格指南是设计系统的一部分。 样式指南将包含诸如字体类型和颜色等信息,以及编辑实践。 然而,如上所述,设计系统远不止于此。 设计系统会随着公司及其产品的发展而不断变化。
为什么需要设计系统?
为什么 Lonely Planet、Airbnb 和 Apple 等知名品牌都有设计系统? 使用设计系统的品牌和不使用设计系统的品牌有什么区别? 下次您浏览他们的任何网站或使用应用程序时,很少注意用户界面。 您将能够注意到它们之间的一致性,并看到它们反映了相同的精神。 您的用户体验要好得多,因为您可以准确地找到您正在寻找的东西。
那么设计系统如何帮助制造更好的产品呢? 让我们来看看其中的一些好处。
清除杂乱
设计系统努力将原本可以在孤岛中工作的元素组合在一起。 它介绍了一个共享的词汇表和常见的功能,并创建了一套关于如何将这些纳入 UX/UI 设计的指南。 这意味着即使不同的团队正在开发一个产品,他们也知道他们的设计基于什么。 这最终将导致凝聚力、一致性和更快的生产。 这是设计与用户建立信任的优秀产品的秘诀。
单一真理来源
我们前面提到,设计系统结合了设计过程中使用的各种元素。 由于它提供了关于构建产品的基本原则的指令,因此无需花费时间在多个平台上搜索正确的资产或资源。 设计系统随着公司及其开展的项目而发展,并且可以根据组织的不同要求轻松修改。
Creately 是创建设计系统的绝佳工具,因为它允许将设计系统的所有元素集中到单个画布上。 您可以为样式指南、图标库、图形资源和示例线框维护一个单一的工作区,并带有用于编码和编辑指南的嵌入式链接。 此外,这些工作区很容易在团队成员之间共享,他们可以在其中实时协作以添加更新和评论。
经济高效且省时
当设计系统到位时,混淆的空间就会减少。 这使得生产周期更快、更高效,因为高保真线框的设计更加准确。 由于产品是根据设计系统的指导方针设计的,最重要的是,错误最少,因此测试功能所需的时间要少得多。 此外,当产品根据设计系统制造时,维护变得容易且耗时更少。

一致性
当涉及到设计过程的任何部分时,设计系统可确保全面保持统一的一致性。 借助设计系统,可以确保产品的每个元素都能从明确定义和学习的行为中投射出一致的用户体验。
创建伟大设计系统的过程
前面我们提到,设计系统是为产品服务的产品。 它的基本目的是使团队能够使用一组共享的价值观和标准。 因此,在创建设计系统时,重要的是要明确定义“谁将使用它以及为什么?”。 理想情况下,设计系统应包括以下组件。

确定原则和共同价值观
确定您的目标,并确保每个团队成员都知道项目的发展方向以及团队要实现的目标。 实施一组共享的团队价值观,以在协作者之间灌输一种共享的心态。 确保清楚地传达此类目标和价值体系的变化。
在此类别下包含设计原则也很重要,因为它们是指导团队实现产品真正目的的指导方针。 例如,与其以不同的风格设计产品的不同组件,团队可以坚持使用更简单、更简约的用户友好型设计。 此外,数据库和信息源也属于该组件,以促进可访问性。
确定品牌标识
您的品牌标识是您希望您的品牌在目标受众中的感知方式。 这包括使用的调色板和字体、徽标以及用于营销您的产品或服务的视觉语言。 品牌标识在保持所有产品的一致性方面发挥着重要作用。 准备一份包含以下信息的文件,
- 公司标志
- 标志的颜色
- 视觉传达中使用的二次色(如果适用)
- 主要字体
- 主要图标
有一套编辑指南
编辑指南应包括所用语言的语气和语气、需要在所有产品中突出显示的特定单词以及营销材料和大小写和标点符号的标准指南。 这些确保所有公司通信传达一组与品牌标识一致的信息。
创建模式库
模式库是设计系统中最重要的组成部分之一。 模式库包含 UI、参考文档和页面模板样式的标准指南。 模式本质上是关于以在整个页面或 UI 中保持一致性和凝聚力的方式使用标准组件的说明。 这应包括根据原则和品牌标识设计界面时要遵循的指南的技术文件。
文件编码标准
代码是每个应用程序或网页的大脑。 它控制产品的功能。 因此,开发应用程序不同组件的团队在开发它们时遵循相同的原则是谨慎的。 这可能还包括有关兼容浏览器和设备的信息、版本历史以及实施模式的指南。
创造成功的产品
你的产品有多成功,主要取决于用户体验和观众如何看待它。 这就是为什么设计系统对于创建赢得用户的产品很重要的原因。 当他们将秩序带入混乱时,他们开始讲述您的品牌故事并推动您产品的真正目的。 这使用户可以无缝地浏览应用程序并准确找到他们正在寻找的内容。
