|
书引 《设计体系：数字产品设计的系统化方法》作者研究过各类公司建立设计体系的经验，向我们展示了如何通过构建设计体系以支撑数字产品的设计，在符合团队文化的基础上，确保设计体系能够帮助实现产品目标。 本书面向的读者：尝试将设计体系融入组织中的中小型团队 △ [英] 阿拉 • 霍尔马托娃，2019 本书简介「 应当先做设计再出规范，还是先出规范再做设计？」 「如果老板的意见与设计师自己的想法相左，设计师应该坚持己见吗？」 这些都是工作中常常会遇到的问题，它们很难被彻底解决，为了改善它们，一些优秀的设计团队开始以更为系统的方式展开设计工作——构建一套设计体系。谈到设计体系，最容易想到的是各种控件组成的 library，但这些仅仅是设计模式或者说是样式指导，我们需要将其纳入更大的体系之中，让这些模式之间紧密相连，形成一个整体，以确保设计体系能够有效帮助实现产品目标。 建立设计体系的优势： - 通过清晰的设计语言，明确产品调性
- 提高设计决策、设计与开发沟通的效率
- 让团队更加稳固
如果你对设计体系的理解还不是很清晰，可以先看看下面这些成熟案例： 1. 平台级设计体系 2. 公司级的设计体系 设计体系何谓设计体系，从设计实践的角度来说，它包含三个层级： 第一层级：组件库 界面中所有被复用的组件。比如按钮、文本框、标签页等，指导设计师及前端工程师高效开展工作。 第二层级：设计语言 设计语言是将产品塑造得独特且风格统一的一套法则。组件库仅仅提供了对同一类元素的约束，缺少不同类元素之间的联系。而通过设计语言，你可以明确元素之间的结构关系。 优秀的产品都会打造属于自己的设计语言，统一自身的风格且区别于其它产品。比如很多优秀的产品，剥离开它的 Logo，你依然能看出这是它的产品。 △ 反例——前一秒多么炙手可热，后一秒就多么朴实（图例来自知乎小螳螂品牌服务机构） △ 认出是哪款车了嘛 △ 特色白 第三层级：设计体系 组件库和设计语言定义了产品该是怎样的（what&how），却没有说明为什么是这样构建和定义的(why)？设计体系则包含以下内容：设计目的、设计原则、组件库、样式指南，以及设计与开发的工作流程的实用工具。它是构建设计语言和设计模式的底层基础。 书籍概述全书共分为两个部分。 第一部分讨论设计体系的基础——模式与实践。 模式指的是可复用的元素，它们之间相互关联，构成了界面的设计语言。 实践则是指创建、使用和共享这些模式的方法，比如确立一个使用原则和构建一个模式库。 第二部分侧重于阐释建立和维护设计体系的实际步骤和实用技术。 规划任务，编写界面清单，建立模式库，以及创建、记录、发展和维护设计模式等。 设计体系不是一夜之间就构建出来的，而是通过日常的实践逐渐形成的。为了让这个体系在团队中运行更有成效，我们需要理解它是如何运行的，它包含什么，出现问题的原因是什么，而团队的组织架构、企业文化、设计方式等都会影响设计体系。 第一部分要点概述第一部分的要点：设计目标、设计原则、共享设计语言、建构设计模式。 1. 目标建立设计体系的目的是为了实现产品的目标。 无论是团队的运作方式或是设计模式，都应该针对这个产品目标进行设计与优化。 高效的设计体系中，不同的子体系会因为同样的目标而相互连接，协调一致，如果设计体系发生割裂，会导致用户体验的割裂。 2. 原则坚实的原则是任何设计体系得以良好运转的基础。 不同公司有着不同的原则，有的侧重于品牌，有的侧重于团队文化，有的侧重于设计流程。设计原则很可能只适用于某一段时期或特定项目。 如何制定有效的设计原则： - 从目的开始。设计原则必须遵循产品的目的，传递产品的精神。
- 寻找共识。如果是在定义阶段，让团队成员各自回答关于设计原则的问题，从中寻找共识，确立优先级。
- 设计原则的描述要真实且贴切，实用且可操作
模糊的设计原则：明确 实用的设计原则：「第一优先级只有一个，什么是你希望用户最先看到的或最先用到的」 模糊的设计原则：简单 实用的设计原则：「把界面做到牢不可破，就像儿童玩具一样，确保用户可以随意探索，不会因为错误操作而崩溃。」 模糊的设计原则：有用 实用的设计原则：「从需求开始，去做调研、去分析数据，去与用户交流，而不是做假设。」 3. 共享设计语言设计模式需要通过设计语言连接起来，语言是协作的基础； 设计语言是整个团队为了打造有效而统一的用户体验而建立的，团队成员对于实现目标会有着相似的心智模型，才能更有效地进行设计创造。团队成员不仅要对语言形成共识，还要对语言的用法形成共识，包含如何创建模式以及使用设计模式的方法和原则。 建立设计语言的好处在于，它可以让我们较少地关注模式，而更多地关注用户，通过有效的设计语言弥合系统模型与用户模型之间的差距。 在确定设计语言的时候需要注意，要确保你的设计语言，可操作，可重现，见下图。 △ Tom Osborne的「视觉音量指南」 具体实践： - 让团队成员清晰理解品牌愿景，将设计体系作为入职培训的一部分
- 共享（在团队内宣贯及培训）设计方法、前端架构
- 细化工作细节：比如设计与开发统一命名；打造典型的界面库；定期进行模式库的更迭与维护
4. 设计模式设计师常遇到的问题是，如何将高层次的概念，比如设计原则、品牌价值等，物化为具体的用户界面元素。其实关键在于建立一种「优先级」的意识，比如对于 TED 来说，信息的清晰比美观更重要，因此在界面设计上，我们可以看到它们选择了更容易容纳长标题的布局方案，而没有妥协于美观度选择文字截断的方式。 △ TED网页设计 我们设计界面的目的有两个，实现某种目标以及创造某种感受，因此会产生两类模式，功能性模式和感知性模式。 功能性模式 功能性模式是界面中有形的组件，帮助用户或者激励用户完成某种行为。它的执行、内容、交互方式和显示效果可能会变，但是它所鼓励的核心行为保持相对稳定。团队需要充分理解模式的目的，才能确保它和用户的预期一致。 感知性模式 感知性模式则更像样式，它用来描述组件是什么类型的，给人的感受如何。比如两套结构相同的房子，传递出来的感受可以千差万别——一个温柔居家一个冰冷工业风。感知性模式可以让系统更为连贯，好的设计体系能够在品牌的一致性、创造性表达以及业务需求之间取得平衡，设计师无需过于拘泥于一致性。 由于数字设计已发展多年，大多数的设计模式都已打造成型并为人所熟知，设计师无需在此花费太多时间。如今，设计师和开发人员都希望建立动态的模式库，包含设计模式及其对应代码，见下图为 ant motion 的动态组件库。 △ ant motion动效组件库 作者：二楼自习室
| 
/3 
发表于 2020-5-13 10:35:00
