不能缺失的设计基本原理—《写给大家看的设计书》个人解读

上一次的文章里我提到的这本书，那么我也顺便再这里写下读书笔记吧。这个可以说是适合新手看的枕边读物，功能性比较强的一本书，虽然内容的插图会比较有点年代感，但是里面的基本设计原理还是能运用到各个设计方面。我个人建议如果喜欢纸质书的设计师们，可以买下来阅读，不同阶段的你反复看回以前的保存下来的书可能领悟到的东西也不一样。但是只想了解一下这些基本原理的设计师，可以买电子书。这个也是挺环保的。

简介：

Robin Williams是世界著名的设计师、技术专家和畅销书作家。通过写书和授课，她已经影响了整整一代数字设计师。同时，作为Adobe和Mac技术社区内的偶像级专家，她拥有大批的拥戴者。她是Publish Magazine、Adobe Magazine等杂志的专栏作家，是MacWorld Expo等业界重要活动和组织的顾问委员会成员，还创办了Santa Fe电影艺术学院。除本书外，她还著有几十部畅销图书和获奖著作，包括The Non-Designer's Web Book、Robin WilliamsDesign Workshop、TheLittleMacBook等．有的书已被翻译为15种文字，产生了世界性的影响。

第一部分　设计原则

1　约书亚树
4大基本原则
2　亲密性
亲密性小结
根本目的
如何实现
要避免的问题
3　对齐
对齐小结
根本目的
如何实现
要避免的问题
4　重复
重复小结
根本目的
如何实现
要避免的问题
5　对比
对比小结
根本目的
如何实现
要避免的问题
6 颜色运用
不同凡响的色轮
颜色关系
互补
三色组
分裂互补三色组
类似色
暗色和亮色
建立你自己的暗色和亮色
单色
暗色和亮色的组合
注意色质
暖色与冷色
如何取舍
CMYK与RGB，印刷与Web

7 更多提示与技巧

个人浓缩以及案例分析：
上面是这本书的第一部分，设计原理。亲密性，对齐，重复，对比。这四大原理，我个人觉得第一部分就浓缩看这四个原理就ok了，不过前提是要将这四个原理找到现在的作品来觉例子，和归类，再来观察这四个原理的规律，让自己对这些原理更为深刻。那这个看书的方法才能将原理知识刻进你的心里，也可以说做到一目十行快速阅读且能精读的效果！！

那么，我就运用这个方法，写下这本书的笔记。

一.亲密性：

 

根本目的：在新手的设计中，词语，短语和图片四处分布，连角落也不放过，它们占据了每一处空间，以至于根本没有任何留白，这种情况比比皆是。看上去似乎是设计者们不敢留白，不过要知道，如果一个设计中充斥着太多的内容，这个页面就会显得杂乱无章，读者也无法从中很快看到所需要的信息。

 

亲密性的原则是指：将相关的项组织在一起，相关的项将被看为一体的一个组，而不是一堆彼此无关的片段。下面就举些例子：

图一：

图二：

图一图二的效果看上去，还是让人觉得很新奇美观的排版。但是，是不是你的目光都被图片吸引了，没有发现重点的信息是什么。那么再想想，是不是这种感觉在图一里面表现的更加强烈。为什么会这样子？

那就是亲密性可能做得有点欠缺。

字体：

1. 从整体上看，图一的亲密性还是很弱。如果多个项相互之间又很近的亲密性，它们就会成为一个视觉单元，而不是多个孤立的元素。如果把类似的元素组织为一个单元，马上就会带来很多变化。（我们将目光转移到图一图二，虽然字体不一样，但是图一的信息却是分散各处，不能组织成为一个视觉单元。图二，字体是做到将字体组织为有关联的感觉，让人觉得这是一块单元，而不是散落的元素。这么一说是否大家觉得两个图的单元，元素的感觉更为强烈了。）

2. 从解开部分来看，图一的亲密性还是做得很好，也很值得我们学习的。在这部分看，整个排版，是把各个元素组合为单元，看起来是会舒服许多

对比效果：

 

颜色上看图一图二是统一的，亲密性也是强烈。字体的对比图一会较为弱一点。就打个简单的比方，如果是标题那么就要把标题和正文区分开来，就要用对比效果去实现了，颜色对比，深浅比对，粗细对比，等等。这样子就可以将类似的元素统一起来，形成亲密性。

根本目的：

亲密性的根本目的是实现组织性，尽管其他原则也能达到这个目的，不过利用亲密性的原则，只要简单地将相关的元素分在一组建立更近的亲密性，就能自动实现条理性和组织性。如果信息有条理，将会更容易阅读，也更容易被记住。此外还有一个很好的“副产品”利用亲密性原则，还可以使用空白（这是设计师最喜欢的）更美观更有条理。

怎么实现：

微微眯起眼睛，统计你的眼睛停顿的次数来数一数页面上有多少个元素。如果页面上的项超过3-5个（当然具体情况具体分析），就要看看哪些孤立的元素可以归类在一起建立在一起成为一个视觉单元

二.对齐：

设计新手往往比较草率，只要页面上刚好有空间，就会把文本和图片放在那里，而全然不考虑页面上面的其他项。这样得到的页面会给人一种杂乱无章的感觉。其实到现在我的设计有时候对齐这个问题还是很严重的。这个也是细节的表现。

任何元素都不能在页面上随意安放。每一项都应当与页面的某个内容存在某种视觉联系。

那么对齐大家肯定也是各有千秋的各个办法。不过我相信大家对于文字很多的段落，应该怎么去对齐，才可以让其版面很看起来很整齐呢。我发现对齐这一章，我最受益匪浅的一个内容就在这里。那我就展示一下我自己对这个知识点的理解。(下面的图我特意用ps标注一下)

往往我会被这种段落弄得很头疼，但是考虑到有规则的参考物作为对比，那么不规则的段落也就可以根据这个规则的元素进行排列了，而且上下图的版面看起来是不是变化很大。A与B的变化，的确会让整个版面看起来更整齐。

根本目的：

对齐的根本目的是使页面统一而且有条理。其效果类似于把客厅里四处散落的东西放在一个箱子里。不论创建精美的，正式的，有趣的还是严肃的外观，通常都可以利用一种明确的对齐来达到目的

怎么实现：

要特别注意元素放在哪里，应当总能在页面上找出与之对齐的元素，尽管两个对象的物理位置可能相距很远

三.重复性：

设计的某些方面需要在整个作品中重复。重复元素可能是一种粗字体，一条线条，某个项目符号，颜色，设计元素，某种格式，空间关系的的。大家可能看到的任何方面都可以作为重复元素。举个例子

先认真看看整个页面哦，再看下面的两句话，我认为这样引导大家去看下面的两句话（我认为是“重复”这一个单元里的精华）那你会突然感觉。“恩的确是这样子”恍然大悟的感觉。

重复的几何突出了想展示的内容，重复的元素也让人感觉到连贯性，而且更加能吸引用户的注意力，这两句是我觉得整个重复这一文章的精华。

根本目的：

重复的目的就是统一，并增强视觉效果。不要低估页面视觉效果的威力，如果一个作品看起来很有趣，它往往也更易于阅读

怎么实现：

重复可以认为是保持一致性，而且我相信你早已经这样子做。现在，需要把现有的一致性更向前推一步。再看看有没有可能增加一些纯粹为建立重复而设计的元素等等。

四.对比：

对比是为页面增加视觉效果的最有效的途径之一，很容易吸引读者去看一个页面，另外对比还能在不同元素之间建立一种有组织的层次结构，要记住一个重要规则：要想实现有效的对比，对比就必须强烈，千万不能畏畏缩缩。

来看看各种对比的效果吧：

颜色对比：

文字对比：

另类效果对比：

当然肯定也有点线面的对比，那么大家可以自己下次留意一下什么效果是点.线.面之间的对比啦。我就不一一举例子了，那也让大家来练习练习这种读书方式，找现实例子，去证实理论的可行性。这种方式会令你对书里的理论更深刻。

根本目的：

对比的根本目的有两个方面，这两个方面相辅相成，无法分开。一个目的是增强页面的效果。另一个目的是有助于信息的组织。

怎么实现：

可以通过字体选择，线宽，颜色，形状，大小，空间等等来增加对比。增加对比很容易，途径很多，这可能是增加视觉效果最有意思也最让人满意的方法了。重要的是：对比一定要强烈。

好了，这次就写到这里了，接下来这本书还有其他的章节就靠大家自己去仔细看看这本书了，结合现在的作品来对自己做一个评价，我想应该也是一个进步很快的学习方法吧，拿以前的作品，来掂量掂量，感觉作品不满意，在根据这些理论灵活运用和改动，我相信一定能跳出瓶颈期。这个也是我自己最近总结出来的新学习方法。希望可以帮助到大家，其实写下这个读书笔记，我自己也是得到很大的帮助的。那么，我们再见在下一本书喽。

那么具体的很多详细信息，就靠大家去看看这本书再回头分析这上面的图了，相信会受益匪浅。写下自己的理解我相信一定会比我这篇勉勉强强的读书笔记更要深刻。

而我写下这篇读后感也是对每一本书的尊重，让看到的内容刻在心里，而不是过目即忘。

                                                        作者：蚕丝