BeFor Web
为网而生 - 关注互联网及移动端产品的用户体验设计

《Design Systems》精华摘译(一)关于本书

《Design Systems》精华摘译(一)关于本书

我试试看做这件事,但并不大确定。连“摘译”这个词本身的含义也是昨晚查了一下才确认基本符合自己的意图。摘译,先摘后译,区别于“全译”与“节译”,取文之精华而(相对)快速译成。“精华”的标准或许会有主观之嫌;同样不确定。

原本计划全书翻译出版,却因版权相关问题耽搁而一直无法落实;这种情况下以任何形式全译并发布内容都有不妥,于是我们先做类似摘译或读书笔记的形式好了。

大体原则,是依照完整的章节顺序,选取精华段落,或段落中的精华语句组织成文;以快速传达原文核心思想为首要目标,而不在形式上严格遵循原文词句。突然隐隐感到这是比全译更加费脑力的差事,不知为什么;试试看先。

第一期,前言与简介。下面进入译文。

关于本书

随着互联网的飞速发展及产品复杂度的提升,以“页”为单元来思考界面设计的方式变得越发不可行,我们需要更加系统化的思维方式。

设计体系不一而同,有些团队可以以此为基础构建出众的产品体验,并不断进行优化迭代;而有些则渐渐搁置,疏于维护,流于形式。

良好的设计体系有哪些特质?那些优秀的团队是如何打造和使用设计体系的?大量的观察、研究与思考促使我完成此书。

本书面向的读者

本书旨在帮助中小型产品设计团队更好地将设计体系思维融入工作当中。团队中的交互、视觉设计师及前端开发人员均能从中受益。

本书的研究范围

本书不会深入到设计体系以外的其他主题当中,譬如信息架构、内容策略或用研等方面。同样,这也不是一本技术书籍,不提供任何范例代码,虽然其中一部分内容与前端开发实践相关。

这是一本关于设计的书,但不会讨论“设计一款怎样的产品”或“如何设计一款产品”。本书所探讨的是如何以更加体系化的方式推动设计流程,以及如何围绕特定的产品目标及团队特质来构建设计体系。

本书的内容

第一部分:设计体系的基础构成

介绍设计体系的基础构成,包括设计模式与实践方法。

  • 设计模式(Design Patterns),可复用的界面组成要素,包括:
    • 功能性设计模式:按钮、文本框...
    • 感知性设计模式:配色、字体…
  • 实践方法(Shared Practice),关于如何定义设计原则,创建组件库,以及如何管理设计模式,包括创建、提炼、分享及使用设计模式。

第二部分:如何创建设计体系

关于创建和维护设计体系的具体步骤与方法:

  1. 体系规划
  2. 界面清查
  3. 模式库创建
  4. 文档编写
  5. 体系迭代与维护

术语定义

“模式”或“设计模式”

用于指代任何可复用的界面组成要素,包括按钮、文本框、配色、字体,以及可复用的交互行为与功能流程等等。

“功能性设计模式”或“模块”

界面的实体组成要素,例如按钮、页头、表单元素、菜单等等。

“感知性设计模式”或“风格”

界面的非实体组成要素,涉及外观、品牌及情感化元素。

“模式语言”或“设计语言”

组成产品界面的一系列内在关联的设计模式,包含功能性模式与感知性模式,以及针对特定平台与产品领域的设计模式。

“设计体系”或“体系”

我们很难对这个概念进行精准定义;本书将其定义为“以数字化产品设计为核心的一系列标准化的设计模式与实践方法”。

“模式库”与“设计规范”

用于收集、提炼、使用和共享设计模式。

设计体系洞悉

本书基于真实产品设计而著,包括我所在公司的产品以及五个大家耳熟能详的产品及团队;我对他们进行了为期18个月的访谈和研究。

  • FutureLearn:在线教育平台,我所在的团队;我参与了设计体系从无到有的构建。
  • Airbnb:他们的交互设计师为我提供了大量关于Airbnb设计语言体系(DLS)的详细信息,关于如何精准定义和使用设计模式,具体的实践方法与工具等等,包括一些挑战和问题。
  • Atlassian:他们有独立的设计体系团队,同时也为所有人开放了相关权限,推动体系的进化迭代。
  • Eurostar:本书撰写的过程中,他们的团队正在创建第一套模式库,并遇到了一些典型问题,包括优先级的规划以及如何鼓励团队共同贡献;一年后,他们也有了独立的设计体系团队。
  • Sipgate:他们的第一套模式库建立于2015年,之后经历了一次重新构建,旨在统一各子产品之间的设计模式。
  • TED:他们以一种相对简单的在线文档的形式维护着一套设计规范。

本书的目录架构

第一部分

  1. 设计体系
  2. 设计原则
  3. 功能性设计模式
  4. 感知性设计模式
  5. 设计语言

第二部分

  1. 设计体系的范围界定
  2. 规划与可行性
  3. 功能性设计模式的系统化
  4. 感知性设计模式的系统化
  5. 模式库

英文原文:http://designsystemsbook.com,作者:Alla Kholmatova,译者:C7210

译文代表原作者观点。欢迎发表评论,或到译者微博进一步交流探讨。

本站原创编译文章。如需转载,请注明:本文来自Be For Web
译者信息: C7210 - 产品设计师、UX爱好者、译者、猫奴、音乐玩家。