《Design Systems》 by Alla Kholmatova 

 阅读时间：3分钟

我知道你们不会看的 但我还是推荐一下这本书吧 

1 

我读了蛮久的因为单纯读英文书比较难边带翻译

我读的吭哧吭哧的

先说下简单感受：除了哇塞我靠这么牛逼怎么做这么好设计师怎么活

当我读到中间的时候才知道品牌公司都有自己的设计原则和设计系统

大公司对设计的要求极其严格甚至严苛

就连线条按钮投影大小字间距等都有异常严格的系统规范

他们对设计的追求非常细微多一分为多少一分为少

有时也在想自己到底是在工作 还是在干嘛

离真正的设计差之千里

2 

适合人群：3年经验以上的设计师

或者准备建立公司设计系统和设计规范的设计师

因是外文著作需要做点准备不然一读就放弃（英文好的忽略）

读前准备：

英文水平：4级以上

翻译工具：Google翻译或其他工具翻译

浏览器：Google浏览器科学上网（里面有大量的外国设计网站需要看）

阅读器：类似PDF（方便做笔记标签保存）

3 

书中有大量的资源网站并且也提供了DownloadUI Kit网站也很精美

看这些感觉就是一种精神滋补（科学上网）

Aribnb DLS Atlassian  BBC GEL   IBM Carbon   Lonely PLanet Rizzo

Marvel  Office Fabric  Salesforce Lightning   Design System   Shopify Polaris

书中部分设计原则任何一个展开都是很大一部分

书中也做了Airbnb设计和TED设计之间的对比

提到最多的也是熟知的的设计原则

• large title

• large thumbnail

• more spacious layout

• a heading

• a strong call to action

• an eye-catching background (solid color or image)

• color

• interactive states

• animations

• typography

• spacing

• iconography styles

• shapes and borders

• illustrations

• photography

• voice and tone

• sounds and audio cues

Positive and encouraging tone of voice

Primarily white color palette with pink accents

Generous white space

Generally large type size with a focus on readability

High-contrast typography with proportionally large headings

Vibrant pink to blue gradient

Pink to blue subtle hover interactions

1px light-gray strokes

1px square icons with a “break”

Mostly square and occasionally circular shapes, trian- gles in promotional areas

For each category add:

Type:Specify the type of object the color is applied to, such as a call to action, a heading, a feedback message, and so on.

Example: Add a screenshot of the element, to show where color is used.

Value:Specify the hex value.

Feel:If the purpose of the color is to create a certain

mood or feel, specify that.

Examples of perceptual patterns in digital products include tone of voice,

typography, color palette, layouts, illustra- tions and iconography styles,

shapes and textures, spacing, imagery, interactions or animations, and all

the specific ways in which those elements are combined and used in an

interface.