像做产品一样对Design System进行前期规划

@C7210 ：于 Design System，个人为仍难进行最精准的概念定义，包括产类、阶、规模，团队构成、，甚至连同整个公司/组织在产侧的策略可包含进来，都会对谓「设计体系」的存在目的与方式产生决定的影响。

因此我聊到的，仅是当前我在自己面对的特定工作情境中的状况；某些方面或许具备普适性，而另外一些方面或许只供特定角的参考。

一、像做产品一样

何为「像做产一样」？这里特指《户体验要素》这本书定义的最为经典的产设计思维模，即是将「设计」流程分为五个层面，从最为本质和抽象的核心发依次向上梳至 User Interface 表现层面，大致包括：

• 目标：定义方面目标，所谓「方面」即是指司业务目标、产品设计目标及用户目标；围绕「产品」这一「实体」，对各方面的痛点、诉求进行辨识整。
• 范围：基目标定义，界定产品信息/功能范围，判别最为必要与核心的要素/有目标现的要素/概念相关但与当前目标现无关的要素。
• 结构层：在明确界定的信息/功范围当中，梳信息/功架构，定义流程。
• 框架层：将信息架构与功能流程具化，即通过相对低保真的形式对界面流程关系及界面信息层级行组织呈。
• 表现层：细化界表现形，结合品特质与情感化要素界进高保真呈现。

△ 图片来自crowdfavorite.com

无论作还活中，诸多事务都会体类似的逻辑框架，即依次明确什么（Why）、什么（What）、如何（How）。以我们产品设作中硬核的「思维框架」打造产品设作中硬核的「具框架」，这事儿自然然，符合逻辑。

二、Design System的前期规划

规划主遵循五层思维模型的三层面，即对「目标」、「范围」、「结构」行义。需再次明，相关验仅与特产品/团队状况相关，思供参考。

1. Design System的目标

Design System，顾思义，体系化的作，需短内集约重/的资源行构建，并保持的维护/化作。对于这种级的事项，必须顾全多方面的目标，充分达共识，能尽可能争取资源，并形合力。目标所涉及的对象或可包括：

设师

设师 Design System 直接的「用户」，能否解决设师作中的实际痛点，这也 Design System 关键的价之一。目标或可包括帮设师规范作流程，使具、方法、产出加标准化，提高执行效率，提升设思考的作比例；此外对于新设师速入标准化作状态的作用也考虑到。

设团队

解决直接「用户」的痛点的同时，Design System 设团队层面行赋能，例如提升设团队公司内/外的专业度与影响力。

产品

Design System 所解决的问题终将体实际产品的体验当中，譬如提升产品/产品家族交互、视觉表、品牌识别层面的一致性，提升产品体验与公司品牌形象；无法升到产品/业务层面的解决方案都只空中阁。

2. Design System的范围

界 Design System 的作用域，譬如：

• 产：针对单一产，还是需要横跨整个产族；仅针对线上产，还是需要包含线务链当中的每一个户/客户触点。
• 面向人员：仅面向设师（交互/视觉/创意/料/空间/全链），还需涵盖产品理、程师下游相关职能。

3. Design System的结构

基用域范围的界定，梳理 Design System 的信息架构。之前的相关文章当中也有介绍，通常意义上的设计系大致包括以下最为典型的组成部分：

基础要素

• 颜色（Color）
• 文字（Typography）
• 样式（Style）
• 栅格（Grid）
• …

设计模式

• 组件（Component）
• 模块（Module）
• 动效/动画（Transition/Animation）
• …

计规范

• 全局
• 价值主张
• 计则
• 品牌规范
• …

素

• 功能义
• 类型/状态
• 应用则
• 应用示例
• …

同时对更为义的「设计工标准化」而言，或进一步包括流程与方法规范、工具规范、素材与产出形式规范等等。

此外，对于「基础要素」和「设计模式」这两分来说，采层级更为复杂、同时更具灵性和工程性的「Atomic Design」作为架构设计思路是非推荐的。你可将上的架构示例解为抽象层面的逻辑梳，而非针对最终的产形式而严格区分。

图片素作者：Paul Olek1